:root{--bg:#090a0c;--panel:#111318;--ink:#f4f1e8;--muted:#8f949d;--line:#2a2d33;--accent:#d8a84e;--green:#59bd83;--shadow:0 22px 70px rgba(0,0,0,.55)}[hidden]{display:none!important}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,"Sakira JP",sans-serif;letter-spacing:0}button,input,textarea{font:inherit}button{cursor:pointer;color:inherit}.shell{min-height:100vh;display:grid;grid-template-columns:220px 1fr}.sidebar{position:sticky;top:0;height:100vh;background:#0d0f12;color:#fff;padding:22px 14px;display:flex;flex-direction:column}.identity{display:flex;align-items:center;gap:10px;padding:0 8px 26px;font-family:Manrope}.logo{width:34px;height:34px;display:grid;place-items:center;background:var(--accent);color:#fff;border-radius:6px;font-weight:700}.sidebar nav{display:grid;gap:4px}.nav{border:0;background:transparent;color:#aeb4bd;display:flex;align-items:center;gap:11px;padding:11px;border-radius:6px;text-align:left}.nav:hover,.nav.active{background:#252119;color:#fff}.nav svg,.icon svg,.primary svg{width:18px}.logout{margin-top:auto}.main{padding:34px clamp(20px,4vw,64px);max-width:1500px;width:100%;margin:auto}.main>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.main h1{font:700 28px Manrope;margin:4px 0}.eyebrow{font-size:11px;font-weight:700;color:var(--accent);margin:0}.cost{background:#1b1d22;border-radius:6px;padding:8px 12px;font-weight:600}.composer{background:var(--panel);border:1px solid var(--line);padding:24px;box-shadow:0 3px 14px rgba(20,24,32,.05)}label{display:grid;gap:7px;color:var(--muted);font-size:12px;font-weight:600}textarea,input{border:1px solid var(--line);background:#16181d;color:var(--ink);padding:11px 12px;border-radius:5px;outline:none}textarea:focus,input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(216,168,78,.12)}.prompt-label{font:700 20px Manrope;color:var(--ink);margin-bottom:10px}.composer textarea{width:100%;font-size:16px;line-height:1.55;resize:vertical}.composer-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}fieldset{border:0;padding:0;margin:20px 0}legend{font-size:12px;font-weight:700;margin-bottom:10px}.platform-choice{display:flex;gap:8px;flex-wrap:wrap}.platform-option{display:flex;align-items:center;gap:8px;border:1px solid var(--line);padding:10px 12px;border-radius:5px;background:var(--panel)}.platform-option:has(input:checked){border-color:var(--ink);background:#211d16}.composer-actions{border-top:1px solid var(--line);padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:18px}.composer-actions span{font-size:12px;color:var(--muted)}.primary{border:0;background:var(--accent);color:#fff;padding:11px 16px;border-radius:5px;font-weight:700;display:inline-flex;align-items:center;gap:8px}.primary:disabled{opacity:.5}.section{margin-top:34px}.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.section-head h2{font:700 20px Manrope;margin:0}.section-head p{color:var(--muted);margin:5px 0 0;font-size:13px}.icon{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);background:var(--panel);border-radius:5px}.project-list{display:grid;gap:8px}.project-row{color:var(--ink);width:100%;display:grid;grid-template-columns:minmax(180px,1.5fr) 1fr 130px 110px auto;align-items:center;gap:16px;border:1px solid var(--line);background:var(--panel);padding:14px;text-align:left}.project-row:hover{border-color:#aab1ba}.project-row strong{display:block}.project-row small,.project-row p{color:var(--muted);margin:4px 0 0}.status{font-size:11px;font-weight:700;padding:5px 8px;background:#22252b;width:max-content;border-radius:4px}.status.failed{color:#a62620;background:#321b1a}.status.published{color:var(--green);background:#183026}.connection-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.connection{background:var(--panel);border:1px solid var(--line);padding:18px}.connection h3{text-transform:capitalize;margin:0}.connection p{color:var(--muted);font-size:13px}.connection button{margin-top:12px}dialog{background:var(--panel);color:var(--ink);width:min(1060px,calc(100% - 24px));max-height:calc(100vh - 28px);border:0;padding:0;box-shadow:var(--shadow)}dialog::backdrop{background:rgba(17,19,22,.58)}.dialog-head{position:sticky;top:0;z-index:4;background:var(--panel);border-bottom:1px solid var(--line);padding:20px 24px;display:flex;justify-content:space-between}.dialog-head h2{margin:4px 0 0;font:700 24px Manrope}.brief{padding:0 24px;color:var(--muted)}.songs{padding:0 24px 28px}.songs>h3{font:700 18px Manrope}.song{display:grid;grid-template-columns:110px minmax(0,1fr);gap:16px;border-top:1px solid var(--line);padding:18px 0}.cover{width:110px;aspect-ratio:1;background:#23262b center/cover;border-radius:5px}.song-head{display:flex;justify-content:space-between;gap:12px}.song h4{font:700 17px Manrope;margin:0}.song audio{width:100%;height:36px;margin:10px 0}.song-actions,.video-actions{display:flex;gap:8px;flex-wrap:wrap}.secondary{color:var(--ink);border:1px solid var(--line);background:var(--panel);padding:8px 10px;border-radius:5px;font-weight:600}.video-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}.video{border:1px solid var(--line);padding:10px}.video video{width:100%;max-height:260px;background:#111}.video p{font-size:12px;color:var(--muted)}.empty{padding:28px;border:1px dashed #c9ced5;text-align:center;color:var(--muted)}.toast{position:fixed;right:20px;bottom:20px;background:#0d0f12;color:#fff;padding:12px 16px;opacity:0;transform:translateY(10px);transition:.2s;z-index:20}.toast.show{opacity:1;transform:none}.login-shell{min-height:100vh;display:grid;place-items:center;background:#17191d}.login-form{width:min(390px,calc(100% - 32px));background:var(--panel);padding:30px;display:grid;gap:16px}.login-form h1{margin:0;font:700 25px Manrope}.login-form p{margin:-10px 0 4px;color:var(--muted)}.error{color:#b3261e!important;font-size:12px}.error.notice{margin:0;padding:12px 13px;border:1px solid rgba(216,168,78,.45);border-radius:8px;background:rgba(216,168,78,.10);color:#f0d28d!important;font-size:13px;font-weight:700;line-height:1.45}
.back{border:0;background:transparent;color:var(--muted);display:inline-flex;align-items:center;gap:8px;padding:0;margin-bottom:24px}.back svg{width:17px}.resource-head{max-width:820px;margin-bottom:22px}.resource-head h2,.song-page-head h2{font:700 28px Manrope;margin:5px 0}.resource-head .brief{padding:0}.song-page-head{display:grid;grid-template-columns:180px minmax(0,1fr);gap:24px;align-items:start;border-bottom:1px solid var(--line);padding-bottom:28px}.song-page-head .cover{width:180px}.song-page-head audio{width:100%;margin:16px 0}.song-version{color:var(--muted)}#view-project .songs{padding:0}.song{cursor:default}

.legal-links{display:flex!important;align-items:center;justify-content:center;gap:7px;color:var(--muted);font-size:11px}.legal-links a{color:inherit;text-decoration:none}.legal-links a:hover{color:var(--accent);text-decoration:underline}.login-form .legal-links{margin-top:4px}.sidebar-legal{margin-top:auto;padding:10px 0}.sidebar-legal+.logout{margin-top:0}.legal-page{min-height:100vh;padding:44px 18px;background:var(--bg);color:var(--ink)}.legal-shell{width:min(820px,100%);margin:auto}.legal-header{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:28px}.legal-brand{display:flex;align-items:center;gap:10px;color:var(--ink);font:700 17px Manrope;text-decoration:none}.legal-back{color:var(--accent);font-size:12px;font-weight:700;text-decoration:none}.legal-back:hover{text-decoration:underline}.legal-document{padding:clamp(24px,5vw,52px);border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow)}.legal-document h1{margin:7px 0 9px;font:700 clamp(32px,6vw,50px) Manrope;letter-spacing:-.04em}.legal-document h2{margin:30px 0 9px;font:700 18px Manrope}.legal-document p,.legal-document li{color:#b7bbc3;font-size:14px;line-height:1.75}.legal-document ul{padding-left:20px}.legal-document a{color:var(--accent)}.legal-updated{margin:0 0 28px!important;color:var(--muted)!important;font-size:12px!important}.legal-note{margin-top:28px;padding:15px;border:1px solid var(--line);background:#181817}.legal-document .eyebrow{color:var(--accent)}@media(max-width:900px){.sidebar-legal{display:none!important}}@media(max-width:600px){.legal-page{padding:24px 12px}.legal-header{align-items:flex-start}.legal-document{padding:22px 18px}}

.legal-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}.legal-history-back{border:1px solid var(--line);background:#181817;border-radius:999px;padding:8px 12px;line-height:1}

.language-switch,.theme-switch{display:inline-flex;gap:3px;padding:3px;border:1px solid var(--line);border-radius:999px;background:#121419}.language-switch button,.theme-switch button{border:0;border-radius:999px;background:transparent;color:var(--muted);font-size:11px;font-weight:700;padding:6px 9px}.language-switch button.active,.language-switch button:hover,.theme-switch button.active,.theme-switch button:hover{background:var(--accent);color:#090a0c}.legal-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}.legal-history-back{border:1px solid var(--line);background:#181817;border-radius:999px;padding:8px 12px;line-height:1}


.login-emblem{width:126px;height:126px;object-fit:contain;border-radius:50%;margin:0 auto 16px;display:block;filter:drop-shadow(0 0 22px rgba(216,168,78,.38))}.login-wordmark{width:min(260px,78vw);height:auto;object-fit:contain;display:block;margin:0 auto 8px}.identity{align-items:center}.brand-emblem{width:42px;height:42px;border-radius:50%;object-fit:contain;filter:drop-shadow(0 0 10px rgba(216,168,78,.28))}.brand-wordmark{width:128px;max-height:42px;object-fit:contain}.sidebar-user{margin:-14px 8px 22px 54px;color:var(--muted);font-size:10px;line-height:1.35}.sidebar-user strong{display:block;color:var(--ink);font:700 12px Manrope;max-width:128px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.production-hero{position:relative;overflow:hidden;margin-bottom:20px;display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:22px;align-items:center;padding:26px;border:1px solid #3a3327;background:radial-gradient(circle at 82% 20%,rgba(216,168,78,.18),transparent 34%),linear-gradient(135deg,#13151a,#0b0c0f);box-shadow:var(--shadow)}.production-hero h2{font:700 clamp(28px,4vw,46px) Manrope;margin:6px 0 10px;letter-spacing:-.04em}.production-hero p:not(.eyebrow){color:#b7bbc3;line-height:1.65;max-width:660px}.production-orb{display:grid;place-items:center}.production-orb img{width:138px;height:138px;object-fit:contain;border-radius:50%;filter:drop-shadow(0 0 26px rgba(216,168,78,.36))}@media(max-width:800px){.brand-wordmark,.sidebar-user{display:none}.production-hero{grid-template-columns:1fr;padding:20px}.production-orb{display:none}.login-emblem{width:108px;height:108px}.login-wordmark{width:min(220px,78vw)}}


.login-full-logo{width:min(440px,82vw);height:auto;object-fit:contain;display:block;margin:0 auto 18px;filter:drop-shadow(0 0 24px rgba(216,168,78,.28)) drop-shadow(0 14px 32px rgba(255,255,255,.22))}.brand-full-logo{width:190px;max-width:100%;height:auto;object-fit:contain;display:block;filter:drop-shadow(0 0 10px rgba(216,168,78,.20))}.production-logo-lockup img{width:min(260px,100%);height:auto;object-fit:contain;border-radius:0;filter:drop-shadow(0 0 24px rgba(216,168,78,.24))}@media(max-width:800px){.brand-full-logo{width:44px;height:44px;object-fit:cover;object-position:left center;border-radius:50%}.login-full-logo{width:min(310px,86vw)}.production-logo-lockup{display:none}}
.login-form{width:min(500px,calc(100vw - 32px));padding-inline:clamp(20px,5vw,38px)}
.google-login{width:100%;min-height:46px;position:relative;justify-content:center;gap:10px;padding:10px 16px;background:#fff!important;color:#5f6368!important;border:1px solid #dadce0!important;border-radius:4px!important;font-size:17px!important;font-weight:700!important;box-shadow:0 1px 2px rgba(60,64,67,.12)}.google-login:hover{background:#f8fafd!important;border-color:#c6c9cf!important}.google-mark{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:26px;height:26px;display:inline-grid;place-items:center;flex:0 0 26px}.google-mark svg{width:26px;height:26px;display:block}.login-divider{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.login-divider:before,.login-divider:after{content:"";height:1px;background:var(--line);flex:1}.login-form[data-mode="register"] .google-login,.login-form[data-mode="register"] .login-divider{display:flex}.login-form[data-mode="reset"] .google-login,.login-form[data-mode="reset"] .login-divider{display:none}
.login-full-logo{max-width:100%;width:min(460px,100%);margin-left:auto;margin-right:auto}


/* Logo refinement: keep the circular emblem in the production hero and make raster lockups blend into dark UI instead of showing a rectangular black box. */
.login-full-logo,.brand-full-logo{background:transparent}
.production-orb img{width:138px;height:138px;object-fit:contain;border-radius:50%;filter:drop-shadow(0 0 26px rgba(216,168,78,.36))}
.account-area{position:relative;margin-top:12px}.account-trigger{width:100%;border:1px solid var(--line);background:#121419;border-radius:14px;padding:12px 13px;color:var(--ink);display:grid!important;grid-template-columns:1fr auto;gap:2px;text-align:left;align-items:center;cursor:pointer}.account-trigger span{grid-column:1;color:var(--muted);font-size:11px}.account-trigger strong{grid-column:1;display:block;color:var(--ink);font:700 13px Manrope;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-trigger svg{grid-column:2;grid-row:1 / span 2;width:16px;color:var(--muted)}.account-menu{position:absolute;left:0;right:0;bottom:calc(100% + 10px);z-index:30;padding:10px;border:1px solid var(--line);border-radius:18px;background:#111318;box-shadow:0 24px 70px rgba(0,0,0,.62)}.account-menu button{width:100%;border:0;background:transparent;color:var(--ink);padding:12px 13px;border-radius:10px;text-align:left;display:flex;align-items:center;justify-content:space-between;font-weight:600}.account-menu button:hover{background:#252119}.account-menu .has-submenu svg{width:15px;color:var(--muted)}.account-menu #logout{color:#f2d18b}.sidebar-legal{margin-top:auto}.sidebar-language{margin-top:18px}@media(max-width:600px){.account-area{display:none}.sidebar-language,.sidebar-legal{display:none!important}}
/* Account/menu + greeting refinements */
.sidebar-legal{margin-top:18px!important}.account-area{margin-top:12px;margin-bottom:auto}.account-menu-language,.account-menu-theme{padding:10px 13px;border-radius:10px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--ink);font-weight:600}.account-menu-language:hover,.account-menu-theme:hover{background:#252119}.account-menu-language .language-switch,.account-menu-theme .theme-switch{flex:none}.greeting-header{align-items:flex-start!important}.greeting-title{display:flex;align-items:flex-start;gap:13px}.greeting-title>svg{width:25px;height:25px;color:var(--accent);filter:drop-shadow(0 0 12px rgba(216,168,78,.35));margin-top:4px}.greeting-title h1{margin:0!important;font:700 clamp(28px,4vw,42px) Manrope!important;letter-spacing:-.04em}.greeting-title p{margin:7px 0 0;color:#b7bbc3;font-size:15px}.profile-dialog{width:min(430px,calc(100vw - 28px));border:1px solid var(--line);border-radius:24px;background:#111318;color:var(--ink);padding:0;box-shadow:0 30px 90px rgba(0,0,0,.62)}.profile-dialog::backdrop{background:rgba(0,0,0,.62);backdrop-filter:blur(7px)}.profile-card{position:relative;padding:30px;text-align:center}.profile-close{position:absolute;right:14px;top:14px}.profile-logo{width:86px;height:86px;border-radius:50%;object-fit:contain;filter:drop-shadow(0 0 18px rgba(216,168,78,.3));margin-bottom:14px}.profile-card h2{font:700 26px Manrope;margin:5px 0}.profile-card>p:not(.eyebrow){color:var(--muted);margin:0 0 20px}.profile-meta{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:14px;padding:13px 15px;background:#16181d}.profile-meta span{color:var(--muted);font-size:12px}.profile-meta strong{font-size:13px}@media(max-width:600px){.greeting-title h1{font-size:25px!important}.greeting-title p{font-size:13px}}


/* Requested account/profile/social refinements */
.sidebar-legal{margin-top:auto!important;justify-content:center!important;width:100%;padding:12px 0 8px!important;text-align:center}
.account-area{margin-top:0!important;margin-bottom:0!important;display:flex;flex-direction:column;align-items:center;width:100%}
.account-trigger{width:min(188px,100%)!important;margin:0 auto!important;text-align:left!important}
.account-trigger strong{max-width:132px!important}
.account-menu{left:50%!important;right:auto!important;transform:translateX(-50%);width:min(214px,calc(100vw - 28px))}
.account-menu-language,.account-menu-theme{flex-direction:column;align-items:stretch!important;gap:9px!important}
.account-menu-language>span,.account-menu-theme>span{display:flex;justify-content:space-between;align-items:center}
.account-menu-language>span:after,.account-menu-theme>span:after{content:"›";color:var(--muted);font-size:16px}
.account-menu-language .language-switch,.account-menu-theme .theme-switch{align-self:flex-start}
.profile-avatar-picker{position:relative;display:inline-grid;place-items:center;gap:9px;margin:0 auto 12px;color:var(--accent);font-size:12px;font-weight:800;overflow:visible;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.profile-avatar-picker .profile-photo-action:focus-within{border-color:rgba(216,168,78,.75);box-shadow:0 0 0 3px rgba(216,168,78,.18)}
.profile-avatar-picker .profile-photo-action{position:relative;display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(216,168,78,.35);border-radius:999px;padding:7px 11px;background:rgba(216,168,78,.08);overflow:hidden;cursor:pointer;pointer-events:auto}
.profile-avatar-picker svg{width:14px;height:14px}
.profile-avatar-picker .profile-logo{pointer-events:none}
.profile-picture-input{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-width:100%!important;min-height:100%!important;padding:0!important;margin:0!important;border:0!important;opacity:0!important;overflow:hidden!important;clip:auto!important;clip-path:none!important;white-space:nowrap!important;appearance:auto;-webkit-appearance:auto;pointer-events:auto!important;z-index:2!important;cursor:pointer;font-size:100px!important}
.profile-logo{object-fit:cover;background:#090a0c;border:1px solid rgba(216,168,78,.35)}
.profile-field{margin:16px 0;text-align:left;color:var(--muted)}
.profile-field input{width:100%;margin-top:7px;color:var(--ink)}
.profile-save{width:100%;margin-top:16px;justify-content:center}
.provider-choice{border:0;margin:18px 0 0;padding:0;text-align:left;display:grid;gap:10px}
.provider-choice legend{font-weight:800;color:var(--ink);margin-bottom:8px}
.provider-choice label{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:flex-start;border:1px solid var(--line);border-radius:14px;padding:13px;background:#16181d;cursor:pointer}
.provider-choice input{margin-top:3px;accent-color:var(--accent)}
.provider-choice strong{display:block;color:var(--ink);font-size:14px}
.provider-choice em{display:block;margin-top:4px;color:var(--muted);font-style:normal;font-size:12px;line-height:1.35}
.provider-choice .provider-unavailable{opacity:.48;cursor:not-allowed}
.preference-option-heading{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap}.preference-option-heading b{display:inline-flex;align-items:center;border:1px solid rgba(216,168,78,.38);border-radius:999px;padding:2px 7px;background:rgba(216,168,78,.10);color:#f1cf86;font-size:10px;line-height:1.2;text-transform:uppercase;letter-spacing:.06em}.youtube-video-style-choice label.plan-locked{opacity:.68}.youtube-video-style-choice label.plan-locked input{filter:grayscale(1)}.youtube-video-style-choice label.plan-locked .preference-option-heading:after{content:"🔒";font-size:12px;color:#f1cf86}.youtube-video-style-choice label.plan-locked:hover{border-color:rgba(216,168,78,.32);background:rgba(216,168,78,.045)}
.preferences-note{margin:14px 0 0!important;color:var(--muted);font-size:12px;line-height:1.45}
.platform-option{grid-template-columns:auto auto 1fr!important;align-items:center!important;gap:9px!important}
.platform-symbol{width:25px;height:25px;display:inline-grid;place-items:center;border-radius:9px;background:rgba(216,168,78,.1);border:1px solid rgba(216,168,78,.22);color:var(--accent);flex:0 0 auto}
.platform-symbol svg{width:16px;height:16px;display:block;fill:currentColor}
.platform-symbol .symbol-cut{fill:#090a0c}
.platform-youtube{color:#ff0033;background:rgba(255,0,51,.1);border-color:rgba(255,0,51,.3)}
.platform-instagram{color:#fff;background:transparent;border-color:transparent}
.platform-instagram svg{width:23px;height:23px}
.platform-tiktok{color:#fff;background:#080808;border-color:#343434}
.platform-tiktok svg{filter:drop-shadow(1px 0 #fe2c55) drop-shadow(-1px -1px #25f4ee)}
.platform-facebook{color:#fff;background:transparent;border-color:transparent}
.platform-facebook svg{width:23px;height:23px}
.connection h3{display:flex;align-items:center;gap:10px}
.video-actions .secondary{display:inline-flex;align-items:center;gap:8px}
@media(max-width:600px){.account-area,.sidebar-legal{display:none!important}}


/* Create flow: brief first, metadata after music exists */
.create-guidance{margin:12px 0 18px;color:#b7bbc3;line-height:1.6;font-size:14px;border:1px solid rgba(216,168,78,.18);background:rgba(216,168,78,.06);border-radius:14px;padding:13px 15px}
.metadata-editor{margin:18px 0 24px;border:1px solid rgba(216,168,78,.24);background:linear-gradient(135deg,rgba(216,168,78,.08),rgba(17,19,24,.96));box-shadow:0 18px 46px rgba(0,0,0,.32)}
.metadata-editor .section-head{margin-bottom:16px}
.metadata-editor h3{font:700 19px Manrope;margin:0;color:var(--ink)}
.metadata-form{display:grid;grid-template-columns:1.2fr 1fr 1fr auto;gap:12px;align-items:end}
.metadata-form label{color:#aeb4bd}
.metadata-form input{width:100%}
.metadata-form .primary{height:43px;white-space:nowrap}
@media(max-width:1000px){.metadata-form{grid-template-columns:1fr 1fr}.metadata-form .primary{grid-column:1/-1}}
@media(max-width:600px){.metadata-form{grid-template-columns:1fr}.create-guidance{font-size:13px}}


/* Project workflow — clean centered orbital layout */















@keyframes flowPreviewZoom{
  0%,100%{transform:scale(.92);}
  50%{transform:scale(1.14);}
}
@keyframes flowPreviewHalo{
  0%{transform:scale(.72);opacity:.9;}
  100%{transform:scale(1.55);opacity:0;}
}


























/* Project table column headers */
.project-table-header{display:grid;grid-template-columns:minmax(220px,1.4fr) minmax(180px,1fr) 120px 120px 72px;gap:14px;align-items:center;padding:0 16px 9px;margin:2px 0 8px;border-bottom:1px solid rgba(255,255,255,.08);color:#7f858f;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.12em}
.project-table-header span:nth-child(3),.project-table-header span:nth-child(4){text-align:left}
.project-row{grid-template-columns:minmax(220px,1.4fr) minmax(180px,1fr) 120px 120px 72px!important;align-items:center!important;cursor:pointer}
.project-row .status,.project-row .row-cost{justify-self:start;white-space:nowrap}
@media(max-width:900px){.project-table-header{grid-template-columns:1fr 110px}.project-table-header span:nth-child(2),.project-table-header span:nth-child(4),.project-table-header span:nth-child(5){display:none}.project-row{grid-template-columns:1fr 110px!important}}
@media(max-width:600px){.project-table-header{display:none}.project-row{grid-template-columns:1fr auto!important}}


/* Project table dates */
.project-table-header{grid-template-columns:minmax(200px,1.35fr) minmax(150px,1fr) 110px 112px 112px 92px 72px!important}
.project-row{grid-template-columns:minmax(200px,1.35fr) minmax(150px,1fr) 110px 112px 112px 92px 72px!important}
.project-row time{color:#aeb4bd;font-size:12px;font-weight:700;white-space:nowrap;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.project-row .published-date{color:#d7c39a}.project-row .published-date.scheduled{display:grid;gap:2px;color:#ffca64;font-weight:900;text-transform:uppercase;letter-spacing:.03em;white-space:normal}.project-row .published-date.scheduled span{line-height:1}.project-row .published-date.scheduled small{color:#d7c39a;font-size:10px;line-height:1.2;font-weight:800;text-transform:none;letter-spacing:0;white-space:normal}.project-row .published-date:empty:after{content:"—"}
.project-table-header span:nth-child(6),.project-row .row-cost{justify-self:start}
.project-row-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}
.project-row-actions>svg{width:18px;height:18px;color:#f4f1e8}
.project-list-delete{width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(255,118,118,.42);border-radius:999px;background:#15171c;color:#ffd0d0;padding:0}
.project-list-delete:hover{border-color:rgba(255,118,118,.78);background:rgba(255,92,92,.12)}
.project-list-delete:disabled{opacity:.55;cursor:wait}
.project-list-delete svg{width:16px;height:16px}
@media(max-width:1100px){.project-table-header{grid-template-columns:1fr 120px 105px 72px!important}.project-table-header span:nth-child(2),.project-table-header span:nth-child(4),.project-table-header span:nth-child(5){display:none}.project-row{grid-template-columns:1fr 120px 105px 72px!important}.project-row>p,.project-row .created-date,.project-row .published-date{display:none!important}}
@media(max-width:600px){.project-table-header{display:none!important}.project-row{grid-template-columns:1fr auto!important}}


/* Sticky project filters + table top while scrolling */
.project-filter-bar{position:sticky;top:0;z-index:18;display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 8px;padding:12px 14px;border:1px solid rgba(216,168,78,.16);border-radius:16px;background:linear-gradient(180deg,rgba(13,15,18,.97),rgba(13,15,18,.92));backdrop-filter:blur(12px);box-shadow:0 14px 34px rgba(0,0,0,.28)}
.project-filter-bar .filter-title{display:inline-flex;align-items:center;gap:8px;color:var(--ink);font:800 12px Manrope;text-transform:uppercase;letter-spacing:.12em;margin-right:auto}.project-filter-bar .filter-title svg{width:16px;color:var(--accent)}
.project-filter-bar label{display:flex;align-items:center;gap:8px;color:#8f949d;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.project-filter-bar select{min-width:160px;border:1px solid rgba(255,255,255,.10);border-radius:999px;background:#121419;color:var(--ink);padding:8px 30px 8px 11px;font-size:12px;font-weight:700;outline:none}.project-filter-bar select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(216,168,78,.12)}
.project-filter-bar .filter-search svg{width:14px;flex:none;color:#8f949d}.project-filter-bar .filter-search input{width:220px;border:1px solid rgba(255,255,255,.10);border-radius:999px;background:#121419;color:var(--ink);padding:8px 12px;font-size:12px;font-weight:700;text-transform:none;letter-spacing:0;outline:none}.project-filter-bar .filter-search input::placeholder{color:#8f949d;font-weight:600}.project-filter-bar .filter-search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(216,168,78,.12)}
.project-table-header{position:sticky;top:70px;z-index:17;background:linear-gradient(180deg,rgba(9,10,12,.98),rgba(9,10,12,.92));backdrop-filter:blur(12px);border-radius:12px 12px 0 0;padding-top:10px!important}
@media(max-width:900px){.project-filter-bar{top:0}.project-filter-bar label{width:100%;justify-content:space-between}.project-filter-bar select{min-width:0;width:62%}.project-filter-bar .filter-search input{width:auto;flex:1}.project-table-header{top:138px}}
@media(max-width:600px){.project-filter-bar{display:none!important}.project-table-header{display:none!important}}


/* Keep page top visible while scrolling */
.main>header{position:sticky;top:0;z-index:45;padding:10px 0 14px;margin-top:-10px;background:linear-gradient(180deg,rgba(9,10,12,.98),rgba(9,10,12,.88) 78%,rgba(9,10,12,0));backdrop-filter:blur(14px)}
.project-filter-bar{top:92px!important}.project-table-header{top:164px!important}
@media(max-width:900px){.project-filter-bar{top:92px!important}.project-table-header{top:222px!important}}
@media(max-width:600px){.main>header{position:static}.project-filter-bar,.project-table-header{position:static!important}}


/* Sticky overlap fix: keep top readable and reserve visual separation */
.main>header{background:#090a0c!important;box-shadow:0 18px 34px rgba(0,0,0,.38)!important}
.project-filter-bar{top:122px!important;background:#0d0f12!important;box-shadow:0 18px 34px rgba(0,0,0,.42)!important}
.project-table-header{top:194px!important;background:#090a0c!important;box-shadow:0 10px 22px rgba(0,0,0,.28)!important}
@media(max-width:900px){.project-filter-bar{top:122px!important}.project-table-header{top:254px!important}}


/* Final sticky behavior: keep project filter/table top sticky, not the large greeting header */
.main>header{position:static!important;padding:0!important;margin-top:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important}
#view-projects .project-filter-bar,#view-create .project-filter-bar{top:0!important}
#view-projects .project-table-header,#view-create .project-table-header{top:72px!important}
@media(max-width:900px){#view-projects .project-table-header,#view-create .project-table-header{top:138px!important}}


/* Final project sticky top + justified prompt text */
#view-projects .project-filter-bar,#view-create .project-filter-bar{position:sticky!important;top:0!important;z-index:60!important;background:#0d0f12!important;border-color:rgba(216,168,78,.22)!important;box-shadow:0 18px 36px rgba(0,0,0,.62)!important;backdrop-filter:blur(16px)!important}
#view-projects .project-table-header,#view-create .project-table-header{position:sticky!important;top:72px!important;z-index:59!important;background:#090a0c!important;box-shadow:0 14px 28px rgba(0,0,0,.55)!important;backdrop-filter:blur(16px)!important}
.resource-head .brief,.project-row small{text-align:justify;text-justify:inter-word;hyphens:auto;line-height:1.75}
.project-row small{display:block;max-width:100%}
.project-platform-statuses{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.project-platform-status{display:inline-flex;align-items:center;min-height:20px;border-radius:999px;padding:3px 7px;border:1px solid rgba(255,255,255,.10);background:#15181d;color:#8f949d;font-size:10px;font-weight:900;line-height:1;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.project-platform-status.published{border-color:rgba(75,190,126,.28);background:rgba(34,92,61,.38);color:#6ed58f}
.project-platform-status.scheduled{border-color:rgba(255,202,100,.34);background:rgba(73,55,23,.46);color:#ffca64}
.project-platform-status.not-yet{border-color:rgba(255,255,255,.08);background:#121419;color:#7f858f}
.project-platform-unschedule{display:inline-flex;align-items:center;gap:4px;min-height:20px;border-radius:999px;padding:3px 7px;border:1px solid rgba(255,104,104,.24);background:rgba(255,78,78,.08);color:#ffb7b7;font-size:10px;font-weight:900;line-height:1;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.project-platform-unschedule svg{width:12px;height:12px}
/* n 2050 : « Marquer comme publie sur TikTok » a cote du statut ; vert pour marquer, rouge (celui du dessus) pour annuler. */
.tiktok-confirmer-geste:not(.annuler){border-color:rgba(98,214,140,.3);background:rgba(98,214,140,.08);color:#9fe6b8}
.tiktok-confirmer-erreur{color:#ffb7b7;font-size:13px;margin:0}
@media(max-width:900px){#view-projects .project-table-header,#view-create .project-table-header{top:138px!important}}
@media(max-width:600px){#view-projects .project-filter-bar,#view-create .project-filter-bar,#view-projects .project-table-header,#view-create .project-table-header{position:static!important}.resource-head .brief,.project-row small{text-align:left}}

/* Credit top-up notice */
.add-credit-button{margin:8px 8px 0;min-height:34px;justify-content:center;border-color:rgba(216,168,78,.30);background:rgba(216,168,78,.08);color:#f2d18b;font-size:12px;font-weight:900}
.add-credit-button svg{width:15px;height:15px}
.credit-dialog .profile-card{text-align:left}
.credit-dialog .profile-card h2{text-align:left}
.credit-dialog .profile-card>p:not(.eyebrow){color:#b7bbc3;line-height:1.55}
.credit-package-list{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0 14px}
.credit-package-list button{min-height:72px;border:1px solid rgba(216,168,78,.18);border-radius:14px;background:#16181d;color:var(--ink);display:grid;place-items:center;gap:2px}
.credit-package-list button:hover,.credit-package-list button.selected{border-color:rgba(216,168,78,.58);background:rgba(216,168,78,.10)}
.credit-package-list strong{font:900 22px Manrope;color:#f2d18b}
.credit-package-list span{color:#8f949d;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.credit-dialog-note{padding:12px;border:1px solid rgba(216,168,78,.18);border-radius:14px;background:rgba(216,168,78,.06);color:#d7c39a!important;font-size:12px!important}
.credit-contact-link{width:100%;justify-content:center;text-decoration:none;margin-top:12px}
.billing-dialog{width:min(1100px,calc(100vw - 28px))}
.billing-card{padding:26px!important;background:linear-gradient(180deg,rgba(22,20,16,.98),rgba(10,11,14,.98))!important;border-color:rgba(216,168,78,.22)!important}
.billing-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:0 0 22px;overflow:hidden;border:1px solid rgba(216,168,78,.18);border-radius:18px;background:rgba(216,168,78,.14);box-shadow:0 18px 60px rgba(0,0,0,.30)}
.billing-summary div{display:grid;gap:6px;min-width:0;padding:13px 15px;background:rgba(17,19,24,.92)}
.billing-summary span{color:#9ca1aa;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.055em}
.billing-summary strong{min-width:0;color:#f7f0df;font:900 13px Manrope;overflow-wrap:anywhere}
.billing-head{text-align:left;margin-bottom:12px}
.billing-head h2{margin:5px 0 6px!important;text-align:left;font-size:clamp(24px,4vw,34px)!important}
.billing-head p:not(.eyebrow){max-width:720px;color:#c4c8d0!important;font-size:13px!important;line-height:1.55!important}
.billing-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:15px 0 16px}
.billing-plan{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-width:0;border:1px solid rgba(255,255,255,.09);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.022));padding:16px;overflow:hidden}
.billing-plan:after{content:"";position:absolute;inset:auto -35% -55% 24%;height:110px;background:radial-gradient(circle,rgba(216,168,78,.12),transparent 68%);pointer-events:none}
.billing-plan.current{border-color:rgba(255,218,141,.76);background:linear-gradient(180deg,rgba(216,168,78,.17),rgba(255,255,255,.035));box-shadow:0 0 0 1px rgba(216,168,78,.20) inset,0 18px 48px rgba(216,168,78,.10)}
.billing-plan.featured:not(.current){border-color:rgba(216,168,78,.34);box-shadow:0 0 0 1px rgba(216,168,78,.08) inset}
.billing-plan.current [data-plan-badge]{background:linear-gradient(135deg,#f6dc98,#d8a84e);color:#17120a;box-shadow:0 10px 24px rgba(216,168,78,.18)}
.billing-plan span{display:inline-flex;width:max-content;max-width:100%;margin-bottom:9px;padding:4px 8px;border-radius:999px;background:rgba(216,168,78,.10);color:#f2d18b;font-size:9px;font-weight:950;text-transform:uppercase;letter-spacing:.07em;white-space:normal}
.billing-plan h3{margin:0 0 5px;font:950 19px Manrope;color:#fff}
.billing-plan p{margin:0;color:#aeb4bd;font-size:12px;line-height:1.45}
.billing-plan ul{margin:14px 0 0;padding:0;display:grid;gap:8px;list-style:none}
.billing-plan li{position:relative;padding-left:18px;color:#e4e5e9;font-size:11.5px;line-height:1.35}
.billing-plan li:before{content:"✓";position:absolute;left:0;top:0;color:#63c78a;font-weight:900}
.billing-extra-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:16px;margin:0 0 14px}
.billing-extra{position:relative;min-width:0;padding:16px;border:1px solid rgba(216,168,78,.18);border-radius:18px;background:linear-gradient(180deg,rgba(216,168,78,.08),rgba(255,255,255,.025));box-shadow:0 18px 46px rgba(0,0,0,.22);overflow:hidden}
.billing-extra span{display:inline-flex;width:max-content;max-width:100%;margin-bottom:9px;padding:4px 8px;border-radius:999px;background:rgba(216,168,78,.12);color:#f2d18b;font-size:9px;font-weight:950;text-transform:uppercase;letter-spacing:.07em;white-space:normal}
.billing-extra h3{margin:0 0 6px;font:950 16px Manrope;color:#fff}
.billing-extra p{margin:0;color:#b8bdc6;font-size:12px;line-height:1.45}
.billing-extra ul{margin:12px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 12px;list-style:none}
.billing-extra li{position:relative;padding-left:16px;color:#e8e2d6;font-size:11.5px;line-height:1.35}
.billing-extra li:before{content:"•";position:absolute;left:1px;top:0;color:#f2d18b;font-weight:900}
.billing-rights-note{margin:0 0 12px;padding:13px 14px;border:1px solid rgba(99,199,138,.24);border-radius:16px;background:rgba(99,199,138,.07);color:#dff6e7!important;font-size:12px!important;line-height:1.5!important}
@media(max-width:900px){.billing-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.billing-plan-grid,.billing-extra-grid{grid-template-columns:1fr}.credit-package-list{grid-template-columns:1fr}.billing-card{padding:22px!important}.billing-extra ul{grid-template-columns:1fr}}
@media(max-width:480px){.billing-dialog{width:min(100vw - 16px,1100px)}.billing-card{padding:18px!important}.billing-summary{grid-template-columns:1fr;margin-bottom:18px}.billing-summary div{padding:11px 13px}.billing-plan,.billing-extra{padding:14px}.credit-contact-link{min-height:44px}}

/* Customer feedback */
.feedback-dialog{width:min(520px,calc(100vw - 28px))}
.feedback-card{text-align:left!important}
.feedback-card h2{text-align:left;margin-bottom:8px!important}
.feedback-card>p:not(.eyebrow){color:#b7bbc3;line-height:1.55}
.feedback-card select,.feedback-card textarea{width:100%;margin-top:7px;color:var(--ink)}
.feedback-card select{min-height:48px;border:1px solid rgba(216,168,78,.22);border-radius:14px;padding:0 42px 0 14px;background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.03));box-shadow:0 12px 30px rgba(0,0,0,.18),0 0 0 1px rgba(255,255,255,.025) inset;color:#f7f0df;font-weight:800;appearance:none;background-image:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.03)),linear-gradient(45deg,transparent 50%,#d8a84e 50%),linear-gradient(135deg,#d8a84e 50%,transparent 50%);background-position:0 0,calc(100% - 22px) 20px,calc(100% - 16px) 20px;background-size:auto,6px 6px,6px 6px;background-repeat:no-repeat}
.feedback-card select:focus{outline:none;border-color:rgba(216,168,78,.62);box-shadow:0 0 0 3px rgba(216,168,78,.16),0 12px 30px rgba(0,0,0,.18)}
.feedback-card textarea{resize:vertical;line-height:1.5}
.feedback-submit{width:100%;justify-content:center;margin-top:12px}
.feedback-dialog.is-rating-mode{width:min(500px,calc(100vw - 20px))}
.feedback-dialog.is-rating-mode .feedback-card{padding:28px!important;border-color:rgba(216,168,78,.32)!important;background:radial-gradient(circle at 18% 0%,rgba(216,168,78,.18),transparent 34%),linear-gradient(180deg,rgba(17,18,23,.98),rgba(9,10,13,.98))!important;box-shadow:0 28px 90px rgba(0,0,0,.58),0 0 0 1px rgba(255,255,255,.04) inset!important}
.feedback-dialog.is-rating-mode .feedback-type-field{display:grid!important;margin:18px 0 0;padding:13px 14px;border:1px solid rgba(216,168,78,.22);border-radius:18px;background:linear-gradient(180deg,rgba(216,168,78,.10),rgba(255,255,255,.03));box-shadow:0 14px 38px rgba(0,0,0,.22),0 0 0 1px rgba(255,255,255,.035) inset;color:#d8a84e;font:900 10px Manrope;letter-spacing:.095em;text-transform:uppercase}
.feedback-rating-panel{display:grid;gap:12px;margin:18px 0 14px;padding:16px;border:1px solid rgba(216,168,78,.22);border-radius:20px;background:linear-gradient(180deg,rgba(216,168,78,.11),rgba(255,255,255,.035));box-shadow:0 16px 42px rgba(0,0,0,.26),0 0 0 1px rgba(255,255,255,.035) inset}
.feedback-rating-head{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#f8edcf;font:900 12px Manrope;letter-spacing:.02em}
.feedback-rating-head span{text-transform:uppercase;color:#d8a84e;font-size:10px;letter-spacing:.095em}
.feedback-rating-head strong{color:#f7f0df;font-size:12px;white-space:nowrap}
.feedback-stars{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.feedback-star{appearance:none;display:grid;place-items:center;min-width:0;min-height:52px;border:1px solid rgba(255,255,255,.10);border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));color:rgba(247,240,223,.30);font-size:31px;line-height:1;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.feedback-star:hover,.feedback-star:focus-visible{transform:translateY(-1px);border-color:rgba(216,168,78,.50);outline:none;box-shadow:0 0 0 3px rgba(216,168,78,.16),0 12px 26px rgba(0,0,0,.22)}
.feedback-star.selected{color:#f6d77f;border-color:rgba(246,215,127,.55);background:linear-gradient(180deg,rgba(216,168,78,.22),rgba(216,168,78,.08));box-shadow:0 10px 28px rgba(216,168,78,.12),0 0 0 1px rgba(255,255,255,.045) inset;text-shadow:0 0 18px rgba(246,215,127,.42)}
.feedback-star.selected:focus,.feedback-star.selected:focus-visible{color:#f6d77f!important;border-color:rgba(246,215,127,.72)!important;background:linear-gradient(180deg,rgba(216,168,78,.26),rgba(216,168,78,.10))!important;box-shadow:0 0 0 3px rgba(216,168,78,.18),0 10px 28px rgba(216,168,78,.12)!important}
.feedback-dialog.is-rating-mode #feedback-message{min-height:118px;border-color:rgba(216,168,78,.18);background:rgba(255,255,255,.045)}
@media(max-width:480px){.feedback-dialog{width:min(100vw - 14px,520px)}.feedback-dialog.is-rating-mode .feedback-card{padding:20px!important;border-radius:22px!important}.feedback-rating-panel{padding:13px;border-radius:18px}.feedback-stars{gap:6px}.feedback-star{min-height:48px;border-radius:14px;font-size:28px}.feedback-rating-head{align-items:flex-start;flex-direction:column;gap:3px}.feedback-rating-head strong{white-space:normal}.feedback-submit{min-height:48px}}
.info-dialog{width:min(520px,calc(100vw - 28px))}
.info-card{text-align:left!important}
.info-card h2{text-align:left;margin-bottom:8px!important}
.info-card>p:not(.eyebrow){color:#b7bbc3;line-height:1.55}
.info-list{display:grid;gap:8px;margin:18px 0}
.info-list span{border:1px solid var(--line);border-radius:12px;background:#16181d;padding:11px 13px;color:var(--ink);font-weight:700}
.info-link{width:100%;justify-content:center;margin-top:12px;text-align:center;text-decoration:none}
#invite-message{width:100%;resize:none;margin-top:6px;line-height:1.55;color:var(--ink)}

/* Full Sakira About experience */
.about-dialog{
  width:min(1180px,calc(100vw - 28px))!important;
  max-height:calc(100vh - 28px)!important;
  border:1px solid rgba(216,168,78,.32)!important;
  border-radius:26px!important;
  background:#090a0c!important;
  overflow:auto;
}
.about-dialog::backdrop{background:rgba(0,0,0,.68);backdrop-filter:blur(8px)}
.about-page{position:relative;background:#090a0c;color:var(--ink);overflow:hidden}
.about-close{
  position:sticky!important;
  top:16px;
  float:right;
  z-index:6;
  margin:16px 16px -54px 0;
  border-radius:50%!important;
  background:rgba(9,10,12,.72)!important;
  backdrop-filter:blur(10px);
}
.about-hero{
  min-height:min(720px,calc(100vh - 30px));
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.95fr);
  align-items:stretch;
  gap:0;
}
.about-hero-copy{
  position:relative;
  z-index:2;
  padding:clamp(36px,6vw,78px);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.about-logo{
  width:min(260px,72vw);
  height:auto;
  object-fit:contain;
  margin-bottom:34px;
  mix-blend-mode:screen;
  filter:drop-shadow(0 0 22px rgba(216,168,78,.24));
}
.about-hero h2{
  margin:10px 0 18px;
  font:800 clamp(44px,7.2vw,86px) Manrope;
  line-height:.94;
  letter-spacing:0;
  max-width:720px;
}
.about-hero-copy>p:not(.eyebrow){
  max-width:650px;
  color:#c9c2b3;
  font-size:clamp(16px,2vw,21px);
  line-height:1.65;
}
.about-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.about-actions .primary,.about-actions .secondary{min-height:44px}
.about-hero-media{
  position:relative;
  margin:0;
  min-height:520px;
  overflow:hidden;
  border-left:1px solid rgba(216,168,78,.18);
}
.about-hero-media:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,#090a0c 0%,rgba(9,10,12,.2) 34%,rgba(9,10,12,.05) 100%),
    linear-gradient(0deg,#090a0c 0%,transparent 22%);
  pointer-events:none;
}
.about-hero-media img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.95) contrast(1.06)}
.about-story,.about-feature-band,.about-values{
  border-top:1px solid rgba(216,168,78,.22);
  padding:clamp(28px,5vw,58px) clamp(24px,6vw,76px);
}
.about-story{
  display:grid;
  grid-template-columns:minmax(260px,.82fr) minmax(0,1fr);
  gap:clamp(24px,5vw,70px);
  align-items:start;
  background:linear-gradient(180deg,#0b0c0f,#101113);
}
.about-story h3,.about-feature-copy h3,.about-values h3{
  margin:8px 0 0;
  font:800 clamp(28px,4.2vw,52px) Manrope;
  line-height:1.04;
  letter-spacing:0;
}
.about-story>p,.about-feature-copy p:not(.eyebrow),.about-value-grid p{
  color:#b9b4aa;
  line-height:1.75;
  font-size:15px;
}
.about-workflow{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  background:rgba(216,168,78,.2);
  border-top:1px solid rgba(216,168,78,.22);
  border-bottom:1px solid rgba(216,168,78,.22);
}
.about-workflow article{
  min-height:250px;
  padding:30px;
  background:#0e1013;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}
.about-workflow svg{width:31px;height:31px;color:var(--accent);margin-bottom:auto;filter:drop-shadow(0 0 12px rgba(216,168,78,.28))}
.about-workflow h4,.about-value-grid h4{font:800 20px Manrope;margin:20px 0 8px}
.about-workflow p{color:#aaa49a;line-height:1.55;margin:0}
.about-feature-band{
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(360px,1fr);
  gap:clamp(24px,6vw,78px);
  align-items:center;
  background:radial-gradient(circle at 82% 50%,rgba(216,168,78,.17),transparent 34%),#0a0b0d;
}
.about-format-image{
  margin:0;
  width:100%;
  border:1px solid rgba(216,168,78,.28);
  border-radius:22px;
  overflow:hidden;
  background:#050506;
  box-shadow:0 28px 80px rgba(0,0,0,.42);
}
.about-format-image img{
  display:block;
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
  object-position:center;
}
.about-values{background:#101113}
.about-value-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:28px}
.about-value-grid article{
  border:1px solid rgba(216,168,78,.24);
  background:#15161a;
  border-radius:18px;
  padding:24px;
}
@media(max-width:940px){
  .about-hero,.about-story,.about-feature-band{grid-template-columns:1fr}
  .about-hero-media{min-height:360px;border-left:0;border-top:1px solid rgba(216,168,78,.18);order:-1}
  .about-hero-media:after{background:linear-gradient(0deg,#090a0c 0%,transparent 42%)}
  .about-workflow{grid-template-columns:repeat(2,minmax(0,1fr))}
  .about-value-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .about-dialog{width:calc(100vw - 12px)!important;max-height:calc(100vh - 12px)!important;border-radius:18px!important}
  .about-close{top:10px;margin:10px 10px -48px 0}
  .about-hero-copy{padding:30px 22px 34px}
  .about-hero h2{font-size:42px}
  .about-logo{width:210px;margin-bottom:26px}
  .about-workflow{grid-template-columns:1fr}
  .about-workflow article{min-height:190px;padding:24px}
  .about-story,.about-feature-band,.about-values{padding:30px 22px}
  .about-format-image{border-radius:16px}
  .about-format-image img{aspect-ratio:4/3}
}


/* Keep justification for full prompt/detail cards only; keep table rows scannable */
.project-row small{text-align:left!important;hyphens:none!important;line-height:1.45!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
.resource-head .brief{text-align:justify!important;text-justify:inter-word!important;hyphens:auto!important;line-height:1.8!important}


/* Final table sticky/font normalization */
#view-projects .project-filter-bar,#view-create .project-filter-bar{position:sticky!important;top:0!important;z-index:120!important;display:grid!important;grid-template-columns:auto minmax(140px,1fr) minmax(170px,1fr) minmax(170px,1fr) minmax(220px,1.2fr)!important;align-items:center!important;gap:12px!important;min-height:54px!important;margin:0 0 6px!important;padding:8px 12px!important;border-radius:14px!important;background:#0d0f12!important;border:1px solid rgba(216,168,78,.20)!important;box-shadow:0 16px 34px rgba(0,0,0,.62)!important;backdrop-filter:blur(16px)!important}
#view-projects .project-table-header,#view-create .project-table-header{position:sticky!important;top:66px!important;z-index:119!important;display:grid!important;align-items:center!important;margin:0 0 8px!important;padding:10px 16px 10px!important;min-height:38px!important;border-radius:0!important;background:#090a0c!important;border-top:1px solid rgba(255,255,255,.055)!important;border-bottom:1px solid rgba(255,255,255,.11)!important;box-shadow:0 12px 24px rgba(0,0,0,.58)!important;backdrop-filter:blur(16px)!important}
.project-filter-bar .filter-title,.project-filter-bar label,.project-table-header span{font-family:Inter,"Sakira JP",sans-serif!important;font-size:11px!important;line-height:1!important;font-weight:800!important;letter-spacing:.115em!important;text-transform:uppercase!important;color:#858b96!important}
.project-filter-bar .filter-title{color:#e8dfca!important}.project-filter-bar .filter-title svg{width:15px!important;height:15px!important;color:var(--accent)!important}.project-filter-bar label{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:9px!important;width:auto!important;min-width:0!important}.project-filter-bar label>span{flex:0 0 auto!important}.project-filter-bar select{width:100%!important;min-width:0!important;height:34px!important;border-radius:999px!important;font-family:Inter,"Sakira JP",sans-serif!important;font-size:12px!important;line-height:1!important;font-weight:700!important;color:#f4f1e8!important;background:#121419!important}
.project-row{min-height:66px!important}.project-row strong{font-family:Manrope,Inter,"Sakira JP",sans-serif!important;font-size:14px!important;line-height:1.25!important;font-weight:800!important}.project-row small,.project-row p,.project-row time,.project-row .row-cost{font-family:Inter,"Sakira JP",sans-serif!important;font-size:12px!important;line-height:1.45!important;font-weight:650!important}.project-row .status{font-family:Inter,"Sakira JP",sans-serif!important;font-size:11px!important;line-height:1!important;font-weight:850!important;letter-spacing:.04em!important}
@media(max-width:900px){#view-projects .project-filter-bar,#view-create .project-filter-bar{grid-template-columns:1fr!important;align-items:stretch!important;min-height:auto!important}#view-projects .project-table-header,#view-create .project-table-header{top:148px!important}}
@media(max-width:600px){#view-projects .project-filter-bar,#view-create .project-filter-bar,#view-projects .project-table-header,#view-create .project-table-header{position:static!important}#view-projects .project-filter-bar,#view-create .project-filter-bar,.project-filter-bar{display:none!important}#view-projects .project-table-header,#view-create .project-table-header,.project-table-header{display:none!important}}
@media(max-width:600px){#view-projects .project-filter-bar{display:flex!important;position:static!important;z-index:auto!important;width:100%!important;max-width:100%!important;min-height:0!important;margin:0 0 10px!important;padding:8px!important;border-radius:14px!important;box-sizing:border-box!important;box-shadow:none!important;overflow:hidden!important}#view-projects .project-filter-bar .filter-title,#view-projects .project-filter-bar label:not(.filter-search){display:none!important}#view-projects .project-filter-bar .filter-search{display:flex!important;align-items:center!important;gap:8px!important;width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important;color:#8f949d!important;text-transform:none!important;letter-spacing:0!important}#view-projects .project-filter-bar .filter-search input{flex:1 1 auto!important;width:100%!important;min-width:0!important;max-width:100%!important;height:40px!important;padding:9px 12px!important;box-sizing:border-box!important;font-size:16px!important}}

.greeting-header[hidden]{display:none!important}


/* Processing workflow pulse: active step breathes while completed steps keep the tick */







@keyframes flowStepBreathe{0%,100%{filter:brightness(1);box-shadow:0 20px 58px rgba(0,0,0,.52),0 0 34px rgba(216,168,78,.24)}50%{filter:brightness(1.16);box-shadow:0 24px 68px rgba(0,0,0,.58),0 0 58px rgba(216,168,78,.45)}}
@keyframes flowPulseRing{0%,100%{transform:scale(.94);opacity:.55}50%{transform:scale(1.12);opacity:1}}
@keyframes flowIconZoom{0%,100%{transform:scale(.92)}50%{transform:scale(1.16)}}
@keyframes flowIconHalo{0%{transform:scale(.75);opacity:.82}100%{transform:scale(1.55);opacity:0}}


select{border:1px solid var(--line);background:#16181d;color:var(--ink);padding:11px 12px;border-radius:5px;outline:none}

.remix-fields{display:grid;gap:14px;margin-top:4px}
.remix-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.remix-fields input,.remix-fields textarea{width:100%}
.remix-fields textarea{min-height:190px}
.remix-inspect-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.remix-inspect-row button{display:inline-flex;align-items:center;gap:8px}
.remix-inspect-row button svg{width:16px;height:16px}
.remix-inspect-row span{color:var(--muted);font-size:12px;font-weight:700}
.remix-inspect-row a{color:var(--accent);font-size:12px;font-weight:800;text-decoration:none}
.remix-style-suggestions{display:flex;gap:8px;flex-wrap:wrap;margin:-2px 0 2px}
.remix-style-chip{border:1px solid var(--line);background:#171a20;color:var(--ink);border-radius:999px;padding:7px 10px;font-size:12px;font-weight:700}
.remix-style-chip:hover{border-color:var(--accent);background:#211d16}
.remix-check{border-color:var(--accent);background:#211d16}
.remix-check-progress{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.remix-check-step{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#101216;border-radius:6px;padding:10px 12px;color:var(--muted);font-size:12px;font-weight:800}
.remix-check-step span{width:10px;height:10px;border-radius:50%;background:var(--line);flex:0 0 auto}
.remix-check-step.checking{border-color:#5d6572;color:var(--ink)}
.remix-check-step.checking span{background:var(--accent);animation:remixPulse 1s ease-in-out infinite}
.remix-check-step.success{border-color:var(--green);color:var(--green)}
.remix-check-step.success span{background:var(--green)}
.remix-check-step.error{border-color:#7f2b25;color:#ffb0a8}
.remix-check-step.error span{background:#d84f43}
@keyframes remixPulse{0%,100%{opacity:.4;transform:scale(.9)}50%{opacity:1;transform:scale(1.08)}}
body[data-app-mode="cover"] #prompt[hidden]{display:none!important}
body[data-app-mode="cover"] .prompt-label{margin-bottom:16px}
@media(max-width:760px){.remix-grid{grid-template-columns:1fr}.remix-check-progress{grid-template-columns:1fr}}

[data-role="user"] [data-admin-only]{display:none!important}

[data-role="admin"] [data-user-only]{display:none!important}
[data-role="user"] .row-cost,[data-role="user"] .song-cost,[data-role="user"] .project-table-header span:nth-child(6){display:none!important}
.credit-balance{color:var(--green)}

/* Mobile create hero: keep Sakira emblem visible inside the production card. */
@media(max-width:800px){
 .production-hero{grid-template-columns:1fr!important;gap:14px!important;padding:20px!important;text-align:left}
 .production-hero .production-orb{display:flex!important;order:-1;justify-content:center;margin:0 0 4px}
 .production-hero .production-orb img{width:92px!important;height:92px!important;filter:drop-shadow(0 0 22px rgba(216,168,78,.42))}
}

/* Mobile project process: readable vertical timeline instead of squeezed desktop/orbital layout. */


/* Mobile workflow icons: keep original stage symbol visible; show completion as a separate small tick badge. */


/* Mobile navigation: fixed icon-only bottom bar */
.account-mobile-icon{display:none!important}
@media(max-width:600px){
 .shell{grid-template-columns:1fr!important}
 .sidebar{
   position:fixed!important;
   top:auto!important;
   left:0!important;
   right:0!important;
   bottom:0!important;
   height:calc(72px + env(safe-area-inset-bottom,0px))!important;
   padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px))!important;
   display:flex!important;
   flex-direction:row!important;
   align-items:center!important;
   justify-content:space-around!important;
   gap:2px!important;
   border-top:1px solid var(--line)!important;
   background:#0d0f12!important;
   z-index:100!important;
 }
 .sidebar .identity,
 .sidebar .sidebar-cost,
 .sidebar .sidebar-language,
 .sidebar .sidebar-legal,
 .sidebar .add-credit-button{
   display:none!important;
 }
 .sidebar nav{
   flex:1 1 auto!important;
   display:flex!important;
   flex-direction:row!important;
   align-items:center!important;
   justify-content:space-around!important;
   width:auto!important;
   min-width:0!important;
   gap:2px!important;
 }
 .sidebar .nav{
   flex:1 1 0!important;
   min-width:0!important;
   max-width:64px!important;
   width:auto!important;
   height:56px!important;
   min-height:56px!important;
   padding:0!important;
   border-radius:16px!important;
   display:grid!important;
   place-items:center!important;
   gap:0!important;
 }
 .sidebar .nav svg{
   width:26px!important;
   height:26px!important;
   stroke-width:2.2!important;
 }
 .sidebar .nav.has-now-playing{
   position:relative!important;
   overflow:visible!important;
   border-color:rgba(216,168,78,.55)!important;
   box-shadow:0 0 0 1px rgba(216,168,78,.16),0 10px 28px rgba(0,0,0,.28)!important;
 }
 .sidebar .nav.has-now-playing::after{
   content:"";
   position:absolute;
   right:6px;
   top:6px;
   width:18px;
   height:18px;
   border-radius:6px;
   background:var(--now-playing-cover,linear-gradient(135deg,#d8a84e,#fff1bd));
   background-size:cover;
   background-position:center;
   box-shadow:0 0 0 2px #0d0f12,0 0 0 3px rgba(216,168,78,.75);
 }
 .sidebar .nav.is-now-playing::before{
   content:"";
   position:absolute;
   left:9px;
   bottom:8px;
   width:17px;
   height:14px;
   border-radius:5px;
   background:linear-gradient(90deg,#f6d98a 0 3px,transparent 3px 5px,#fff 5px 8px,transparent 8px 10px,#d8a84e 10px 13px,transparent 13px 15px,#fff3c9 15px 17px);
   animation:nowPlayingBars .85s ease-in-out infinite alternate;
   opacity:.95;
 }
 @keyframes nowPlayingBars{from{transform:scaleY(.45);transform-origin:bottom;}to{transform:scaleY(1);transform-origin:bottom;}}
 .sidebar .nav span{
   display:none!important;
 }
 .main{
   padding-bottom:calc(104px + env(safe-area-inset-bottom,0px))!important;
 }
 .account-area{
   display:block!important;
   flex:0 0 56px!important;
   width:56px!important;
   margin:0!important;
   position:relative!important;
 }
 .account-trigger{
   width:56px!important;
   height:56px!important;
   min-height:56px!important;
   margin:0!important;
   padding:0!important;
   border-radius:16px!important;
   display:grid!important;
   place-items:center!important;
   grid-template-columns:1fr!important;
   background:linear-gradient(180deg,#1d1a13,#121419)!important;
   border:1px solid rgba(216,168,78,.28)!important;
 }
 .account-trigger span,
 .account-trigger strong,
 .account-trigger>svg:not(.account-mobile-icon){
   display:none!important;
 }
 .account-trigger .account-mobile-icon{
   display:block!important;
   width:26px!important;
   height:26px!important;
   color:var(--accent)!important;
   grid-column:1!important;
   grid-row:1!important;
 }
 .account-menu{
   position:fixed!important;
   left:auto!important;
   right:8px!important;
   bottom:calc(88px + env(safe-area-inset-bottom,0px))!important;
   transform:none!important;
   width:min(270px,calc(100vw - 16px))!important;
   z-index:999!important;
   border:1px solid rgba(216,168,78,.24)!important;
   border-radius:18px!important;
   background:#111318!important;
   box-shadow:0 22px 58px rgba(0,0,0,.68)!important;
 }
 .account-menu button,
 .account-menu-language,
 .account-menu-theme{
   min-height:44px!important;
   font-size:14px!important;
 }
}

/* Song audio options + trash view */
.song-audio-controls{display:grid;grid-template-columns:minmax(0,1fr) 42px;align-items:center;gap:8px;margin:12px 0}.song-audio-controls audio{width:100%;margin:0!important}.song-audio-more-wrap{align-self:center}.song-more-wrap{position:relative;display:inline-flex}.song-more-trigger{width:38px;height:38px;display:inline-grid!important;place-items:center;padding:0!important}.song-more-trigger svg{width:18px;height:18px}.song-more-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:50;min-width:210px;padding:7px;border:1px solid rgba(216,168,78,.22);border-radius:14px;background:#111318;box-shadow:0 18px 44px rgba(0,0,0,.62)}.song-menu-item,.song-menu-label,.song-more-menu .danger{width:100%;display:flex;align-items:center;justify-content:flex-start;gap:8px;border:0;border-radius:10px;background:transparent;color:var(--ink);padding:10px 11px;text-decoration:none;font-weight:700;font-size:13px}.song-menu-item:hover,.song-more-menu .danger:hover{background:#252119}.song-more-menu .danger{color:#ff9c9c}.song-speed-menu{border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);margin:5px 0;padding:5px 0}.song-menu-label{color:#c9cdd4;cursor:default}.song-speed-options{display:flex;gap:5px;flex-wrap:wrap;padding:0 8px 6px}.song-speed-option{border:1px solid var(--line);background:#17191e;color:#dfe2e8;border-radius:999px;padding:5px 8px;font-size:11px;font-weight:800}.song-speed-option:hover{border-color:rgba(216,168,78,.55);color:var(--accent)}.song-more-menu svg{width:16px;height:16px}.trash-group-title{margin:18px 0 8px;color:#d7c39a;font:800 12px Manrope;text-transform:uppercase;letter-spacing:.12em}.trash-row{display:grid;grid-template-columns:minmax(260px,1.25fr) minmax(220px,1fr) 120px minmax(180px,auto);align-items:center;gap:16px;width:100%;padding:14px 16px;border:1px solid var(--line);background:var(--panel);color:var(--ink);text-align:left}.trash-row strong{display:block;font:800 14px Manrope;line-height:1.25}.trash-row small,.trash-row p,.trash-row time{color:var(--muted);font-size:12px;line-height:1.45;font-weight:650;margin:4px 0 0}.trash-row p{margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.trash-row time{white-space:nowrap}.trash-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}.trash-actions button{white-space:nowrap}.trash-actions .danger{border:1px solid rgba(248,113,113,.35);background:#17191e;color:#fecaca;border-radius:5px;padding:8px 10px;font-weight:700}.trash-actions .danger:hover{background:rgba(248,113,113,.12);color:#fff}@media(max-width:700px){.song-audio-controls{grid-template-columns:minmax(0,1fr) 40px}.song-more-menu{position:fixed;right:12px;bottom:calc(84px + env(safe-area-inset-bottom,0px));top:auto}.trash-row{grid-template-columns:1fr!important}.trash-actions{justify-content:flex-start}}

/* Emergency layout guardrails + persistent selected-song player */
html,body,#app,.shell{background:var(--bg)!important;color:var(--ink)!important}.main{background:var(--bg)!important;min-width:0;overflow-x:hidden}.view{max-width:1180px}.identity{overflow:hidden}.brand-full-logo{width:128px!important;max-width:100%!important;max-height:58px!important;object-fit:contain!important}.production-hero{max-width:100%;border-radius:24px!important;overflow:hidden!important}.production-hero img{max-width:160px!important;max-height:160px!important}.connection-list{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;align-items:stretch}.connection{background:var(--panel)!important;border:1px solid var(--line)!important;border-radius:18px!important;padding:18px!important;box-shadow:var(--shadow);overflow:hidden}.connection h3{display:flex!important;align-items:center!important;gap:10px!important;margin:0 0 10px!important;color:var(--ink)!important}.connection p{color:var(--muted)!important;margin:0 0 14px!important}.connection img,.connection svg,.platform-option img,.platform-option svg{max-width:28px!important;max-height:28px!important}.platform-symbol{width:25px!important;height:25px!important;display:inline-grid!important;place-items:center!important;overflow:hidden!important;flex:0 0 25px!important}.platform-symbol svg{width:16px!important;height:16px!important;display:block!important}.platform-choice{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}.platform-option{overflow:hidden!important}.platform-option .platform-symbol{margin:0!important}

/* Inline workflow player — appears under the process when the middle Play Song button is clicked */
.workflow-song-player{margin:22px 0 28px;}
.workflow-song-slot:empty{display:none;}
.workflow-inline-player[hidden]{display:none!important;}
.workflow-inline-player{
  display:grid;
  grid-template-columns:58px minmax(160px,260px) minmax(280px,1fr);
  align-items:center;
  gap:18px;
  padding:14px 18px;
  border:1px solid rgba(246,196,83,.18);
  border-radius:20px;
  background:linear-gradient(135deg,rgba(14,15,19,.96),rgba(26,22,16,.94));
  box-shadow:0 22px 60px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.04);
}
.inline-player-cover{
  width:58px;
  height:58px;
  border-radius:12px;
  background:#17191f center/cover no-repeat;
  box-shadow:0 10px 28px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.08) inset;
}
.inline-player-meta{min-width:0;}
.inline-player-meta strong{
  display:block;
  color:var(--ink,#f4f1e8);
  font-size:1rem;
  line-height:1.25;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.inline-player-meta span{
  display:block;
  margin-top:4px;
  color:var(--muted,#8f949d);
  font-size:.86rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.inline-player-title-row{display:flex;align-items:center;gap:7px;min-width:0;max-width:100%;}
.inline-player-title-row strong{flex:0 1 auto;min-width:0;max-width:calc(100% - 38px);}
.inline-title-edit{width:30px;height:30px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:#17191e;color:#aeb3bd;padding:0;}
.inline-title-edit:hover{border-color:rgba(216,168,78,.5);color:var(--accent);}
.inline-title-edit svg{width:14px;height:14px;}
.inline-player-style-mood{display:flex;flex-wrap:wrap;gap:6px;margin:7px 0 0;min-width:0;}
.inline-player-meta .inline-player-style-mood span{display:inline-flex;align-items:center;max-width:100%;margin:0;padding:4px 8px;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:rgba(255,255,255,.03);font-size:11px;font-weight:800;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.inline-player-meta .inline-player-style-mood .inline-voice{border-color:rgba(216,168,78,.42);background:rgba(216,168,78,.13);color:#f6d27b;}
.inline-player-center{display:grid;gap:8px;min-width:0;}
.inline-player-controls{display:flex;align-items:center;justify-content:center;gap:16px;}
.inline-player-controls button{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#aeb3bd;
  cursor:pointer;
}
.inline-player-controls button:hover{color:var(--gold,#f6c453);background:rgba(246,196,83,.08);}
.inline-player-controls .inline-player-play{
  width:44px;
  height:44px;
  background:#f4f1e8;
  color:#090a0c;
  box-shadow:0 10px 28px rgba(246,196,83,.22);
}
.inline-player-controls .inline-player-play:hover{background:var(--gold,#f6c453);color:#090a0c;}
.inline-player-controls svg{width:18px;height:18px;}
.inline-player-play svg{width:20px;height:20px;}
.inline-player-timeline{display:grid;grid-template-columns:44px minmax(120px,1fr) 44px;align-items:center;gap:10px;color:#8f949d;font-size:.78rem;font-variant-numeric:tabular-nums;}
.inline-player-progress{width:100%;accent-color:var(--gold,#f6c453);cursor:pointer;}
.workflow-inline-player audio{display:none;}
@media(max-width:900px){
  .workflow-inline-player{grid-template-columns:52px minmax(0,1fr);gap:12px;padding:13px;}
  .inline-player-cover{width:52px;height:52px;}
  .inline-player-center{grid-column:1 / -1;}
  .inline-player-controls{gap:12px;}
}

/* Persistent bottom player cross-page playback polish */
#sakira-player[hidden]{display:none!important;}
.sakira-player .player-progress{display:grid;grid-template-columns:44px minmax(120px,1fr) 44px;align-items:center;gap:10px;color:var(--muted);font-size:.78rem;font-variant-numeric:tabular-nums;}
.sakira-player .player-range{width:100%;accent-color:var(--gold,#f6c453);cursor:pointer;}
.sakira-player .player-download{text-decoration:none;}
.sakira-player .player-stop{color:#ffb1a8;border-color:rgba(255,120,105,.22);}
@media(max-width:900px){.sakira-player{left:12px!important;right:12px!important;bottom:78px!important;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:12px}.sakira-player .player-progress{grid-column:1 / -1}.sakira-player .player-actions{grid-column:2}.sakira-player .player-track{min-width:0}.sakira-player .player-controls{justify-content:flex-end}}

/* Inline workflow player options menu */
.workflow-inline-player{grid-template-columns:58px minmax(160px,260px) minmax(280px,1fr) minmax(112px,auto);}
.inline-player-menu{display:flex;justify-content:flex-end;align-items:center;gap:8px;position:relative;}
.inline-player-menu .song-more-trigger{background:#17191e;border:1px solid rgba(255,255,255,.1);}
.inline-player-menu .song-more-menu{min-width:238px;}
/* n 608 - les regles du bouton « Details » sont retirees avec le bouton. */
@media(max-width:900px){.workflow-inline-player{grid-template-columns:52px minmax(0,1fr) minmax(104px,auto);}.inline-player-menu{grid-column:3;grid-row:1;align-self:center}.inline-player-center{grid-column:1 / -1;}}

/* Bottom player labeled close/download actions */
.sakira-player .player-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;}
.sakira-player .player-action{height:38px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:#17191e;color:var(--ink);padding:0 12px;text-decoration:none;font-size:12px;font-weight:800;white-space:nowrap;}
.sakira-player .player-action svg{width:15px;height:15px;}
.sakira-player .player-close{color:#ffb1a8;border-color:rgba(255,120,105,.28);}
.sakira-player .player-close:hover{background:rgba(255,120,105,.12);}
.sakira-player .player-download:hover{border-color:rgba(216,168,78,.5);color:var(--accent);}
@media(max-width:700px){.sakira-player .player-action span{display:none}.sakira-player .player-action{width:38px;padding:0}}

/* Song version rows use premium inline player style */
.song-version-inline-player{margin:10px 0;border-color:rgba(216,168,78,.24);background:linear-gradient(135deg,rgba(14,15,19,.97),rgba(20,18,14,.95));}
.song-version-inline-player .inline-player-cover{width:64px;height:64px;border-radius:14px;}
.song-version-inline-detail{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:7px 0 0;min-width:0;}
.song-version-inline-detail .song-cost{display:inline-flex;align-items:center;color:var(--accent);font:800 13px Manrope;border:1px solid rgba(216,168,78,.24);border-radius:999px;background:rgba(216,168,78,.10);padding:4px 8px;line-height:1;}
.song-version-inline-detail .status{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:4px 8px;background:#1f2a22;color:#9ee2b5;font-size:11px;font-weight:800;white-space:nowrap;line-height:1;}
.song-version-inline-detail .song-card-details-toggle-inline{min-height:24px;padding:3px 5px;border:0!important;background:transparent!important;box-shadow:none!important;color:#cbb77f!important;font-size:12px;font-weight:800;gap:4px;}
.song-version-inline-detail .song-card-details-toggle-inline:hover{color:var(--accent)!important;background:rgba(216,168,78,.08)!important;}
.song-version-inline-detail .song-card-details-toggle-inline svg{width:13px;height:13px;}
.song-voice-notice{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:24px minmax(0,1fr);
  gap:10px;
  align-items:start;
  margin-top:2px;
  padding:10px 12px;
  border:1px solid rgba(216,168,78,.24);
  border-radius:8px;
  background:rgba(216,168,78,.08);
}
.song-voice-notice svg{width:17px;height:17px;margin-top:1px;color:var(--gold);}
.song-voice-notice strong{display:block;font-size:12px;color:#f4f1e8;margin-bottom:2px;}
.song-voice-notice p{margin:0;color:var(--muted);font-size:12px;line-height:1.4;}
@media(max-width:900px){.song-version-inline-detail{margin:8px 0 0}.song-version-inline-player .inline-player-menu{gap:10px}}

/* n 608 - LE RANG D'ACTIONS DU BLOC DE VERSION.
   Il remplace le bouton « Details » et son depli. Une seule ligne de grille,
   sur toute la largeur, sous la meta et le transport : c'est la seule place
   qui ne dispute rien au titre ni au rond de lecture.
   Les deux groupes qu'il contient (`frequent` puis `rare`) gardent leurs
   propres regles de bouton ; le cadre -- filet du haut, marge -- passe sur le
   rang, sinon on lirait deux traits l'un sous l'autre. */
.song-card-front-actions{
  grid-column:1 / -1;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:9px 10px;
  min-width:0;
  padding-top:12px;
  margin-top:4px;
  border-top:1px solid rgba(216,168,78,.14);
}
.song-card-front-actions > .song-card-quick-actions{
  grid-column:auto;
  flex:0 1 auto;
  min-width:0;
  padding-top:0;
  margin-top:0;
  border-top:0;
}
/* Le separateur entre les gestes frequents et les gestes rares : un filet, pas
   un titre. Il dit qu'on change de nature d'action sans ajouter un mot de
   plus a lire. */
.song-card-front-actions > .song-card-rare-actions{
  padding-inline-start:10px;
  border-inline-start:1px solid rgba(216,168,78,.16);
}
@media(max-width:900px){
  /* Sous ce palier les boutons PASSENT A LA LIGNE, ils ne defilent pas.
     `.song-card-quick-actions` en fait un defilement horizontal quand il est
     une bande dans un panneau ; ici le rang occupe toute la largeur, et une
     bande qui defile cache le troisieme bouton derriere un geste que personne
     ne devine -- exactement le defaut que le n 608 corrige. Mesure a 390 px :
     en defilement, le groupe faisait 561 px pour 324 px visibles.
     `max-width:100%` sur chaque bouton est la garde : un libelle plus long que
     l'ecran se coupe, il ne pousse pas la page. */
  .song-card-front-actions{flex-wrap:wrap;}
  .song-card-front-actions > .song-card-quick-actions{
    max-width:100%;
    overflow:visible;
    flex-wrap:wrap;
  }
  .song-card-front-actions > .song-card-quick-actions .song-quick-action{
    flex:0 1 auto;
    max-width:100%;
    overflow:hidden;
  }
  .song-card-front-actions > .song-card-rare-actions{
    flex:1 1 100%;
    padding-inline-start:0;
    border-inline-start:0;
    border-top:1px solid rgba(216,168,78,.10);
    padding-top:9px;
  }
}

/* Direct song production actions */
.song-card-quick-actions{
  grid-column:1 / -1;
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  padding-top:12px;
  margin-top:4px;
  border-top:1px solid rgba(216,168,78,.14);
}
.song-card-quick-actions .song-quick-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:36px;
  padding:9px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}
.song-card-quick-actions .song-quick-action svg{width:15px;height:15px;}
.song-version-inline-player .inline-player-mode{display:none;}
.song-version-inline-player .inline-player-controls{gap:12px;}
@media(max-width:900px){
  .song-card-quick-actions{grid-column:1 / -1;overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px;}
  .song-card-quick-actions .song-quick-action{flex:0 0 auto;}
}
/* Direct video previews on song cards */
.song-card-video-panel{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:minmax(220px,.72fr) minmax(360px,1.28fr);
  gap:14px;
  margin-top:12px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.08);
}
.song-card-video{
  display:grid;
  grid-template-columns:minmax(92px,140px) minmax(0,1fr);
  gap:14px;
  align-items:stretch;
  padding:12px;
  border:1px solid rgba(216,168,78,.22);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(8,9,12,.66),rgba(20,17,10,.48));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.song-card-video.is-landscape{grid-template-columns:minmax(220px,320px) minmax(0,1fr);}
.song-card-video-preview{display:flex;align-items:center;justify-content:center;min-width:0;}
.song-card-video-preview video{
  width:100%;
  max-height:230px;
  aspect-ratio:9/16;
  border-radius:14px;
  background:#050506;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 18px 42px rgba(0,0,0,.34);
}
.song-card-video.is-landscape .song-card-video-preview video{aspect-ratio:16/9;max-height:190px;}
.song-card-video-info{display:flex;flex-direction:column;gap:8px;min-width:0;justify-content:center;}
.song-card-video-info strong{font:900 14px Manrope;color:var(--ink);letter-spacing:.01em;}
.song-card-video-info>span{color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;}
.song-card-video-actions{display:flex;flex-direction:column;gap:8px;align-items:stretch;}
.song-card-video-actions .song-quick-action{
  justify-content:flex-start;
  min-height:36px;
  padding:8px 11px;
  font-size:11.5px;
  border-color:rgba(255,255,255,.12);
  background:rgba(255,255,255,.035);
}
.song-card-video-actions .platform-symbol{width:19px;height:19px;display:inline-flex;flex:0 0 auto;}
.song-card-video-actions .platform-symbol svg{width:19px;height:19px;display:block;}
.song-card-video-actions .platform-youtube svg{fill:#ff0033;}
.song-card-video-actions .platform-tiktok svg{fill:#fff;}
.song-card-video-actions .song-quick-action:hover{border-color:rgba(216,168,78,.38);background:rgba(216,168,78,.08);}
.song-card-video-actions .song-card-video-option{
  width:max-content;
  min-height:24px;
  padding:2px 0;
  gap:7px;
  align-items:center;
  line-height:1;
  border:0;
  border-radius:0;
  color:#f1d7a1;
  background:transparent;
  box-shadow:none;
}
.song-card-video-actions .song-card-video-option.is-selected{
  color:#d7ffee;
  background:transparent;
}
.song-card-video-actions .song-card-video-option i,
.song-card-video-actions .song-card-video-option svg{
  width:18px;
  height:18px;
  padding:0;
  border:0;
  border-radius:999px;
  background:transparent;
  flex:0 0 18px;
  display:block;
}
.song-card-video-actions .song-card-video-option.is-selected i,
.song-card-video-actions .song-card-video-option.is-selected svg{
  background:transparent;
}
.song-card-video-option-status{
  margin:0;
  max-width:260px;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  line-height:1.35;
}
.song-card-video-option-status[data-state="on"]{color:#d7ffee;}
.song-card-video-option-status[data-state="working"]{color:#f1d7a1;}
.song-card-video-option-status[data-state="error"]{color:#fecaca;}
.song-card-video-option-status[data-state="error"][title]{cursor:help;text-decoration:underline dotted rgba(254,202,202,.55);text-underline-offset:3px;}
@media(max-width:1180px){
  .song-card-video-panel{grid-template-columns:1fr;}
  .song-card-video.is-landscape{grid-template-columns:minmax(200px,280px) minmax(0,1fr);}
}
@media(max-width:700px){
  .song-card-video,.song-card-video.is-landscape{grid-template-columns:1fr;}
  .song-card-video.is-short .song-card-video-preview{max-width:160px;justify-self:center;}
  .song-card-video-actions{display:grid;grid-template-columns:1fr;}
}

/* Project automatic production: process + lyrics side by side */










/* Desktop: fixed-size orbital process, centered bubble */










/* Fit-to-screen front media polish */
.song-version-inline-player{
  align-items:center;
}
.song-card-artwork-panel,
.song-card-video-panel{
  grid-column:1 / -1;
  width:100%;
  max-width:100%;
  min-width:0;
}
.song-card-artwork-panel{
  margin-top:10px;
  padding:12px;
  border:1px solid rgba(216,168,78,.16);
  border-radius:18px;
  background:rgba(7,8,11,.42);
}
.song-card-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.song-card-panel-head strong{display:block;font:900 12px Manrope;color:var(--ink);text-transform:uppercase;letter-spacing:.08em;}
.song-card-panel-head span{display:block;margin-top:2px;color:var(--muted);font-size:11px;}
.song-card-artworks{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(104px,128px));
  gap:10px;
  align-items:start;
}
.song-card-artwork{
  position:relative;
  overflow:hidden;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.035);
}
.song-card-artwork.selected,
.artwork-candidate.candidate-selected{border-color:rgba(216,168,78,.72);box-shadow:0 0 0 2px rgba(216,168,78,.24);}
.artwork-candidate{cursor:pointer;}
.artwork-candidate:focus-visible{outline:2px solid #d8a84e;outline-offset:3px;}
.song-card-artwork img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;}
.song-card-artwork div{
  position:absolute;left:0;right:0;bottom:0;
  display:flex;align-items:center;justify-content:center;gap:5px;
  padding:5px;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.78));
}
.song-card-artwork span{font-size:8.5px;font-weight:900;color:#fff;text-transform:uppercase;letter-spacing:.04em;text-align:center;line-height:1.1;}
.song-card-artwork button{min-height:22px;padding:3px 6px;border-radius:999px;font-size:9px;font-weight:900;}
.artwork-version{position:relative;}
.artwork-use{display:none;}
.artwork-candidate.candidate-selected .artwork-use{display:inline-flex;background:#d8a84e;color:#fff;border-color:transparent;box-shadow:0 8px 24px rgba(216,168,78,.28);}
.artwork-preview{position:absolute;top:6px;left:6px;z-index:3;width:32px;min-width:32px;height:32px;min-height:32px;padding:0;display:grid;place-items:center;color:#fff;background:rgba(9,10,12,.78);border-color:rgba(255,255,255,.18);box-shadow:0 6px 18px rgba(0,0,0,.35);cursor:zoom-in;}
.artwork-preview svg{width:15px;height:15px;}
.song-card-artwork .artwork-remove,
.artwork-version .artwork-remove{position:absolute;top:6px;right:6px;z-index:3;width:28px;min-width:28px;height:28px;min-height:28px;padding:0;color:#fff;border-color:rgba(255,120,120,.7);background:rgba(116,26,26,.92);box-shadow:0 6px 18px rgba(0,0,0,.45);}
.song-card-artwork .artwork-remove svg,
.artwork-version .artwork-remove svg{width:14px;height:14px;}
.song-card-artwork-actions .song-quick-action{min-height:30px;padding:6px 9px;font-size:10.5px;}
.artwork-preview-dialog{width:min(960px,calc(100vw - 28px));border-radius:18px;background:#090a0c;border:1px solid rgba(255,255,255,.12);}
.artwork-preview-dialog>div{position:relative;padding:14px;}
.artwork-preview-dialog img{display:block;width:100%;max-height:calc(100vh - 120px);object-fit:contain;border-radius:12px;background:#050608;}
.artwork-preview-dialog .icon{position:absolute;right:22px;top:22px;z-index:2;background:rgba(9,10,12,.82);border-color:rgba(255,255,255,.18);}
.production-task-panel{
  margin:0 0 22px;
  border:1px solid rgba(216,168,78,.18);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(17,19,24,.96),rgba(10,11,14,.96));
  box-shadow:0 18px 48px rgba(0,0,0,.28);
  overflow:hidden;
}
.production-task-panel details:not([open]) .production-task-head{border-bottom:0;}
.production-task-head{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.07);cursor:pointer;}
.production-task-head::marker{content:"";}
.production-task-head::-webkit-details-marker{display:none;}
.production-task-head>i{width:18px;height:18px;color:#d8a84e;transition:transform .18s ease;}
.production-task-panel details[open] .production-task-head>i{transform:rotate(180deg);}
.production-task-head strong{display:block;font:900 12px Manrope;text-transform:uppercase;letter-spacing:.10em;color:var(--ink);}
.production-task-head span{display:block;margin-top:3px;color:var(--muted);font-size:11px;font-weight:700;}
.production-task-list{display:grid;}
.production-task{display:grid;grid-template-columns:minmax(180px,1fr) minmax(120px,220px) minmax(180px,1fr) auto;gap:12px;align-items:center;padding:12px 16px;border-top:1px solid rgba(255,255,255,.055);}
.production-task:first-child{border-top:0;}
.production-task-main{display:flex;align-items:center;gap:10px;min-width:0;}
.production-task-main>i{width:32px;height:32px;display:grid;place-items:center;flex:0 0 32px;border-radius:11px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);color:#cfd3da;}
.production-task-main svg{width:17px;height:17px;}
.production-task-main strong{display:block;font:900 12px Manrope;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.production-task-main span{display:block;margin-top:2px;color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;}
.production-task-progress{height:7px;border-radius:999px;background:rgba(255,255,255,.07);overflow:hidden;}
.production-task-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,#d8a84e,#59bd83);border-radius:inherit;}
.production-task-meta{color:var(--muted);font-size:11px;font-weight:700;line-height:1.35;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.production-task-retry{white-space:nowrap;min-height:32px;padding:6px 10px;font-size:11px;}
.production-task.complete .production-task-main>i{color:#090a0c;background:linear-gradient(135deg,#f2d18b,#b98228);border-color:transparent;}
.production-task.waiting .production-task-main>i,
.production-task.running .production-task-main>i,
.production-task.queued .production-task-main>i{color:#f2d18b;border-color:rgba(216,168,78,.28);background:rgba(216,168,78,.08);}
.production-task.failed .production-task-main>i{color:#fecaca;border-color:rgba(248,113,113,.32);background:rgba(127,29,29,.18);}
@media(max-width:800px){
  .production-task{grid-template-columns:1fr;gap:9px;}
  .production-task-meta{white-space:normal;}
  .production-task-retry{justify-self:start;}
}
.video-lyrics-action{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.035);
  color:var(--ink);
  font-size:10.5px;
  font-weight:800;
  white-space:nowrap;
}
.video-lyrics-action svg{width:15px;height:15px;}
.song-card-video-settings{display:flex;align-items:center;justify-content:flex-end;}
.song-card-video-bottom-settings{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  padding-top:8px;
}
.artwork-upload-action{white-space:nowrap;}
.artwork-upload-tile{
  min-height:92px;
  border-style:dashed;
  display:grid;
  place-items:center;
  align-content:center;
  gap:8px;
  color:var(--ink);
  background:rgba(216,168,78,.07);
  cursor:pointer;
}
.artwork-upload-tile svg{width:22px;height:22px;color:var(--gold);}
.artwork-upload-tile span{
  position:static;
  display:block;
  padding:0;
  background:none;
  color:var(--ink);
  font-size:9px;
}
.artwork-generation-notice-slot:not(:empty){margin:8px 0 10px;}
.artwork-generation-notice{
  display:grid;
  gap:3px;
  padding:10px 12px;
  border:1px solid rgba(216,168,78,.32);
  border-radius:14px;
  background:linear-gradient(135deg,rgba(216,168,78,.12),rgba(7,8,11,.72));
  color:var(--ink);
}
.artwork-generation-notice strong{font:900 11px Manrope;text-transform:uppercase;letter-spacing:.08em;color:var(--gold);}
.artwork-generation-notice span{font-size:12px;line-height:1.45;color:var(--muted);}
/* n 2051 - Le repli de miniature se distingue de l avis de quota juste
   au-dessus : celui-ci dit « ca reviendra », celui-la dit « refaites-la
   maintenant, sinon la publication refusera ». Meme forme, autre couleur. */
.artwork-fallback-notice{border-color:rgba(232,109,187,.42);background:linear-gradient(135deg,rgba(232,109,187,.14),rgba(7,8,11,.72));}
.artwork-fallback-notice strong{color:#f0a6d4;}
.production-status-panel{margin:14px 0 18px;border:1px solid rgba(216,168,78,.22);background:linear-gradient(180deg,rgba(17,19,24,.96),rgba(10,11,14,.96));border-radius:8px;padding:14px;box-shadow:0 18px 44px rgba(0,0,0,.26);}
.production-status-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px;}
.production-status-head strong{font:900 12px Manrope;text-transform:uppercase;letter-spacing:.08em;color:#f2d18b;}
.production-status-head span{font-size:12px;color:var(--muted);}
.production-status-list{display:grid;gap:8px;}
.production-status-item{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035);border-radius:7px;padding:10px;}
.production-status-item svg{width:18px;height:18px;margin-top:1px;color:#f2d18b;}
.production-status-item strong{display:block;font-size:13px;color:#f4f1e8;margin-bottom:3px;}
.production-status-item p{margin:0;color:#aeb4bd;font-size:12px;line-height:1.45;}
.production-status-item.error{border-color:rgba(248,113,113,.28);background:rgba(127,29,29,.16);}
.production-status-item.error svg{color:#fecaca;}
.production-status-item.warning{border-color:rgba(216,168,78,.22);background:rgba(216,168,78,.08);}
.production-status-item.active{border-color:rgba(216,168,78,.30);background:rgba(216,168,78,.10);}
.production-status-item.active svg{animation:spin 1.1s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

.song-card-video-panel{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:10px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.08);
  align-items:start;
}
.song-card-video{
  min-width:0;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:12px;
  align-items:center;
  padding:10px;
  border:1px solid rgba(216,168,78,.2);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(8,9,12,.68),rgba(20,17,10,.42));
}
.song-card-video.is-short{grid-template-columns:92px minmax(0,1fr);}
.song-card-video.is-landscape{grid-template-columns:minmax(150px,210px) minmax(0,1fr);}
.song-card-video-preview{display:flex;align-items:center;justify-content:center;min-width:0;}
.song-card-video-preview video{
  display:block;
  width:100%;
  max-width:92px;
  height:auto;
  max-height:164px;
  aspect-ratio:9/16;
  border-radius:12px;
  background:#050506;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 12px 30px rgba(0,0,0,.32);
}
.song-card-video.is-landscape .song-card-video-preview video{
  max-width:210px;
  max-height:118px;
  aspect-ratio:16/9;
}
.song-card-video-info{display:flex;flex-direction:column;gap:6px;min-width:0;justify-content:center;}
.song-card-video-info strong{font:900 12.5px Manrope;color:var(--ink);}
.song-card-video-info>span{color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;}
.song-card-video-actions{display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.song-card-video-actions .song-quick-action{
  min-height:30px;
  padding:6px 8px;
  font-size:10.5px;
  justify-content:flex-start;
  border-color:rgba(255,255,255,.12);
  background:rgba(255,255,255,.035);
}
.song-card-video-actions .platform-symbol{width:17px;height:17px;display:inline-flex;flex:0 0 auto;}
.song-card-video-actions .platform-symbol svg{width:17px;height:17px;display:block;}
.song-card-video-actions .platform-youtube svg{fill:#ff0033;}
.song-card-video-actions .platform-tiktok svg{fill:#fff;}
.song-card-video-actions .song-card-video-option{
  width:max-content;
  min-height:24px;
  padding:2px 0;
  gap:7px;
  align-items:center;
  line-height:1;
  border:0;
  border-radius:0;
  color:#f1d7a1;
  background:transparent;
  box-shadow:none;
}
.song-card-video-actions .song-card-video-option.is-selected{
  color:#d7ffee;
  background:transparent;
}
.song-card-video-actions .song-card-video-option i,
.song-card-video-actions .song-card-video-option svg{
  width:18px;
  height:18px;
  padding:0;
  border:0;
  border-radius:999px;
  background:transparent;
  flex:0 0 18px;
  display:block;
}
.song-card-video-actions .song-card-video-option.is-selected i,
.song-card-video-actions .song-card-video-option.is-selected svg{
  background:transparent;
}
.song-card-video-option-status{
  margin:0;
  max-width:260px;
  color:var(--muted);
  font-size:10.5px;
  font-weight:800;
  line-height:1.35;
}
.song-card-video-option-status[data-state="on"]{color:#d7ffee;}
.song-card-video-option-status[data-state="working"]{color:#f1d7a1;}
.song-card-video-option-status[data-state="error"]{color:#fecaca;}
@media(max-width:1180px){
  .song-card-video-panel{grid-template-columns:1fr;}
  .song-card-video.is-short{grid-template-columns:92px minmax(0,1fr);}
  .song-card-video.is-landscape{grid-template-columns:minmax(150px,210px) minmax(0,1fr);}
}
@media(max-width:720px){
  .song-card-panel-head{align-items:flex-start;flex-direction:column;}
  .song-card-artworks{grid-template-columns:repeat(3,86px);overflow-x:auto;}
  .song-card-video,.song-card-video.is-short,.song-card-video.is-landscape{grid-template-columns:1fr;}
  .song-card-video.is-short .song-card-video-preview{justify-self:center;max-width:110px;}
  .song-card-video.is-landscape .song-card-video-preview video{max-width:100%;max-height:180px;}
}

/* Balanced process + lyrics review layout */












/* Final desktop process sizing: keep stage bubbles attached to the round track. */




/* Stable production layout reset: one circle model, one lyrics panel. */


/* Authenticated app must not show full Sakira banner artwork */
#app .brand-full-logo,
#app .login-full-logo,
#app .production-logo-lockup{
  display:none!important;
  width:0!important;
  height:0!important;
  max-width:0!important;
  max-height:0!important;
  overflow:hidden!important;
}
.identity-name{font:700 18px Manrope;color:var(--ink);letter-spacing:-.02em}
#app .identity{min-height:42px;overflow:hidden!important}

/* Restore authenticated sidebar brand logo. */
#app .identity .brand-full-logo{
  display:block!important;
  width:190px!important;
  max-width:100%!important;
  max-height:58px!important;
  height:auto!important;
  object-fit:contain!important;
  overflow:visible!important;
}
#app .identity .logo,
#app .identity .identity-name{display:none!important;}
@media(max-width:800px){
  #app .identity .brand-full-logo{
    width:44px!important;
    height:44px!important;
    object-fit:cover!important;
    object-position:left center!important;
    border-radius:50%!important;
  }
}

/* Combined YouTube publish action when both video formats are ready. */
.song-card-youtube-publish{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:repeat(5,max-content);
  gap:8px;
  justify-content:flex-start;
  align-items:center;
}
.song-card-youtube-publish .song-quick-action{
  min-height:38px;
  padding:9px 13px;
  border-radius:999px;
}
.song-card-youtube-publish .platform-symbol{
  width:18px!important;
  height:18px!important;
  flex:0 0 18px!important;
}
.song-card-youtube-publish .song-card-publish-action,
.song-card-youtube-publish .song-card-publish-action.primary,
.song-card-youtube-publish .song-card-publish-action.secondary{
  min-height:34px!important;
  height:34px!important;
  padding:7px 10px!important;
  border-radius:999px!important;
  font-size:10.5px!important;
  line-height:1!important;
  font-weight:800!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  white-space:nowrap!important;
}
.song-card-youtube-publish .song-card-publish-action span:not(.platform-symbol){
  line-height:1!important;
}
.youtube-schedule-status{
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  color:#d7b96f;
  font-size:12px;
  font-weight:800;
  padding:2px 0 6px;
  order:-1;
}
.youtube-schedule-status span{
  min-width:0;
  overflow-wrap:anywhere;
}
.youtube-schedule-status button{
  min-height:28px!important;
  height:28px!important;
  padding:5px 9px!important;
  border-radius:999px!important;
  font-size:10px!important;
}
.youtube-schedule-status .change-schedule{
  display:inline-flex!important;
  align-items:center!important;
  gap:5px!important;
}
.youtube-schedule-status .change-schedule svg{
  width:14px!important;
  height:14px!important;
}
.schedule-dialog{
  width:min(560px,calc(100vw - 28px))!important;
}
.schedule-card{
  padding:28px!important;
  text-align:left!important;
}
.schedule-card .eyebrow{
  color:var(--accent);
  text-align:center;
}
.schedule-card h2{
  margin:6px 0 20px!important;
  text-align:center;
  font-size:34px!important;
}
.schedule-picker{
  display:grid;
  gap:18px;
}
.schedule-native-fields{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.schedule-native-fields label{
  display:grid;
  gap:8px;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
}
.schedule-native-fields input{
  width:100%;
  min-height:52px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#17191f;
  color:var(--ink);
  padding:12px 14px;
  font-size:17px;
  font-weight:750;
  color-scheme:dark;
}
.schedule-native-fields input:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(216,168,78,.16);
}
.schedule-days{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:8px;
}
.schedule-days button{
  min-height:62px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#17191f;
  color:var(--ink);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  font-weight:800;
}
.schedule-days button strong{
  font-size:12px;
}
.schedule-days button span{
  color:var(--muted);
  font-size:11px;
}
.schedule-days button:hover{
  border-color:rgba(216,168,78,.6);
}
.schedule-days button.is-selected{
  border-color:rgba(216,168,78,.95);
  background:linear-gradient(180deg,rgba(216,168,78,.22),rgba(216,168,78,.08));
  box-shadow:0 0 0 1px rgba(216,168,78,.3) inset;
  color:#ffe6a3;
}
.schedule-days button.is-selected span{
  color:#f4d98c;
}
.schedule-time{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:12px;
}
.schedule-time>div{
  border:1px solid var(--line);
  border-radius:16px;
  background:#12141a;
  padding:12px;
}
.schedule-time>div>span{
  display:block;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  margin-bottom:8px;
  text-transform:uppercase;
}
.schedule-stepper{
  display:grid;
  grid-template-rows:28px 40px 28px;
  align-items:center;
  justify-items:center;
}
.schedule-stepper button,
.schedule-period button{
  min-height:28px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#181b22;
  color:var(--ink);
}
.schedule-stepper button{
  width:100%;
  display:grid;
  place-items:center;
}
.schedule-stepper strong{
  color:var(--ink);
  font:800 30px Manrope;
}
.schedule-period{
  display:grid;
  gap:8px;
}
.schedule-period button{
  padding:10px;
  font-weight:900;
}
.schedule-period button.is-selected{
  border-color:var(--accent);
  background:var(--accent);
  color:#111;
}
.schedule-preview{
  margin:0;
  border:1px solid rgba(216,168,78,.35);
  border-radius:14px;
  background:rgba(216,168,78,.08);
  color:#f3d98b;
  padding:12px 14px;
  text-align:center;
  font-weight:800;
}
.schedule-all-platforms{
  display:grid;
  gap:10px;
}
.schedule-all-platform{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  border:1px solid rgba(216,168,78,.22);
  border-radius:14px;
  background:#14161c;
  color:var(--ink);
  padding:12px;
}
.schedule-all-platform-head{display:flex;align-items:center;gap:10px;color:var(--ink);cursor:pointer;}
.schedule-all-platform-head input{accent-color:var(--accent);width:18px;height:18px;flex:0 0 auto;}
.schedule-all-platform-head span:not(.platform-symbol){font-weight:800;}
.schedule-all-platform .publication-account-field{margin:0 0 0 28px;}
.schedule-all-platform small{display:block;margin-left:28px;color:var(--muted);font-size:11px;font-weight:700;}
.schedule-all-platform.disabled{opacity:.55;}
.schedule-all-platform.disabled .schedule-all-platform-head{cursor:not-allowed;}
.schedule-platform-all-option{border-color:rgba(216,168,78,.52)!important;background:rgba(216,168,78,.08)!important;}
.song-card-video-head{
  grid-column:1 / -1;
  margin-bottom:0!important;
}

/* Keep vertical and landscape videos together in one video area. */
@media(min-width:761px){
  .song-card-video-panel{
    display:grid!important;
    grid-template-columns:minmax(250px,.8fr) minmax(320px,1.2fr)!important;
    gap:12px!important;
    align-items:stretch!important;
  }
  .song-card-youtube-publish{
    grid-column:1 / -1!important;
  }
  .song-card-video.is-short{
    grid-template-columns:92px minmax(0,1fr)!important;
  }
  .song-card-video.is-landscape{
    grid-template-columns:minmax(150px,220px) minmax(0,1fr)!important;
  }
  .song-card-video.is-landscape .song-card-video-preview video{
    max-width:220px!important;
    max-height:124px!important;
  }
}
@media(max-width:720px){
  .schedule-dialog{
    width:min(430px,calc(100vw - 20px))!important;
  }
  .schedule-card{
    padding:24px 16px!important;
  }
  .schedule-card h2{
    font-size:28px!important;
  }
  .schedule-days,
  .schedule-time,
  .schedule-native-fields{
    grid-template-columns:1fr;
  }
}
@media(max-width:760px){
  .song-card-video-panel{
    grid-template-columns:1fr!important;
  }
  .song-card-youtube-publish{
    grid-template-columns:1fr!important;
  }
  .youtube-schedule-status{
    align-items:flex-start;
    flex-direction:column;
  }
}

/* Fixed bottom now-playing music bar */
#sakira-player[hidden]{display:none!important;}
.sakira-player{
  position:fixed!important;
  left:calc(var(--sidebar-width,260px) + 28px)!important;
  right:28px!important;
  bottom:24px!important;
  z-index:1200!important;
  display:grid!important;
  grid-template-columns:minmax(180px,300px) minmax(320px,1fr) 42px!important;
  align-items:center!important;
  gap:22px!important;
  min-height:86px!important;
  padding:14px 16px!important;
  border:1px solid rgba(255,255,255,.08)!important;
  border-radius:22px!important;
  background:linear-gradient(135deg,rgba(30,32,38,.98),rgba(8,9,12,.98))!important;
  box-shadow:0 24px 80px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.05)!important;
  backdrop-filter:blur(18px)!important;
}
body:has(#sakira-player:not([hidden])) .main{padding-bottom:132px!important;}
.sakira-player .player-track{display:flex!important;align-items:center!important;gap:14px!important;min-width:0!important;cursor:pointer!important;border-radius:16px!important;transition:background .16s ease,transform .16s ease!important;}
.sakira-player .player-track:hover,.sakira-player .player-track:focus-visible{background:rgba(255,255,255,.045)!important;outline:none!important;transform:translateY(-1px)!important;}
.sakira-player .player-cover{width:58px!important;height:58px!important;flex:0 0 58px!important;border-radius:12px!important;background-size:cover!important;background-position:center!important;background-color:#15171c!important;box-shadow:0 12px 34px rgba(0,0,0,.42),0 0 0 1px rgba(255,255,255,.1) inset!important;}
.sakira-player .player-track strong{display:block!important;color:#fff!important;font-size:16px!important;font-weight:850!important;line-height:1.2!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.sakira-player .player-track span{display:block!important;margin-top:5px!important;color:#9aa0aa!important;font-size:13px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
.sakira-player .player-center{display:grid!important;gap:9px!important;min-width:0!important;}
.sakira-player .player-controls{display:flex!important;align-items:center!important;justify-content:center!important;gap:18px!important;}
.sakira-player .player-icon,.sakira-player .player-main,.sakira-player .player-close{border:0!important;background:transparent!important;color:#f5f5f5!important;display:grid!important;place-items:center!important;cursor:pointer!important;padding:0!important;}
.sakira-player .player-icon{width:30px!important;height:30px!important;color:#9aa0aa!important;opacity:.9!important;}
.sakira-player .player-icon:disabled{cursor:default!important;opacity:.62!important;}
.sakira-player.is-shuffle .player-shuffle,
.sakira-player.is-repeat .player-repeat,
.inline-player-mode.is-active{
  color:#ffd98a!important;
  opacity:1!important;
  filter:drop-shadow(0 0 10px rgba(216,168,78,.34));
}
.sakira-player .player-icon svg{width:18px!important;height:18px!important;}
.sakira-player .player-main{width:48px!important;height:48px!important;border-radius:999px!important;background:#f6f1e8!important;color:#090a0c!important;box-shadow:0 12px 30px rgba(0,0,0,.35)!important;}
.sakira-player .player-main svg{width:22px!important;height:22px!important;fill:currentColor!important;stroke-width:2.4!important;}
.sakira-player.is-playing .player-main{background:linear-gradient(135deg,#fff,#d8a84e)!important;color:#090a0c!important;}
.sakira-player .player-progress{display:grid!important;grid-template-columns:46px minmax(120px,1fr) 46px!important;align-items:center!important;gap:10px!important;color:#9aa0aa!important;font-size:12px!important;font-variant-numeric:tabular-nums!important;}
.sakira-player .player-range{width:100%!important;height:4px!important;accent-color:#fff!important;cursor:pointer!important;}
.sakira-player .player-close{width:38px!important;height:38px!important;justify-self:end!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.12)!important;color:#dfe2e8!important;background:rgba(255,255,255,.04)!important;}
.sakira-player .player-close:hover{color:#fff!important;background:rgba(255,255,255,.1)!important;border-color:rgba(255,255,255,.24)!important;}
.sakira-player .player-close svg{width:18px!important;height:18px!important;}
@media(max-width:900px){
  .sakira-player{left:12px!important;right:12px!important;bottom:78px!important;grid-template-columns:minmax(0,1fr) 38px!important;gap:12px!important;min-height:0!important;padding:12px!important;border-radius:18px!important;}
  .sakira-player .player-track{grid-column:1;}
  .sakira-player .player-cover{width:48px!important;height:48px!important;flex-basis:48px!important;}
  .sakira-player .player-center{grid-column:1 / -1;grid-row:2;}
  .sakira-player .player-close{grid-column:2;grid-row:1;}
  .sakira-player .player-controls{gap:13px!important;}
  .sakira-player .player-main{width:44px!important;height:44px!important;}
  body:has(#sakira-player:not([hidden])) .main{padding-bottom:178px!important;}
}

/* Bottom player alignment and safe scroll space */
:root{--app-sidebar-width:220px;--page-pad:clamp(20px,4vw,64px);}
.sakira-player{
  left:max(calc(var(--app-sidebar-width) + var(--page-pad)),calc(50vw - 640px + var(--page-pad)))!important;
  right:max(var(--page-pad),calc(50vw - 860px + var(--page-pad)))!important;
  bottom:22px!important;
  width:auto!important;
  max-width:none!important;
}
body:has(#sakira-player:not([hidden])) .main{
  padding-bottom:210px!important;
}
body:has(#sakira-player:not([hidden])) #project-list,
body:has(#sakira-player:not([hidden])) #recent-list,
body:has(#sakira-player:not([hidden])) #songs,
body:has(#sakira-player:not([hidden])) #song-detail{
  padding-bottom:190px!important;
}
#view-project #songs{
  padding-bottom:140px!important;
}
body:has(#sakira-player:not([hidden])) #view-project #songs{
  padding-bottom:320px!important;
}
@media(max-width:900px){
  .sakira-player{
    left:12px!important;
    right:12px!important;
    bottom:78px!important;
  }
  body:has(#sakira-player:not([hidden])) .main{
    padding-bottom:230px!important;
  }
  body:has(#sakira-player:not([hidden])) #project-list,
  body:has(#sakira-player:not([hidden])) #recent-list,
  body:has(#sakira-player:not([hidden])) #songs,
  body:has(#sakira-player:not([hidden])) #song-detail{
    padding-bottom:220px!important;
  }
  #view-project #songs{
    padding-bottom:180px!important;
  }
  body:has(#sakira-player:not([hidden])) #view-project #songs{
    padding-bottom:380px!important;
  }
}

/* User playlist */
.playlist-like-action.is-liked{
  color:#ffd98a!important;
  border-color:rgba(216,168,78,.54)!important;
  background:rgba(216,168,78,.12)!important;
}

/* Publication status shown directly beside generated videos */
.song-publication-status{
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-height:30px;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  background:rgba(255,255,255,.035);
  color:#c9ced8;
  font-size:11px;
  font-weight:850;
}
.song-publication-status span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-width:0;
}
.song-publication-status svg{
  width:14px;
  height:14px;
  flex:0 0 14px;
}
.song-publication-status.published{
  border-color:rgba(89,189,131,.34);
  background:rgba(89,189,131,.10);
  color:#9ee2b5;
}
.song-publication-status.failed{
  border-color:rgba(255,120,105,.34);
  background:rgba(255,120,105,.10);
  color:#ffb1a8;
}
.song-publication-status.uploading{
  border-color:rgba(216,168,78,.34);
  background:linear-gradient(90deg,rgba(216,168,78,.08),rgba(216,168,78,.20),rgba(216,168,78,.08));
  background-size:220% 100%;
  color:#ffd98a;
  animation:uploadStatusPulse 1.15s ease-in-out infinite,uploadStatusSweep 1.8s linear infinite;
}
.song-publication-status.uploading:before{
  content:"";
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:999px;
  background:#ffd98a;
  box-shadow:0 0 0 0 rgba(216,168,78,.72);
  animation:uploadStatusDot 1.15s ease-out infinite;
}
.song-publication-status.uploading svg{
  display:none!important;
}
@keyframes uploadStatusPulse{0%,100%{box-shadow:0 0 0 rgba(216,168,78,0)}50%{box-shadow:0 0 18px rgba(216,168,78,.26)}}
@keyframes uploadStatusSweep{to{background-position:-220% 0}}
@keyframes uploadStatusDot{0%{box-shadow:0 0 0 0 rgba(216,168,78,.72);transform:scale(.9)}70%{box-shadow:0 0 0 7px rgba(216,168,78,0);transform:scale(1.05)}100%{box-shadow:0 0 0 0 rgba(216,168,78,0);transform:scale(.9)}}
.song-publication-status a{
  color:#ffd98a;
  text-decoration:none;
  white-space:nowrap;
}
.song-publication-status a:hover{
  text-decoration:underline;
}

/* Large YouTube upload tracker shown at the top of VIDEOS */
.youtube-upload-tracker{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:minmax(240px,1fr) minmax(260px,1.25fr);
  gap:12px;
  align-items:center;
  padding:13px;
  border:1px solid rgba(89,189,131,.28);
  border-radius:14px;
  background:linear-gradient(135deg,rgba(16,34,25,.92),rgba(12,13,16,.96));
  box-shadow:0 14px 36px rgba(0,0,0,.34);
}
.youtube-upload-tracker.active{
  border-color:rgba(216,168,78,.42);
  background:linear-gradient(90deg,rgba(216,168,78,.10),rgba(216,168,78,.22),rgba(216,168,78,.10));
  background-size:220% 100%;
  animation:uploadStatusSweep 1.8s linear infinite;
}
.youtube-upload-main{display:flex;align-items:center;gap:10px;min-width:0;}
.youtube-upload-dot{
  width:13px;
  height:13px;
  border-radius:999px;
  background:#9ee2b5;
  box-shadow:0 0 0 0 rgba(89,189,131,.58);
}
.youtube-upload-tracker.active .youtube-upload-dot{background:#ffd98a;animation:uploadStatusDot 1.15s ease-out infinite;}
.youtube-upload-main strong{
  display:block;
  color:#fff;
  font:900 13px Manrope;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.youtube-upload-main small{display:block;margin-top:3px;color:#c7bd9f;font-size:11px;line-height:1.35;}
.youtube-upload-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
.youtube-upload-step{
  min-width:0;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:12px;
  background:rgba(255,255,255,.04);
}
.youtube-upload-step span{display:block;color:#8f949d;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;}
.youtube-upload-step strong{display:block;margin-top:3px;color:#dfe4ea;font-size:11px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.youtube-upload-step em{display:block;min-height:13px;margin-top:2px;color:#ffd98a;font-style:normal;font-size:10px;font-weight:850;}
.youtube-upload-step.active{border-color:rgba(216,168,78,.52);background:rgba(216,168,78,.12);}
.youtube-upload-step.published{border-color:rgba(89,189,131,.42);background:rgba(89,189,131,.10);}
.youtube-upload-step.failed{border-color:rgba(255,120,105,.42);background:rgba(255,120,105,.10);}
.youtube-upload-step.has-link{cursor:pointer;}
@media(max-width:760px){.youtube-upload-tracker{grid-template-columns:1fr}.youtube-upload-steps{grid-template-columns:1fr}}
.playlist-like-action.is-liked svg{
  fill:currentColor!important;
}
.playlist-list{
  display:grid;
  gap:10px;
}
.playlist-play-all{
  min-height:42px;
  border-radius:999px!important;
  white-space:nowrap;
}
.playlist-row{
  display:grid;
  grid-template-columns:72px minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  padding:13px;
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(135deg,rgba(17,19,24,.98),rgba(11,12,15,.98));
  box-shadow:0 12px 34px rgba(0,0,0,.26);
}
.playlist-cover{
  width:72px;
  height:72px;
  border-radius:12px;
  background:#17191e center/cover;
  box-shadow:0 0 0 1px rgba(255,255,255,.08) inset;
}
.playlist-meta{
  min-width:0;
}
.playlist-meta strong{
  display:block;
  color:#fff;
  font:850 16px Manrope;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.playlist-meta span,
.playlist-meta small{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:12px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.playlist-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}
.playlist-actions .song-quick-action{
  min-height:36px;
  border-radius:999px;
  padding:8px 12px;
  font-size:12px;
  font-weight:850;
}
@media(max-width:700px){
  #view-playlist .section-head{
    align-items:flex-start;
    gap:12px;
  }
  .playlist-play-all{
    width:100%;
    justify-content:center;
  }
  .playlist-row{
    grid-template-columns:56px minmax(0,1fr);
  }
  .playlist-cover{
    width:56px;
    height:56px;
  }
  .playlist-actions{
    grid-column:1 / -1;
    justify-content:flex-start;
    flex-wrap:wrap;
  }
}

/* Per-song media disclosure */
.song-card-media-panel{
  grid-column:1 / -1;
  display:grid;
  gap:12px;
  margin-top:10px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.08);
}
.song-card-media-panel[hidden]{display:none!important;}
.edit-video-action,.video-download{display:inline-flex;align-items:center;gap:8px;text-decoration:none;}
.video-actions .edit-video-action,
.video-actions .video-download,
.video-actions .platform-publish{
  justify-content:flex-start;
  text-align:left;
}

/* Emphasized media disclosure on song cards */
.song-card-quick-actions .show-videos-action{
  min-height:42px;
  padding:10px 16px;
  border-color:rgba(216,168,78,.62)!important;
  background:linear-gradient(135deg,rgba(216,168,78,.95),rgba(176,126,40,.92))!important;
  color:#101010!important;
  box-shadow:0 10px 24px rgba(216,168,78,.18), inset 0 1px 0 rgba(255,255,255,.22);
  order:-1;
}
.song-card-quick-actions .show-videos-action svg{width:17px;height:17px;stroke-width:2.5;}
.song-card-quick-actions .show-videos-action.is-open{
  background:rgba(216,168,78,.16)!important;
  color:var(--accent)!important;
  box-shadow:inset 0 0 0 1px rgba(216,168,78,.2);
}

/* Compact project header: prompt lives behind Edit prompt */
.project-title-line{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.project-title-line h2{margin:5px 0;}
.edit-prompt-action,
.create-song-action{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:8px 11px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
}
.edit-prompt-action svg,
.create-song-action svg{width:15px;height:15px;}
/* n 1134 - Desactive pendant une production : le motif est dans l'info-bulle. */
.create-song-action:disabled{opacity:.5;cursor:not-allowed;}
.delete-project-action{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:8px 11px;
  border-radius:999px;
  border-color:rgba(255,118,118,.48);
  color:#ffd0d0;
  font-size:12px;
  font-weight:800;
}
.delete-project-action:hover{
  border-color:rgba(255,118,118,.78);
  background:rgba(255,92,92,.12);
}
.delete-project-action svg{width:15px;height:15px;}
.prompt-dialog .prompt-edit{
  width:100%;
  min-height:260px;
  resize:vertical;
  line-height:1.55;
}
.prompt-dialog-copy{color:var(--muted);margin:0 0 12px;line-height:1.5;}
.lyrics-dialog{width:min(760px,calc(100vw - 28px))!important}
.lyrics-card{text-align:left}
.lyrics-card h2,.lyrics-card .eyebrow,.lyrics-card .lyrics-version{text-align:center}
.lyrics-text,.lyrics-edit{width:100%;max-height:360px;overflow:auto;white-space:pre-wrap;line-height:1.62;border:1px solid var(--line);border-radius:14px;background:#16181d;color:var(--ink);padding:14px}
.lyrics-edit{resize:vertical;min-height:240px}
.lyrics-music-options{margin-top:16px;padding:14px;border:1px solid rgba(216,168,78,.20);border-radius:16px;background:rgba(216,168,78,.045)}
.lyrics-music-options h3{margin:0 0 10px;font:800 14px Manrope;color:var(--ink)}
.lyrics-music-options .profile-field{margin:12px 0}
.lyrics-music-options input,.lyrics-music-options select{width:100%;margin-top:7px}
.regen-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:14px 0}
.regen-choice-grid fieldset{margin:0;padding:12px;border:1px solid rgba(255,255,255,.09);border-radius:16px;background:linear-gradient(180deg,#15171c,#101116)}
.regen-choice-grid legend{padding:0 5px;color:#d8a84e;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.regen-choice-grid fieldset{display:grid;gap:8px}
.regen-choice-grid label{position:relative;display:flex;align-items:center;gap:9px;min-height:38px;margin:0;padding:9px 10px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:#17191f;color:#c9cdd5;font-size:12px;font-weight:800;line-height:1.25}
.regen-choice-grid label:hover{border-color:rgba(216,168,78,.35);background:#1c1a16;color:#fff}
.regen-choice-grid input{appearance:none;width:16px;height:16px;flex:0 0 16px;margin:0;border:1px solid rgba(255,255,255,.26);border-radius:50%;background:#090a0c}
.regen-choice-grid input:checked{border-color:#d8a84e;background:radial-gradient(circle,#d8a84e 0 42%,transparent 46%)}
.regen-choice-grid label:has(input:checked){border-color:rgba(216,168,78,.58);background:rgba(216,168,78,.11);color:#fff;box-shadow:0 0 0 1px rgba(216,168,78,.10) inset}
.regen-voice-section{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"label label" "select actions" "note note";gap:7px 10px;align-items:center;margin:14px 0;padding:12px;border:1px solid rgba(216,168,78,.20);border-radius:16px;background:rgba(216,168,78,.06)}
.regen-voice-select{min-width:0;display:contents}
.regen-voice-select span{grid-area:label}
.regen-voice-select select{width:100%;min-height:40px;border:1px solid rgba(255,255,255,.10);background:#17191f;color:var(--ink);border-radius:10px;padding:9px 10px;font-weight:800}
.regen-voice-select select{grid-area:select}
.regen-voice-note{grid-area:note;margin:0;color:#d7ad61;font-size:12px;font-weight:700;line-height:1.35;overflow-wrap:anywhere}
.regen-voice-actions{grid-area:actions;display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.regen-voice-actions .secondary{display:inline-flex;align-items:center;gap:7px;min-height:40px;border-radius:999px;white-space:nowrap}
.regen-voice-actions svg{width:16px;height:16px}
.remix-voice-dialog .voice-dialog-copy{margin:0;color:var(--muted);line-height:1.45}
.remix-voice-dialog .regen-actions{margin-top:4px}
.lyrics-vocal-preset,.lyrics-vocal-direction{display:grid!important;grid-template-columns:minmax(120px,.34fr) minmax(0,1fr);align-items:center;gap:12px}
.lyrics-vocal-preset select,.lyrics-vocal-direction input{margin-top:0!important}
.lyrics-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px}
.lyrics-actions .primary,.lyrics-actions .secondary{justify-content:center}
@media(max-width:700px){.lyrics-card{padding:22px 16px}.regen-choice-grid{grid-template-columns:1fr}.regen-voice-section{grid-template-columns:1fr;grid-template-areas:"label" "select" "actions"}.regen-voice-actions{justify-content:stretch}.regen-voice-actions .secondary{flex:1 1 140px}.lyrics-vocal-preset,.lyrics-vocal-direction{grid-template-columns:1fr;gap:7px}.lyrics-actions{display:grid;grid-template-columns:1fr}.lyrics-text,.lyrics-edit{max-height:300px}}

/* Production session feedback bar */
.production-session-stack{
  position:fixed;
  z-index:1300;
  top:auto;
  bottom:22px;
  left:auto;
  right:max(22px,calc(50vw - 860px + 22px));
  width:min(1280px,calc(100vw - var(--app-sidebar-width,220px) - 44px));
  display:grid;
  gap:10px;
  pointer-events:none;
  cursor:grab;
  touch-action:none;
}
.production-session-stack.is-dragging{cursor:grabbing;user-select:none;}
.production-session-stack button{cursor:pointer;}
.production-session-stack.is-compact{
  width:min(520px,calc(100vw - var(--app-sidebar-width,220px) - 44px));
}
body:has(#sakira-player:not([hidden])) .production-session-stack{
  bottom:126px;
}
body:has(.production-session-stack) .main{
  padding-bottom:160px!important;
}
body:has(#sakira-player:not([hidden])):has(.production-session-stack) .main{
  padding-bottom:300px!important;
}
.production-session-bar{
  position:fixed;
  z-index:1300;
  top:18px;
  left:max(calc(var(--app-sidebar-width,220px) + 22px),calc(50vw - 640px + 22px));
  right:max(22px,calc(50vw - 860px + 22px));
  min-height:66px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  padding:12px 14px;
  border:1px solid rgba(216,168,78,.30);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(24,20,12,.96),rgba(12,13,16,.96));
  box-shadow:0 22px 70px rgba(0,0,0,.52),0 0 0 1px rgba(255,255,255,.04) inset;
  backdrop-filter:blur(16px);
  touch-action:none;
  cursor:grab;
}
.production-session-stack .production-session-bar{
  position:relative;
  z-index:auto;
  top:auto;
  left:auto;
  right:auto;
  width:100%;
  pointer-events:auto;
}
.production-session-stack.is-compact .production-session-bar{
  min-height:54px;
  grid-template-columns:30px minmax(0,1fr) auto;
  gap:10px;
  padding:9px 11px;
  border-radius:16px;
}
.production-session-stack.is-compact .production-session-signal{
  width:28px;
  height:28px;
}
.production-session-stack.is-compact .production-session-copy>span,
.production-session-stack.is-compact .production-session-meta{
  display:none;
}
.production-session-stack.is-compact .production-session-progress-wrap{
  margin-top:6px;
}
.production-session-stack.is-compact .production-session-actions{
  gap:6px;
}
.production-session-stack.is-compact .production-session-actions button{
  min-height:30px;
  padding:6px 9px;
}
.production-session-actions .resize-progress{
  width:34px;
  padding:0;
  justify-content:center;
}
.production-session-actions .resize-progress svg{
  width:15px;
  height:15px;
}

.production-session-peek{
  justify-self:end;
  pointer-events:auto;
  touch-action:none;
  cursor:grab;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  max-width:min(280px,calc(100vw - 28px));
  padding:9px 12px;
  border:1px solid rgba(216,168,78,.42);
  border-radius:999px;
  background:linear-gradient(135deg,rgba(24,20,12,.96),rgba(12,13,16,.96));
  color:#ffd98a;
  box-shadow:0 16px 46px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.04) inset;
  backdrop-filter:blur(14px);
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}
.production-session-peek:active{cursor:grabbing;}
.production-session-peek:hover{border-color:rgba(255,217,138,.72);transform:translateY(-1px);}
.production-session-peek-dot{
  width:13px;
  height:13px;
  border-radius:999px;
  background:#ffd98a;
  box-shadow:0 0 0 6px rgba(216,168,78,.12),0 0 18px rgba(216,168,78,.44);
  flex:0 0 auto;
}
.production-session-peek.failed{border-color:rgba(255,120,105,.46);color:#ffb1a8;}
.production-session-peek.failed .production-session-peek-dot{background:#ffb1a8;box-shadow:0 0 0 6px rgba(255,120,105,.12),0 0 18px rgba(255,120,105,.38);}
.production-session-peek.done{border-color:rgba(89,189,131,.42);color:#9ee2b5;}
.production-session-peek.done .production-session-peek-dot{background:#9ee2b5;box-shadow:0 0 0 6px rgba(89,189,131,.12),0 0 18px rgba(89,189,131,.34);}
.production-session-peek svg{width:15px;height:15px;flex:0 0 auto;}
.production-session-peek-text{overflow:hidden;text-overflow:ellipsis;}

.production-session-signal{
  position:relative;
  width:34px;
  height:34px;
  border-radius:999px;
  background:radial-gradient(circle,#ffd98a 0 26%,rgba(216,168,78,.18) 28% 62%,transparent 64%);
  box-shadow:0 0 0 0 rgba(216,168,78,.65);
  animation:productionSessionPulse 1.25s ease-out infinite;
  display:grid;
  place-items:center;
}
.production-session-drag-grip{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:#18140c;
  opacity:.72;
  transition:opacity .15s ease;
  touch-action:none;
  cursor:grab;
  z-index:2;
}
.production-session-drag-grip svg{
  width:18px;
  height:18px;
  stroke-width:2.5;
}
.production-session-bar:hover .production-session-drag-grip,
.production-session-bar.is-dragging .production-session-drag-grip,
.production-session-stack.is-dragging .production-session-drag-grip{
  opacity:1;
}
.production-session-copy{min-width:0;}
.production-session-copy strong{
  display:block;
  color:#fff;
  font:900 14px Manrope;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.production-session-copy span{
  display:block;
  margin-top:4px;
  color:#d4c5a4;
  font-size:12px;
  font-weight:750;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.production-session-meta{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:7px;
}
.production-session-meta:empty{display:none;}
.production-session-meta span{
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:22px;
  padding:3px 7px;
  border:1px solid rgba(158,226,181,.24);
  border-radius:999px;
  background:rgba(89,189,131,.08);
  color:#dbeee2;
  font-size:10px;
  font-weight:850;
  max-width:220px;
}
.production-session-meta strong{color:#9ee2b5;font-size:9px;text-transform:uppercase;letter-spacing:.06em;}
.production-session-meta em{font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.production-session-progress-wrap{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  margin-top:7px;
}
.production-session-progress{
  position:relative;
  height:4px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.10);
}
.production-session-percent{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  min-height:22px;
  padding:2px 7px;
  border:1px solid rgba(216,168,78,.34);
  border-radius:999px;
  background:rgba(216,168,78,.10);
  color:#ffd98a;
  font:900 11px/1 Manrope;
  letter-spacing:.01em;
  white-space:nowrap;
  box-shadow:0 0 18px rgba(216,168,78,.12) inset;
}
.production-session-progress i{
  display:block;
  width:0;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#d8a84e,#ffd98a);
  box-shadow:0 0 16px rgba(216,168,78,.45);
  transition:width .35s ease;
}
.production-session-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}
.production-session-actions button{
  min-height:34px;
  border-radius:999px;
  padding:7px 11px;
  font-size:11px;
  font-weight:850;
  white-space:nowrap;
}
.production-session-actions .view-progress{
  border-color:rgba(216,168,78,.48);
  color:#ffd98a;
}
.production-session-actions .stop-production{
  border-color:rgba(255,120,105,.46);
  color:#ffb1a8;
  background:rgba(255,120,105,.08);
}
.production-session-actions .stop-production:hover{
  border-color:rgba(255,120,105,.72);
  background:rgba(255,120,105,.14);
}
.production-session-bar.done{
  border-color:rgba(89,189,131,.36);
  background:linear-gradient(135deg,rgba(15,34,24,.96),rgba(12,13,16,.96));
}
.production-session-bar.done .production-session-signal{
  background:radial-gradient(circle,#9ee2b5 0 34%,rgba(89,189,131,.18) 36% 66%,transparent 68%);
  animation:none;
}
.production-session-bar.done .production-session-progress i{
  background:linear-gradient(90deg,#59bd83,#9ee2b5);
  box-shadow:0 0 16px rgba(89,189,131,.38);
}
.production-session-bar.failed{
  border-color:rgba(255,120,105,.38);
  background:linear-gradient(135deg,rgba(45,18,18,.96),rgba(12,13,16,.96));
}
.production-session-bar.failed .production-session-signal{
  background:radial-gradient(circle,#ffb1a8 0 34%,rgba(255,120,105,.18) 36% 66%,transparent 68%);
  animation:productionSessionPulseFailed 1.15s ease-out infinite;
}
.production-session-bar.failed .production-session-progress i{
  background:linear-gradient(90deg,#ff7869,#ffb1a8);
  box-shadow:0 0 16px rgba(255,120,105,.36);
}
@keyframes productionSessionPulse{
  0%{box-shadow:0 0 0 0 rgba(216,168,78,.62);transform:scale(.96)}
  70%{box-shadow:0 0 0 12px rgba(216,168,78,0);transform:scale(1.04)}
  100%{box-shadow:0 0 0 0 rgba(216,168,78,0);transform:scale(.96)}
}
@keyframes productionSessionPulseFailed{
  0%{box-shadow:0 0 0 0 rgba(255,120,105,.52)}
  70%{box-shadow:0 0 0 12px rgba(255,120,105,0)}
  100%{box-shadow:0 0 0 0 rgba(255,120,105,0)}
}
@media(max-width:900px){
  .production-session-stack{
    left:12px;
    right:12px;
    top:auto;
    bottom:88px;
    width:auto;
  }
  .production-session-stack.is-compact{
    width:auto;
  }
  body:has(#sakira-player:not([hidden])) .production-session-stack{
    bottom:250px;
  }
  body:has(.production-session-stack) .main{
    padding-bottom:210px!important;
  }
  body:has(#sakira-player:not([hidden])):has(.production-session-stack) .main{
    padding-bottom:360px!important;
  }
  .production-session-bar{
    left:12px;
    right:12px;
    top:12px;
    grid-template-columns:30px minmax(0,1fr);
    gap:10px;
    padding:11px;
    border-radius:16px;
  }
  .production-session-stack .production-session-bar{
    position:relative;
    top:auto;
    left:auto;
    right:auto;
    grid-template-columns:30px minmax(0,1fr);
  }
  .production-session-signal{width:28px;height:28px;}
  .production-session-progress-wrap{
    margin-top:8px;
    gap:8px;
  }
  .production-session-percent{
    min-width:38px;
    min-height:21px;
    padding:2px 6px;
    font-size:10px;
  }
  .production-session-actions{
    grid-column:1 / -1;
    justify-content:flex-start;
    padding-left:40px;
  }
}

/* Vertical Short preview: show the rendered MP4 so it matches the published Short. */
.song-card-video.is-short{grid-template-columns:minmax(150px,170px) minmax(0,1fr)!important;}
.song-card-video.is-short .song-card-video-preview{position:relative;width:170px;max-width:100%;justify-self:center;}
.short-preview-frame{
  position:relative;
  width:170px!important;
  max-width:100%;
  aspect-ratio:9/16;
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(216,168,78,.24);
  background:#050506;
  box-shadow:0 18px 44px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.08);
}
.short-preview-frame video,
.song-card-video.is-short .song-card-video-preview video{
  position:relative!important;
  width:100%!important;
  height:100%!important;
  opacity:1!important;
  pointer-events:auto!important;
  object-fit:cover;
  cursor:pointer;
  display:block;
}
.short-video-preview-play{display:none!important;}
.video-control-action svg{width:18px;height:18px;}
.short-preview-controls{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:5;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  align-items:center;
  gap:4px;
  padding:5px 1px 12px;
  border-radius:0 0 18px 18px;
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.58));
}
.short-preview-controls:after{
  content:"";
  position:absolute;
  left:1px;
  right:1px;
  bottom:3px;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(255,255,255,.9) 0 12%,rgba(255,255,255,.56) 12% 100%);
}
.short-preview-controls button{
  border:0;
  width:24px;
  height:24px;
  margin:auto;
  display:grid;
  place-items:center;
  border-radius:999px;
  color:#fff;
  background:transparent;
  text-shadow:0 2px 10px rgba(0,0,0,.72);
}
.short-preview-controls button:hover{background:rgba(255,255,255,.12);}
.short-preview-controls svg{width:17px;height:17px;stroke-width:2.7;filter:drop-shadow(0 2px 6px rgba(0,0,0,.7));}
.short-preview-controls button:first-child svg{fill:currentColor;stroke-width:2;}
.video.video-vertical .short-preview-controls{gap:8px;padding:7px 2px 16px;}
.video.video-vertical .short-preview-controls button{width:32px;height:32px;}
.video.video-vertical .short-preview-controls svg{width:23px;height:23px;}
.video.video-vertical .short-preview-controls:after{height:4px;}
.video.video-vertical{position:relative;}
.video.video-vertical .short-preview-frame{
  width:min(100%,220px)!important;
}
.video.video-vertical > video{
  width:min(100%,220px);
  aspect-ratio:9/16;
  max-height:390px;
  object-fit:cover;
  border-radius:18px;
  border:1px solid rgba(216,168,78,.24);
  background:#050506;
  box-shadow:0 18px 44px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.08);
  cursor:pointer;
}
.short-preview-frame.uses-disk-preview video{position:absolute!important;inset:0!important;opacity:0!important;pointer-events:none!important;}
.short-preview-frame.uses-disk-preview .vertical-disk-thumb{display:grid!important;width:100%!important;max-width:100%!important;height:100%!important;border:0!important;border-radius:18px!important;box-shadow:none!important;}
.song-card-video .short-preview-frame.uses-disk-preview .vertical-disk-thumb,
.video.video-vertical .short-preview-frame.uses-disk-preview .vertical-disk-thumb{display:grid!important;}
.vertical-disk-thumb{
  position:relative;
  isolation:isolate;
  display:grid;
  place-items:center;
  width:100%;
  max-width:140px;
  aspect-ratio:9/16;
  overflow:hidden;
  border:1px solid rgba(216,168,78,.24);
  border-radius:18px;
  background:radial-gradient(circle at 50% 32%,rgba(216,168,78,.20),rgba(6,7,10,.90) 54%,#050506 100%);
  box-shadow:0 16px 42px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.06);
  cursor:pointer;
}
.vertical-disk-thumb.large{max-width:210px;}
.vertical-disk-thumb:before{
  content:"";
  position:absolute;
  inset:-16%;
  z-index:-2;
  background:var(--disk-cover) center/cover no-repeat;
  filter:blur(18px) saturate(.92) brightness(.65);
  transform:scale(1.1);
}
.disk-glow{
  position:absolute;
  inset:16%;
  border-radius:999px;
  background:radial-gradient(circle,rgba(216,168,78,.30),transparent 68%);
  filter:blur(14px);
}
.disk-record{
  position:relative;
  width:72%;
  aspect-ratio:1;
  border-radius:999px;
  background:
    repeating-radial-gradient(circle,rgba(255,255,255,.055) 0 1px,transparent 1px 7px),
    radial-gradient(circle at 38% 30%,rgba(255,255,255,.18),transparent 18%),
    radial-gradient(circle,#101115,#030304 72%);
  box-shadow:0 18px 42px rgba(0,0,0,.54),inset 0 0 0 1px rgba(255,255,255,.08);
  animation:diskSpin 8s linear infinite;
}
.disk-cover{
  position:absolute;
  inset:28%;
  border-radius:999px;
  background:var(--disk-cover) center/cover no-repeat;
  box-shadow:0 0 0 3px rgba(216,168,78,.18),0 8px 18px rgba(0,0,0,.35);
}
.disk-hole{
  position:absolute;
  inset:46%;
  border-radius:999px;
  background:#050506;
  box-shadow:0 0 0 2px rgba(255,255,255,.18);
}
.disk-play{
  position:absolute;
  right:12px;
  bottom:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:999px;
  color:#111;
  background:linear-gradient(135deg,#ffe3a2,#d8a84e);
  box-shadow:0 8px 24px rgba(216,168,78,.38);
}
.disk-play svg{width:15px;height:15px;fill:currentColor;stroke-width:3;transform:translateX(1px);}
.vertical-video-controls{
  position:absolute;
  left:8px;
  right:8px;
  bottom:8px;
  z-index:4;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:6px;
  padding:7px;
  border-radius:14px;
  background:linear-gradient(180deg,rgba(4,5,7,.18),rgba(4,5,7,.72));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.vertical-video-controls button{
  border:0;
  min-width:0;
  width:100%;
  aspect-ratio:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  color:#fff;
  background:rgba(0,0,0,.34);
  box-shadow:0 8px 18px rgba(0,0,0,.26);
}
.vertical-video-controls button:hover{background:rgba(216,168,78,.22);color:#ffe3a2;}
.vertical-video-controls svg{width:15px;height:15px;stroke-width:2.6;}
.vertical-disk-thumb .vertical-video-controls+.disk-play,
.vertical-disk-thumb:has(.vertical-video-controls) .disk-play{display:none;}
.video-actions-attention{outline:1px solid rgba(216,168,78,.75);border-radius:14px;box-shadow:0 0 0 4px rgba(216,168,78,.12);}
.video-fullscreen-preview{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:#000;}
.video-fullscreen-preview video{width:min(100vw,56.25vh);height:min(100vh,177.78vw);max-width:100%;max-height:100%;object-fit:contain;}
.video-fullscreen-preview.is-short{padding:18px;background:#000;}
.video-fullscreen-preview.is-short video{
  width:min(100vw - 36px,56.25vh - 20px,440px);
  height:min(calc(100vh - 36px),calc((100vw - 36px) * 16 / 9),780px);
  aspect-ratio:9/16;
  max-height:calc(100vh - 36px);
  object-fit:cover;
  object-position:center center;
  border-radius:18px;
  background:#000;
  box-shadow:0 24px 80px rgba(0,0,0,.62);
}
.video-fullscreen-preview.is-landscape video{width:min(100vw,177.78vh);height:min(100vh,56.25vw);}
.vertical-disk-view{isolation:isolate;overflow:hidden;background:radial-gradient(circle at 50% 35%,rgba(216,168,78,.16),rgba(0,0,0,.92) 56%,#000 100%);}
.vertical-disk-view:before{content:"";position:absolute;inset:-8%;z-index:-1;background:var(--disk-cover) center/cover no-repeat;filter:blur(30px) saturate(.9) brightness(.46);transform:scale(1.08);}
.vertical-disk-player-shell{display:grid;place-items:center;gap:18px;width:min(92vw,390px);padding:30px 18px 22px;}
.vertical-disk-player-shell .vertical-disk-thumb.in-view{max-width:min(78vw,320px);cursor:default;border-radius:28px;box-shadow:0 26px 80px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.08);}
.vertical-disk-player-shell .vertical-video-controls{left:14px;right:14px;bottom:14px;padding:9px;gap:8px;background:linear-gradient(180deg,rgba(4,5,7,.16),rgba(4,5,7,.78));}
.vertical-disk-player-shell .vertical-video-controls svg{width:18px;height:18px;}
.vertical-disk-player-shell video{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;}
.vertical-disk-player-copy{text-align:center;display:grid;gap:5px;max-width:100%;}
.vertical-disk-player-copy strong{font:900 18px Manrope;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:90vw;}
.vertical-disk-player-copy span{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:rgba(244,241,232,.64);}
.vertical-disk-player-copy small{font-size:12px;font-weight:800;letter-spacing:.04em;color:rgba(244,241,232,.82);}
.vertical-disk-thumb.in-view .disk-record{animation-play-state:paused;}
.vertical-disk-view.is-playing .vertical-disk-thumb.in-view .disk-record{animation-play-state:running;}
.video-fullscreen-close{position:fixed;top:18px;right:18px;z-index:1;width:42px;height:42px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.58);color:#fff;font-size:26px;line-height:1;}
.video.video-vertical{display:grid;justify-items:center;gap:10px;}
.video.video-vertical .vertical-disk-thumb{margin-bottom:2px;}
.song-card-video-panel>.song-card-panel-head,
.song-card-video-panel>.song-card-youtube-publish{grid-column:1 / -1;}
.song-card-video-panel>.song-card-video.is-short{grid-column:1;}
.song-card-video-panel>.song-card-video.is-landscape{grid-column:2;}
@keyframes diskSpin{to{transform:rotate(360deg)}}
@media(max-width:720px){
  .song-card-video-panel>.song-card-video.is-short,
  .song-card-video-panel>.song-card-video.is-landscape{grid-column:1;}
  .song-card-video.is-short{grid-template-columns:1fr!important;}
  .song-card-video.is-short .song-card-video-preview{max-width:150px;}
}

/* Short video fill guard — keep previous native playback, but make the visible portrait thumbnail/player fill its frame. */
.short-preview-frame video,
.song-card-video.is-short .song-card-video-preview video,
.video.video-vertical .short-preview-frame video{
  width:100%!important;
  height:100%!important;
  min-width:100%!important;
  min-height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
  background:#000!important;
}
.song-card-video.is-short .short-preview-frame.uses-disk-preview video,
.video.video-vertical .short-preview-frame.uses-disk-preview video{
  position:absolute!important;
  inset:0!important;
  opacity:0!important;
  pointer-events:none!important;
}
.song-card-video.is-short .short-preview-frame.uses-disk-preview .vertical-disk-thumb,
.video.video-vertical .short-preview-frame.uses-disk-preview .vertical-disk-thumb{
  display:grid!important;
  width:100%!important;
  max-width:100%!important;
  height:100%!important;
}
.video-fullscreen-preview.is-short{
  align-items:center!important;
  justify-items:center!important;
}
.video-fullscreen-preview.is-short video{
  object-fit:cover!important;
  object-position:center center!important;
}

/* Short fullscreen fill: use the full available viewport instead of a capped portrait card. */
.video-fullscreen-preview.is-short{
  padding:0!important;
  background:#000!important;
  overflow:hidden!important;
}
.video-fullscreen-preview.is-short video{
  width:min(100vw,56.25vh)!important;
  height:100vh!important;
  max-width:none!important;
  max-height:none!important;
  aspect-ratio:9/16!important;
  object-fit:cover!important;
  object-position:center center!important;
  border-radius:0!important;
  box-shadow:none!important;
}
@supports(height:100dvh){
  .video-fullscreen-preview.is-short video{height:100dvh!important;width:min(100vw,56.25dvh)!important;}
}
@media(max-aspect-ratio:9/16){
  .video-fullscreen-preview.is-short video{
    width:100vw!important;
    height:177.78vw!important;
  }
}

/* Short fullscreen true cover: fill the whole overlay, cropping if needed so no black sides remain. */
.video-fullscreen-preview.is-short{
  padding:0!important;
  background:#000!important;
  overflow:hidden!important;
  place-items:stretch!important;
}
.video-fullscreen-preview.is-short video{
  width:100vw!important;
  height:100vh!important;
  min-width:100vw!important;
  min-height:100vh!important;
  max-width:none!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  object-fit:cover!important;
  object-position:center center!important;
  border-radius:0!important;
  box-shadow:none!important;
}
@supports(height:100dvh){
  .video-fullscreen-preview.is-short video{
    width:100dvw!important;
    height:100dvh!important;
    min-width:100dvw!important;
    min-height:100dvh!important;
  }
}

/* Short fullscreen as Short: preserve the whole 9:16 video/card instead of cropping it to desktop cover. */
.video-fullscreen-preview.is-short{
  padding:18px!important;
  background:#000!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}
.video-fullscreen-preview.is-short video{
  width:min(calc(100vw - 36px),calc((100vh - 36px) * 9 / 16),440px)!important;
  height:min(calc(100vh - 36px),calc((100vw - 36px) * 16 / 9),780px)!important;
  min-width:0!important;
  min-height:0!important;
  max-width:calc(100vw - 36px)!important;
  max-height:calc(100vh - 36px)!important;
  aspect-ratio:9/16!important;
  object-fit:contain!important;
  object-position:center center!important;
  border-radius:18px!important;
  box-shadow:0 24px 80px rgba(0,0,0,.62)!important;
}
@supports(height:100dvh){
  .video-fullscreen-preview.is-short video{
    width:min(calc(100dvw - 36px),calc((100dvh - 36px) * 9 / 16),440px)!important;
    height:min(calc(100dvh - 36px),calc((100dvw - 36px) * 16 / 9),780px)!important;
    max-width:calc(100dvw - 36px)!important;
    max-height:calc(100dvh - 36px)!important;
  }
}
.video-fullscreen-preview.is-short .fullscreen-disk-overlay{
  position:absolute!important;
  top:calc(50% - min(calc(100vh - 36px),calc((100vw - 36px) * 16 / 9),780px) / 2 + min(calc(100vh - 36px),calc((100vw - 36px) * 16 / 9),780px) * .10);
  left:50%;
  transform:translateX(-50%);
  z-index:3;
  width:min(calc((100vw - 36px) * .46),calc((100vh - 36px) * 9 / 16 * .46),202px)!important;
  max-width:none!important;
  aspect-ratio:1!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
  box-shadow:none!important;
  pointer-events:none!important;
  overflow:visible!important;
}
.video-fullscreen-preview.is-short .fullscreen-disk-overlay:before,
.video-fullscreen-preview.is-short .fullscreen-disk-overlay .disk-glow{display:none!important;}
.video-fullscreen-preview.is-short .fullscreen-disk-overlay .disk-record{width:100%!important;}
.video-fullscreen-preview.is-short .fullscreen-disk-overlay:not(.is-playing) .disk-record{animation-play-state:paused;}
.video-fullscreen-preview.is-short .fullscreen-lyric-overlay{
  position:absolute;
  z-index:4;
  left:50%;
  top:calc(50% - min(calc(100vh - 36px),calc((100vw - 36px) * 16 / 9),780px) / 2 + min(calc(100vh - 36px),calc((100vw - 36px) * 16 / 9),780px) * .50);
  width:min(calc(100vw - 78px),calc((100vh - 36px) * 9 / 16 - 42px),398px);
  transform:translateX(-50%);
  color:#fff;
  font:700 clamp(17px,2.2vh,25px) Inter,"Sakira JP",sans-serif;
  line-height:1.18;
  text-align:center;
  white-space:pre-line;
  text-shadow:0 2px 2px #000,0 0 8px rgba(0,0,0,.86);
  pointer-events:none;
}
.video-fullscreen-preview.is-short .fullscreen-promo-overlay{
  position:absolute;
  z-index:4;
  left:50%;
  bottom:calc(50% - min(calc(100vh - 36px),calc((100vw - 36px) * 16 / 9),780px) / 2 + min(calc(100vh - 36px),calc((100vw - 36px) * 16 / 9),780px) * .12);
  width:min(calc(100vw - 78px),calc((100vh - 36px) * 9 / 16 - 42px),398px);
  transform:translateX(-50%);
  color:#fff;
  font:700 clamp(15px,1.8vh,22px) Inter,"Sakira JP",sans-serif;
  line-height:1.15;
  text-align:center;
  text-shadow:0 2px 2px #000,0 0 8px rgba(0,0,0,.86);
  pointer-events:none;
}
@supports(height:100dvh){
  .video-fullscreen-preview.is-short .fullscreen-disk-overlay{
    top:calc(50% - min(calc(100dvh - 36px),calc((100dvw - 36px) * 16 / 9),780px) / 2 + min(calc(100dvh - 36px),calc((100dvw - 36px) * 16 / 9),780px) * .10);
    width:min(calc((100dvw - 36px) * .46),calc((100dvh - 36px) * 9 / 16 * .46),202px)!important;
  }
  .video-fullscreen-preview.is-short .fullscreen-lyric-overlay{
    top:calc(50% - min(calc(100dvh - 36px),calc((100dvw - 36px) * 16 / 9),780px) / 2 + min(calc(100dvh - 36px),calc((100dvw - 36px) * 16 / 9),780px) * .50);
    width:min(calc(100dvw - 78px),calc((100dvh - 36px) * 9 / 16 - 42px),398px);
  }
  .video-fullscreen-preview.is-short .fullscreen-promo-overlay{
    bottom:calc(50% - min(calc(100dvh - 36px),calc((100dvw - 36px) * 16 / 9),780px) / 2 + min(calc(100dvh - 36px),calc((100dvw - 36px) * 16 / 9),780px) * .12);
    width:min(calc(100dvw - 78px),calc((100dvh - 36px) * 9 / 16 - 42px),398px);
  }
}

/* Simple user connection flow */
.connection-list{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important}
.connection-intro{grid-column:1/-1;border:1px solid rgba(216,168,78,.34);background:#171614;border-radius:10px;padding:16px 18px;display:grid;gap:6px}
.connection-intro strong{font:700 18px Manrope;color:var(--ink)}
.connection-intro span{color:var(--muted);line-height:1.45}
.connection{border-radius:10px!important;box-shadow:0 16px 44px rgba(0,0,0,.28)!important;display:flex;flex-direction:column;gap:12px;min-height:230px}
.connection.connected{border-color:rgba(89,189,131,.5)!important}
.connection.not-connected{border-color:rgba(216,168,78,.38)!important}
.connection-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.connection h3{margin:0!important;font:700 19px Manrope!important;text-transform:none!important}
.connection p{color:var(--ink)!important;margin:0!important;line-height:1.45}
.connection small{color:var(--muted);line-height:1.35}
.connection-badge{border:1px solid var(--line);border-radius:999px;padding:5px 9px;color:var(--muted);font-size:11px;font-weight:800;white-space:nowrap}
.connection.connected .connection-badge{border-color:rgba(89,189,131,.45);color:var(--green);background:rgba(89,189,131,.1)}
.connection.not-connected .connection-badge{border-color:rgba(216,168,78,.45);color:var(--accent);background:rgba(216,168,78,.1)}
.connection button{margin-top:auto;justify-content:center}
.connection-actions{display:flex;flex-direction:column;gap:8px;margin-top:auto}
.connection-actions button{width:100%;min-height:42px}
.connection-primary{width:100%;min-height:46px}
.platform-option.needs-connection{cursor:pointer;border-color:rgba(216,168,78,.32);background:#151412}
.platform-option.needs-connection small{color:var(--accent)}

/* Account connection cards: keep the normal user flow simple. */
.connection-list{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))!important}
.connection{min-height:190px!important}
.connection-intro{display:none!important}
.connection p{font-size:15px!important}
.connection small:empty{display:none}

/* Lyrics panel copy action */




/* Video cards: anchor previews and actions to the left edge. */
.song-card-video,
.song-card-video.is-short,
.song-card-video.is-landscape{
  justify-content:start!important;
}
.song-card-video-preview{
  justify-content:flex-start!important;
  justify-self:start!important;
}
.song-card-video.is-short .song-card-video-preview{
  justify-self:start!important;
}
.song-card-video-info{
  align-items:flex-start!important;
  text-align:left!important;
}
.song-card-video-actions{
  justify-content:flex-start!important;
  align-items:flex-start!important;
}
.song-card-video-actions .song-quick-action{
  justify-content:flex-start!important;
}
@media(max-width:720px){
  .song-card-video.is-short .song-card-video-preview,
  .song-card-video.is-landscape .song-card-video-preview{
    justify-self:start!important;
  }
}

/* Animated processing dots for Image only status */
.song-card-video-option-status[data-state="working"]{
  display:flex;
  align-items:baseline;
  gap:6px;
}
.song-card-video-option-status[data-tooltip]{
  position:relative;
  cursor:help;
  text-decoration:underline dotted rgba(254,202,202,.55);
  text-underline-offset:3px;
  width:max-content;
  max-width:100%;
}
.song-card-video-option-status[data-tooltip]:hover::after,
.song-card-video-option-status[data-tooltip]:focus::after{
  content:attr(data-tooltip);
  position:absolute;
  left:0;
  bottom:calc(100% + 8px);
  z-index:30;
  width:min(360px,70vw);
  padding:10px 12px;
  border:1px solid rgba(216,168,78,.34);
  border-radius:7px;
  background:#111318;
  color:#f4f1e8;
  box-shadow:0 18px 44px rgba(0,0,0,.45);
  font-size:12px;
  line-height:1.45;
  white-space:normal;
}
.processing-dots{
  display:inline-flex;
  align-items:center;
  gap:3px;
  min-width:22px;
  transform:translateY(-1px);
}
.processing-dots i{
  width:4px;
  height:4px;
  border-radius:999px;
  background:currentColor;
  opacity:.35;
  animation:processing-dot-bounce 1.05s infinite ease-in-out;
}
.processing-dots i:nth-child(2){animation-delay:.16s;}
.processing-dots i:nth-child(3){animation-delay:.32s;}
@keyframes processing-dot-bounce{
  0%,80%,100%{opacity:.28;transform:translateY(0) scale(.82);}
  40%{opacity:1;transform:translateY(-4px) scale(1.08);}
}

/* Official-style Sign in with Apple button */
.apple-login{
  width:100%;
  min-height:46px;
  position:relative;
  justify-content:center;
  gap:10px;
  padding:10px 16px;
  background:#000!important;
  color:#fff!important;
  border:1px solid #000!important;
  border-radius:4px!important;
  font-size:17px!important;
  font-weight:700!important;
  box-shadow:0 1px 2px rgba(0,0,0,.24);
}
.apple-login:hover{background:#111!important;border-color:#111!important;}
.apple-mark{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  width:26px;
  height:26px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#fff;
}
.apple-mark svg{width:26px;height:26px;display:block;}

/* Login password visibility toggle */
.password-field-label{display:block}.password-input-wrap{position:relative;display:block}.password-input-wrap input{width:100%;padding-right:56px!important}.password-visibility-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:38px;height:34px;border:1px solid rgba(216,168,78,.34);border-radius:999px;background:rgba(216,168,78,.10);color:#f3d89a;display:inline-flex;align-items:center;justify-content:center;padding:0}.password-visibility-toggle svg{width:18px;height:18px;display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.password-visibility-toggle:hover,.password-visibility-toggle:focus-visible{background:rgba(216,168,78,.18);border-color:rgba(216,168,78,.62);color:#fff;outline:none;box-shadow:0 0 0 3px rgba(216,168,78,.14)}

/* Login remember-browser control */
.login-form .remember-browser-row{width:100%;display:flex!important;align-items:center;gap:12px;margin:2px 0 4px;padding:12px 14px;border:1px solid rgba(216,168,78,.28);border-radius:16px;background:linear-gradient(135deg,rgba(216,168,78,.12),rgba(17,19,24,.72));box-shadow:inset 0 1px 0 rgba(255,255,255,.04);color:var(--ink);cursor:pointer;text-align:left;line-height:1.25}.login-form .remember-browser-row:hover{border-color:rgba(216,168,78,.48);background:linear-gradient(135deg,rgba(216,168,78,.17),rgba(17,19,24,.78))}.login-form .remember-browser-row input[type="checkbox"]{flex:0 0 auto;width:18px!important;height:18px!important;margin:0!important;accent-color:var(--accent);cursor:pointer}.remember-browser-copy{display:flex;min-width:0;flex-direction:column;gap:2px}.remember-browser-title{font:800 13px/1.2 Manrope,Inter,"Sakira JP",sans-serif;color:#fff2d1}.remember-browser-helper{font:600 11px/1.35 Inter,"Sakira JP",sans-serif;color:var(--muted)}

/* Short preview fullscreen: keep the same contained 9:16 card framing as the in-page preview. */
.video-fullscreen-preview.is-short{
  padding:clamp(18px,4vh,42px)!important;
  display:grid!important;
  place-items:center!important;
  align-content:center!important;
  background:#000!important;
  overflow:hidden!important;
}
.video-fullscreen-preview.is-short video{
  position:relative!important;
  inset:auto!important;
  width:min(84vw,calc((100dvh - 84px) * 9 / 16),390px)!important;
  height:auto!important;
  max-width:84vw!important;
  max-height:calc(100dvh - 84px)!important;
  aspect-ratio:9/16!important;
  object-fit:contain!important;
  border-radius:18px!important;
  background:#08090b!important;
  box-shadow:0 24px 80px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.08)!important;
}
.video-fullscreen-preview.is-short .fullscreen-disk-overlay{
  width:min(52vw,230px)!important;
  max-width:58%!important;
  left:50%!important;
  top:30%!important;
  transform:translate(-50%,-50%)!important;
}
.video-fullscreen-preview.is-short .fullscreen-lyric-overlay,
.video-fullscreen-preview.is-short .fullscreen-promo-overlay{
  display:none!important;
}
@media(max-width:600px){
  .video-fullscreen-preview.is-short{padding:14px!important;}
  .video-fullscreen-preview.is-short video{
    width:min(92vw,calc((100dvh - 56px) * 9 / 16))!important;
    max-width:92vw!important;
    max-height:calc(100dvh - 56px)!important;
  }
}

/* TikTok/Facebook coming-soon publish states */
.platform-publish.coming-soon-action,
.song-card-publish-action.coming-soon-action,
.connection .coming-soon-action{
  opacity:.68!important;
  cursor:not-allowed!important;
  border-color:rgba(255,255,255,.12)!important;
  background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.025))!important;
  color:rgba(255,255,255,.72)!important;
  box-shadow:none!important;
}
.coming-soon-action .platform-symbol{filter:grayscale(.25);opacity:.8;}
.song-card-youtube-publish .schedule-youtube-action{
  margin-left:auto!important;
  justify-self:flex-end!important;
}
@media(max-width:760px){
  .song-card-youtube-publish .schedule-youtube-action{
    margin-left:0!important;
    width:100%;
  }
}

/* Sakira theme setting: Noir is the default; Gold is a warm editorial variant. */
:root[data-theme="gold"]{
  --bg:#efe5d3;
  --panel:#fff8eb;
  --ink:#1a1309;
  --muted:#776d61;
  --line:#d5c4a6;
  --accent:#bf842b;
  --green:#2f7b55;
  --shadow:0 18px 46px rgba(63,42,12,.16);
}
:root[data-theme="gold"] body,
:root[data-theme="gold"] #app,
:root[data-theme="gold"] .shell,
:root[data-theme="gold"] .main{
  background:
    radial-gradient(circle at 18% 10%,rgba(191,132,43,.12),transparent 26%),
    linear-gradient(180deg,#f4ecdf,#eadcc6)!important;
  color:var(--ink)!important;
}
:root[data-theme="gold"] .sidebar{
  background:linear-gradient(180deg,#140f0a,#24180d)!important;
  color:#f7ead2!important;
  box-shadow:12px 0 40px rgba(63,42,12,.18)!important;
}
:root[data-theme="gold"] .nav{
  color:#d7c8ad!important;
}
:root[data-theme="gold"] .nav:hover,
:root[data-theme="gold"] .nav.active{
  background:rgba(191,132,43,.18)!important;
  color:#fff6e8!important;
}
:root[data-theme="gold"] #view-projects .project-filter-bar,
:root[data-theme="gold"] #view-create .project-filter-bar{
  background:linear-gradient(135deg,#fff6e4,#ead9bd)!important;
  border-color:#d5bc8e!important;
  box-shadow:0 14px 32px rgba(92,62,18,.18)!important;
}
:root[data-theme="gold"] #view-projects .project-table-header,
:root[data-theme="gold"] #view-create .project-table-header{
  background:linear-gradient(180deg,#3b2914,#24180d)!important;
  color:#d7c39a!important;
  border-color:rgba(191,132,43,.28)!important;
  box-shadow:0 10px 24px rgba(63,42,12,.22)!important;
}
:root[data-theme="gold"] .project-filter-bar .filter-title{
  color:#3a260f!important;
}
:root[data-theme="gold"] .project-filter-bar label,
:root[data-theme="gold"] .project-table-header span{
  color:#7b6a52!important;
}
:root[data-theme="gold"] .project-filter-bar select{
  background:#fffaf1!important;
  color:#1a1309!important;
  border-color:#d6bf91!important;
}
:root[data-theme="gold"] .composer,
:root[data-theme="gold"] .section,
:root[data-theme="gold"] .project-row,
:root[data-theme="gold"] .workflow-inline-player,
:root[data-theme="gold"] .song-summary-strip,
:root[data-theme="gold"] .connection,
:root[data-theme="gold"] .playlist-row,
:root[data-theme="gold"] .profile-dialog,
:root[data-theme="gold"] .account-menu,
:root[data-theme="gold"] .credit-dialog,
:root[data-theme="gold"] .song-card-media-panel,
:root[data-theme="gold"] .production-session-bar{
  background:linear-gradient(135deg,#fff8eb,#f4e6cf)!important;
  border-color:#d8c299!important;
  color:var(--ink)!important;
  box-shadow:var(--shadow)!important;
}
:root[data-theme="gold"] .project-row:hover{
  border-color:#b8842f!important;
  background:linear-gradient(135deg,#fffaf2,#efd9b6)!important;
}
:root[data-theme="gold"] input,
:root[data-theme="gold"] textarea,
:root[data-theme="gold"] select,
:root[data-theme="gold"] .language-switch,
:root[data-theme="gold"] .theme-switch,
:root[data-theme="gold"] .profile-meta,
:root[data-theme="gold"] .cost,
:root[data-theme="gold"] .secondary,
:root[data-theme="gold"] .icon{
  background:#fffaf1!important;
  color:var(--ink)!important;
  border-color:#d8c299!important;
}
:root[data-theme="gold"] .theme-switch button.active,
:root[data-theme="gold"] .language-switch button.active,
:root[data-theme="gold"] .theme-switch button:hover,
:root[data-theme="gold"] .language-switch button:hover{
  background:#bf842b!important;
  color:#140f0a!important;
}
:root[data-theme="gold"] .account-trigger{
  background:#26190c!important;
  border-color:#6f4d1e!important;
}
:root[data-theme="gold"] .account-trigger span{
  color:#d9c29a!important;
}
:root[data-theme="gold"] .account-trigger strong{
  color:#fff4dc!important;
}
:root[data-theme="gold"] .account-trigger svg{
  color:#d9c29a!important;
}
:root[data-theme="gold"] .sidebar-legal,
:root[data-theme="gold"] .sidebar-legal a,
:root[data-theme="gold"] .sidebar-legal span{
  color:#bca77f!important;
}
:root[data-theme="gold"] .sidebar-legal a:hover{
  color:#f2c872!important;
}
:root[data-theme="gold"] .account-menu button:hover,
:root[data-theme="gold"] .account-menu-language:hover,
:root[data-theme="gold"] .account-menu-theme:hover{
  background:#edd9b7!important;
}
:root[data-theme="gold"] .project-platform-status.not-yet{
  background:#322517!important;
  color:#d7c39a!important;
  border-color:rgba(58,38,15,.18)!important;
}
:root[data-theme="gold"] .project-platform-status.published,
:root[data-theme="gold"] .status.published{
  background:#d8f1df!important;
  color:#1d6842!important;
}
:root[data-theme="gold"] .project-platform-status.scheduled{
  background:#ffe9b8!important;
  color:#8a5c12!important;
}
:root[data-theme="gold"] .status,
:root[data-theme="gold"] .project-row .status{
  background:#f0d8aa!important;
  color:#2b1b0b!important;
  border:1px solid #c79b57!important;
}
:root[data-theme="gold"] .status.published,
:root[data-theme="gold"] .project-row .status.published{
  background:#d8f1df!important;
  color:#145b38!important;
  border-color:#8dca9f!important;
}
:root[data-theme="gold"] .status.failed,
:root[data-theme="gold"] .project-row .status.failed{
  background:#f3c8bd!important;
  color:#7a1f14!important;
  border-color:#d88978!important;
}
:root[data-theme="gold"] .published-date,
:root[data-theme="gold"] .project-row time,
:root[data-theme="gold"] .project-row .row-cost{
  color:#6f5632!important;
}
:root[data-theme="gold"] .published-date.scheduled,
:root[data-theme="gold"] .project-row .published-date.scheduled{
  color:#8a5c12!important;
}
:root[data-theme="gold"] .published-date.scheduled small,
:root[data-theme="gold"] .project-row .published-date.scheduled small{
  color:#6f5632!important;
}
:root[data-theme="gold"] .sakira-player{
  background:rgba(255,248,235,.98)!important;
  border-color:#d8c299!important;
  color:var(--ink)!important;
  box-shadow:0 18px 58px rgba(63,42,12,.24)!important;
}
:root[data-theme="gold"] .about-dialog,
:root[data-theme="gold"] .about-page{
  background:#140f0a!important;
}
:root[data-theme="gold"] .about-story,
:root[data-theme="gold"] .about-values,
:root[data-theme="gold"] .about-workflow article,
:root[data-theme="gold"] .about-feature-band,
:root[data-theme="gold"] .about-value-grid article{
  background:#1b1209!important;
  color:#f7ead2!important;
}
:root[data-theme="gold"] .about-hero h2,
:root[data-theme="gold"] .about-story h3,
:root[data-theme="gold"] .about-feature-copy h3,
:root[data-theme="gold"] .about-values h3,
:root[data-theme="gold"] .playlist-meta strong{
  color:var(--ink)!important;
}
:root[data-theme="gold"] .about-dialog .about-hero h2,
:root[data-theme="gold"] .about-dialog .about-story h3,
:root[data-theme="gold"] .about-dialog .about-feature-copy h3,
:root[data-theme="gold"] .about-dialog .about-values h3{
  color:#fff4dc!important;
}

/* 20260731 larger artwork review + preview actions */
.thumbnail-section .section-head{
  align-items:flex-start;
  gap:18px;
}
.thumbnail-section .section-head p{
  max-width:680px;
  color:#c7b894;
  font-size:13px;
}
.thumbnail-section .artwork-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}
.thumbnail-section .artwork-actions .secondary{
  min-height:42px;
  padding:10px 14px;
  border-color:rgba(216,168,78,.32);
  background:rgba(216,168,78,.09);
  color:#f6e6bd;
  font-weight:900;
}
.thumbnail-section .artwork-gallery{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,240px));
  gap:18px;
  align-items:start;
  margin-top:16px;
}
.thumbnail-section .artwork-version,
.thumbnail-section .artwork-upload-tile{
  min-height:150px;
  border-radius:18px;
  border:1px solid rgba(216,168,78,.24);
  background:linear-gradient(145deg,rgba(216,168,78,.08),rgba(7,8,11,.84));
  box-shadow:0 18px 42px rgba(0,0,0,.28);
}
.thumbnail-section .artwork-version{overflow:hidden;}
.thumbnail-section .artwork-version img{
  display:block;
  width:100%;
  aspect-ratio:16/9;
  min-height:150px;
  object-fit:cover;
  transition:transform .2s ease,filter .2s ease;
}
.thumbnail-section .artwork-version:hover img{transform:scale(1.035);filter:saturate(1.08) contrast(1.04);}
.thumbnail-section .artwork-version>div{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px;
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.9));
}
.thumbnail-section .artwork-version span{
  color:#fff;
  font:900 11px Manrope,Inter,"Sakira JP",sans-serif;
  text-transform:uppercase;
  letter-spacing:.08em;
  text-align:center;
  text-shadow:0 2px 10px rgba(0,0,0,.5);
}
.thumbnail-section .artwork-version .artwork-use{
  min-height:34px;
  padding:7px 11px;
  font-size:11px;
}
.thumbnail-section .artwork-version .artwork-preview{
  width:42px;
  min-width:42px;
  height:42px;
  min-height:42px;
  top:10px;
  left:10px;
  background:rgba(8,9,12,.88);
  border-color:rgba(246,213,139,.42);
}
.thumbnail-section .artwork-version .artwork-preview svg{width:19px;height:19px;}
.thumbnail-section .artwork-version .artwork-remove{
  width:42px;
  min-width:42px;
  height:42px;
  min-height:42px;
  top:10px;
  right:10px;
  background:#a52a24;
  border-color:rgba(255,169,155,.82);
}
.thumbnail-section .artwork-version .artwork-remove svg{width:18px;height:18px;}
.artwork-upload-tile{
  min-height:150px;
  border-width:1px;
  border-color:rgba(216,168,78,.34)!important;
  background:linear-gradient(145deg,rgba(216,168,78,.12),rgba(255,255,255,.035))!important;
}
.artwork-upload-tile:hover,
.thumbnail-section .artwork-actions .secondary:hover{
  border-color:rgba(246,213,139,.72)!important;
  background:linear-gradient(145deg,rgba(216,168,78,.22),rgba(255,255,255,.06))!important;
  transform:translateY(-1px);
}
.artwork-upload-tile svg{width:34px!important;height:34px!important;filter:drop-shadow(0 0 12px rgba(216,168,78,.25));}
.artwork-upload-tile span{font-size:12px!important;font-weight:900!important;letter-spacing:.09em!important;text-transform:uppercase;}
.song-card-artworks{
  grid-template-columns:repeat(auto-fit,minmax(148px,180px));
  gap:14px;
}
.song-card-artwork{border-radius:16px;box-shadow:0 14px 34px rgba(0,0,0,.22);}
.song-card-artwork img{min-height:96px;}
.song-card-artwork div{padding:8px;}
.song-card-artwork span{font-size:10px;letter-spacing:.06em;}
.song-card-artwork button{min-height:30px;padding:6px 9px;font-size:10.5px;}
.song-card-artwork .artwork-preview{width:38px;min-width:38px;height:38px;min-height:38px;}
.song-card-artwork .artwork-preview svg{width:17px;height:17px;}
.song-card-artwork .artwork-remove{width:36px;min-width:36px;height:36px;min-height:36px;}
.artwork-preview-dialog{
  width:min(1040px,calc(100vw - 24px));
  max-height:calc(100vh - 24px);
  padding:0;
  color:#f8f1df;
  background:radial-gradient(circle at 50% 0,rgba(216,168,78,.16),transparent 42%),#07080b;
  border:1px solid rgba(216,168,78,.28);
  box-shadow:0 28px 90px rgba(0,0,0,.72);
}
.artwork-preview-dialog::backdrop{background:rgba(0,0,0,.76);backdrop-filter:blur(7px);}
.artwork-preview-shell{position:relative;padding:18px;display:grid;gap:14px;}
.artwork-preview-stage{display:grid;place-items:center;border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(216,168,78,.06));border:1px solid rgba(255,255,255,.08);padding:14px;}
.artwork-preview-dialog img{display:block;width:100%;max-height:calc(100vh - 190px);object-fit:contain;border-radius:14px;background:#050608;box-shadow:0 20px 58px rgba(0,0,0,.45);}
.artwork-preview-dialog .artwork-preview-close{position:absolute;right:24px;top:24px;z-index:2;background:rgba(9,10,12,.88);border-color:rgba(255,255,255,.2);}
.artwork-preview-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:16px;}
.artwork-preview-dialog footer strong{display:block;font:900 16px Manrope,Inter,"Sakira JP",sans-serif;text-transform:uppercase;letter-spacing:.08em;color:#fff8e8;}
.artwork-preview-dialog footer span{display:block;margin-top:3px;color:#d8c293;font-size:13px;font-weight:800;}
.artwork-preview-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;}
.artwork-preview-actions button{min-height:42px;padding:10px 14px;font-weight:900;}
.artwork-preview-delete{border-color:rgba(255,120,120,.38)!important;color:#ffd5cf!important;}
@media(max-width:720px){
  .thumbnail-section .section-head{display:grid;}
  .thumbnail-section .artwork-actions{justify-content:stretch;}
  .thumbnail-section .artwork-actions .secondary{width:100%;justify-content:center;}
  .thumbnail-section .artwork-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
  .thumbnail-section .artwork-version,.thumbnail-section .artwork-upload-tile{min-height:132px;}
  .thumbnail-section .artwork-version img{min-height:132px;}
  .song-card-artworks{grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;}
  .song-card-artwork img{min-height:110px;}
  .artwork-preview-dialog footer{display:grid;}
  .artwork-preview-actions{justify-content:stretch;}
  .artwork-preview-actions button{width:100%;justify-content:center;}
}

/* 20260731 consistent artwork preview actions */
.artwork-preview-actions{
  align-items:stretch;
}
.artwork-preview-actions .artwork-preview-action{
  min-width:118px;
  min-height:44px;
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 13px!important;
  border-radius:13px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  background:rgba(255,255,255,.045)!important;
  color:#f7ead0!important;
  box-shadow:0 10px 28px rgba(0,0,0,.22);
  font-size:12px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}
.artwork-preview-actions .artwork-preview-action svg{
  width:16px;
  height:16px;
  flex:0 0 16px;
}
.artwork-preview-actions .artwork-preview-use{
  border-color:rgba(216,168,78,.58)!important;
  background:linear-gradient(135deg,rgba(216,168,78,.18),rgba(255,255,255,.045))!important;
  color:#ffe7ae!important;
}
.artwork-preview-actions .artwork-preview-use svg,
.artwork-preview-actions .artwork-preview-current svg{color:#d8a84e;}
.artwork-preview-actions .artwork-preview-delete{
  border-color:rgba(255,120,120,.38)!important;
  color:#ffd5cf!important;
}
.artwork-preview-actions .artwork-preview-delete svg{color:#ff8f81;}
.artwork-preview-actions .artwork-preview-edit svg{color:#f7ead0;}
.artwork-preview-actions .artwork-preview-current:disabled{
  opacity:.72;
  cursor:default;
}
@media(max-width:720px){
  .artwork-preview-actions .artwork-preview-action{width:100%;min-width:0;}
}

/* 20260731 artwork edit option chooser */
.artwork-edit-options-dialog{
  width:min(560px,calc(100vw - 28px));
  padding:0;
  border:1px solid rgba(216,168,78,.24);
  border-radius:22px;
  color:#f8f1df;
  background:radial-gradient(circle at 50% 0,rgba(216,168,78,.15),transparent 45%),#08090c;
  box-shadow:0 28px 90px rgba(0,0,0,.72);
}
.artwork-edit-options-dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(6px);}
.artwork-edit-options-card{position:relative;padding:22px;}
.artwork-edit-options-close{position:absolute;right:18px;top:18px;background:rgba(9,10,12,.88);border-color:rgba(255,255,255,.18);}
.artwork-edit-options-card .eyebrow{margin:0 0 8px;color:#d8a84e;font:900 11px Manrope,Inter,"Sakira JP",sans-serif;letter-spacing:.14em;}
.artwork-edit-options-card h2{margin:0;font:900 24px Manrope,Inter,"Sakira JP",sans-serif;color:#fff8e8;}
.artwork-edit-options-copy{margin:8px 44px 18px 0;color:#b9ad91;font-size:13px;line-height:1.45;}
.artwork-edit-option-list{display:grid;gap:10px;}
.artwork-edit-option{
  width:100%;
  min-height:70px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:12px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(255,255,255,.045),rgba(216,168,78,.045));
  color:#f7ead0;
  text-align:left;
  box-shadow:0 12px 32px rgba(0,0,0,.22);
}
.artwork-edit-option:hover{border-color:rgba(216,168,78,.46);background:linear-gradient(135deg,rgba(216,168,78,.13),rgba(255,255,255,.05));}
.artwork-edit-option>i{width:38px;height:38px;display:grid;place-items:center;border-radius:13px;background:rgba(216,168,78,.11);color:#d8a84e;}
.artwork-edit-option>i svg{width:18px;height:18px;}
.artwork-edit-option-text{display:grid;gap:3px;min-width:0;}
.artwork-edit-option-text strong{font:900 13px Manrope,Inter,"Sakira JP",sans-serif;color:#fff8e8;}
.artwork-edit-option-text small{font-size:12px;line-height:1.35;color:#aeb4bd;}
.artwork-edit-option em{
  justify-self:end;
  padding:4px 8px;
  border-radius:999px;
  background:linear-gradient(135deg,#f2d18b,#b98228);
  color:#090a0c;
  font:900 10px Manrope,Inter,"Sakira JP",sans-serif;
  letter-spacing:.08em;
  min-width:0;
}
.artwork-edit-option:not(.is-pro) em{display:none;}
.artwork-edit-option.is-pro{border-color:rgba(216,168,78,.22);}
@media(max-width:560px){
  .artwork-edit-options-card{padding:18px;}
  .artwork-edit-options-copy{margin-right:34px;}
  .artwork-edit-option{grid-template-columns:34px minmax(0,1fr) auto;padding:10px;}
  .artwork-edit-option>i{width:34px;height:34px;}
}

/* 20260731 simple cover editor */
.cover-editor-dialog{
  width:min(1180px,calc(100vw - 24px));
  max-height:calc(100vh - 24px);
  padding:0;
  border:1px solid rgba(216,168,78,.26);
  border-radius:22px;
  background:radial-gradient(circle at 20% 0,rgba(216,168,78,.14),transparent 38%),#07080b;
  color:#f8f1df;
  box-shadow:0 28px 90px rgba(0,0,0,.72);
  overflow:auto;
}
.cover-editor-dialog::backdrop{background:rgba(0,0,0,.78);backdrop-filter:blur(7px);}
.cover-editor-shell{position:relative;padding:20px;display:grid;gap:16px;}
.cover-editor-close{position:absolute;right:20px;top:20px;background:rgba(9,10,12,.88);border-color:rgba(255,255,255,.18);}
.cover-editor-shell header{padding-right:48px;}
.cover-editor-shell header .eyebrow{margin:0 0 6px;color:#d8a84e;font:900 11px Manrope,Inter,"Sakira JP",sans-serif;letter-spacing:.14em;}
.cover-editor-shell h2{margin:0;font:900 24px Manrope,Inter,"Sakira JP",sans-serif;color:#fff8e8;}
.cover-editor-shell header p:last-child{margin:7px 0 0;color:#b9ad91;font-size:13px;line-height:1.45;}
.cover-editor-body{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(290px,.7fr);gap:16px;align-items:start;}
.cover-editor-preview{padding:12px;border:1px solid rgba(255,255,255,.09);border-radius:18px;background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px rgba(216,168,78,.04);}
.cover-editor-preview canvas{display:block;width:100%;height:auto;border-radius:12px;background:#050608;box-shadow:0 18px 44px rgba(0,0,0,.36);}
.cover-editor-controls{display:grid;gap:12px;padding:14px;border:1px solid rgba(216,168,78,.18);border-radius:18px;background:linear-gradient(180deg,rgba(14,16,20,.92),rgba(8,9,12,.92));}
.cover-editor-controls label{display:grid;gap:6px;color:#d8c293;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;}
.cover-editor-controls input:not([type="checkbox"]),
.cover-editor-controls select{width:100%;min-height:38px;border-radius:11px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.055);color:#fff8e8;padding:8px 10px;}
.cover-editor-controls input[type="range"]{padding:0;accent-color:#d8a84e;}
.cover-editor-controls input[type="color"]{padding:3px;min-height:38px;}
.cover-editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.cover-editor-toggles{display:flex;flex-wrap:wrap;gap:10px;}
.cover-editor-toggles label{display:flex;align-items:center;gap:7px;min-height:34px;padding:8px 10px;border:1px solid rgba(255,255,255,.10);border-radius:999px;background:rgba(255,255,255,.045);text-transform:none;letter-spacing:0;color:#f7ead0;font-size:12px;}
.cover-editor-toggles input{accent-color:#d8a84e;}
.cover-editor-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:2px;}
.cover-editor-actions button{min-height:42px;display:inline-flex;align-items:center;gap:8px;}
@media(max-width:900px){
  .cover-editor-body{grid-template-columns:1fr;}
  .cover-editor-controls{order:2;}
}
@media(max-width:560px){
  .cover-editor-shell{padding:16px;}
  .cover-editor-grid{grid-template-columns:1fr;}
  .cover-editor-actions{display:grid;grid-template-columns:1fr;}
}

/* 20260731 cover editor text drag + cleanup */
.cover-editor-preview canvas{cursor:grab;touch-action:none;}
.cover-editor-preview canvas:active{cursor:grabbing;}
.cover-editor-help{margin:-4px 0 0;color:#b9ad91;font-size:12px;line-height:1.35;text-transform:none!important;letter-spacing:0!important;font-weight:700!important;}
.cover-editor-cleanup{
  display:grid;
  gap:10px;
  padding:10px;
  border:1px solid rgba(216,168,78,.14);
  border-radius:14px;
  background:rgba(216,168,78,.045);
}
.cover-editor-cleanup strong{font:900 11px Manrope,Inter,"Sakira JP",sans-serif;color:#f2d18b;text-transform:uppercase;letter-spacing:.08em;}
.cover-editor-controls:has([name="coverOldText"]:not(:checked)) .cover-editor-cleanup{opacity:.48;}
/* 20260731 original title replace workflow */
.cover-editor-title-tools{display:grid;gap:9px;padding:10px;border:1px solid rgba(216,168,78,.18);border-radius:14px;background:rgba(216,168,78,.055);}
.cover-editor-title-tools label{display:flex;align-items:center;gap:8px;min-height:34px;padding:8px 10px;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:rgba(255,255,255,.045);text-transform:none;letter-spacing:0;color:#f7ead0;font-size:12px;}
.cover-editor-title-tools label:first-child{border-color:rgba(216,168,78,.32);background:linear-gradient(135deg,rgba(216,168,78,.16),rgba(255,255,255,.035));}
.cover-editor-title-tools input{accent-color:#d8a84e;}
.cover-editor-delete-title{justify-content:center;min-height:38px;border-color:rgba(255,92,92,.35)!important;color:#ffd7d7!important;background:rgba(255,92,92,.08)!important;}
.cover-editor-delete-title svg{width:15px;height:15px;}
.cover-editor-cleanup-note{margin:-2px 0 0;color:#b9ad91;font-size:11px;line-height:1.35;text-transform:none!important;letter-spacing:0!important;font-weight:700!important;}

/* 20260731 cover editor inline clear text */
.cover-editor-text-field{gap:7px;}
.cover-editor-text-input-wrap{position:relative;display:block;}
.cover-editor-text-input-wrap input{padding-right:42px!important;}
.cover-editor-clear-text{
  position:absolute;
  right:7px;
  top:50%;
  transform:translateY(-50%);
  width:28px;
  height:28px;
  border-radius:999px;
  border:1px solid rgba(216,168,78,.30);
  background:rgba(10,11,14,.92);
  color:#f7e7bd;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(0,0,0,.24);
}
.cover-editor-clear-text[hidden]{display:none!important;}
.cover-editor-clear-text:hover{border-color:rgba(216,168,78,.65);background:rgba(216,168,78,.14);color:#fff8e8;}
.cover-editor-clear-text svg{width:15px;height:15px;stroke-width:2.5;}


/* 20260731 self-hosted signature cover editor fonts */
@font-face{font-family:"Brittany Signature";src:url("/assets/fonts/brittany-signature.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"bromello";src:url("/assets/fonts/bromello.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Beloved Script";src:url("/assets/fonts/beloved-script.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}

/* 20260731 artwork preview download action */
.artwork-preview-actions .artwork-preview-download svg{color:#d8a84e;}
.artwork-preview-actions .artwork-preview-download:disabled{opacity:.62;cursor:wait;}
/* 20260731 cover pro test editors */
.cover-editor-style-panel{
  display:grid;
  gap:8px;
  padding:12px;
  border:1px solid rgba(216,168,78,.20);
  border-radius:15px;
  background:linear-gradient(135deg,rgba(216,168,78,.10),rgba(255,255,255,.035));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);
}
.cover-editor-style-panel strong{
  color:#f2d18b;
  font:900 11px Manrope,Inter,"Sakira JP",sans-serif;
  text-transform:uppercase;
  letter-spacing:.10em;
}
.cover-editor-style-panel p{
  margin:0;
  color:#b9ad91;
  font-size:12px;
  line-height:1.35;
}
.cover-editor-style-list{display:flex;flex-wrap:wrap;gap:8px;}
.cover-editor-style-chip{
  min-height:34px;
  padding:8px 11px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(255,255,255,.055);
  color:#f7ead0;
  font:900 12px Manrope,Inter,"Sakira JP",sans-serif;
  cursor:pointer;
}
.cover-editor-style-chip:hover,
.cover-editor-style-chip.active{
  border-color:rgba(216,168,78,.62);
  background:linear-gradient(135deg,rgba(216,168,78,.28),rgba(255,255,255,.055));
  color:#fff8e8;
  box-shadow:0 10px 24px rgba(216,168,78,.12);
}
.cover-editor-dialog-styles .cover-editor-preview,
.cover-editor-dialog-studio .cover-editor-preview{border-color:rgba(216,168,78,.22);}
.cover-editor-dialog-studio .cover-editor-controls{box-shadow:0 18px 48px rgba(0,0,0,.24),inset 0 0 0 1px rgba(216,168,78,.04);}


/* 20260731 engagement overlay menu (landscape video stage settings) */
.engagement-dialog .engagement-note{color:var(--muted);font-size:12px;margin:0 0 16px;text-align:left;}
.engagement-enable{display:flex;align-items:center;gap:9px;text-align:left;margin:0 0 14px;}
.engagement-enable input{accent-color:#d8a84e;width:16px;height:16px;flex:0 0 16px;}
.engagement-enable span{font-size:13px;font-weight:700;color:#f7ead0;}
.engagement-toggles{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 16px;}
.engagement-toggles label{display:flex;align-items:center;gap:7px;min-height:34px;padding:8px 12px;border:1px solid rgba(255,255,255,.10);border-radius:999px;background:rgba(255,255,255,.045);color:#f7ead0;font-size:12px;font-weight:700;}
.engagement-toggles input{accent-color:#d8a84e;}
.engagement-hue-field{display:flex;align-items:center;gap:12px;margin:0 0 18px;text-align:left;}
.engagement-hue-field span:first-child{flex:0 0 auto;font-size:12px;font-weight:700;color:#f7ead0;}
.engagement-hue-field input[type="range"]{flex:1;accent-color:#d8a84e;}
.engagement-hue-swatch{width:26px;height:26px;border-radius:50%;border:1px solid rgba(255,255,255,.22);flex:0 0 26px;}
/* 20260801 disabled state: fields lose their effect (master off, or a vertical
   video job locks the whole form) -- dim them so that reads visually rather
   than staying full-intensity and clickable with no consequence. */
.engagement-enable:has(input:disabled){opacity:.45;}
.engagement-toggles label:has(input:disabled){opacity:.45;}
.engagement-hue-field:has(input:disabled){opacity:.45;}
.engagement-dialog button.primary:disabled{cursor:not-allowed;}

/* Miniature du projet dans les blocs de version.
   La miniature est en 16/9 : c'est le format de la vignette YouTube et celui de
   l'image posee sur la video. La montrer dans le carre de 64 px du bloc en
   coupait pres de la moitie, gauche et droite. Le cadre garde donc sa hauteur
   et laisse la largeur suivre le rapport de l'image.
   La premiere colonne de la grille suit le cadre au lieu d'une largeur fixe :
   l'image carree du generateur de musique et la miniature 16/9 tiennent ainsi
   la meme grille sans deborder sur le titre. */
.workflow-inline-player{grid-template-columns:auto minmax(160px,260px) minmax(280px,1fr) minmax(112px,auto);}
.inline-player-cover.is-landscape{width:auto;aspect-ratio:16/9;}
@media(max-width:900px){.workflow-inline-player{grid-template-columns:auto minmax(0,1fr) minmax(104px,auto);}}

/* Landscape video preview menu */
.song-card-video.is-landscape .song-card-video-preview{
  position:relative;
}
.song-card-video.is-landscape .video-options-wrap{
  position:absolute;
  top:8px;
  right:8px;
  z-index:8;
}
.song-card-video.is-landscape .video-options-trigger{
  width:34px;
  height:34px;
  display:inline-grid!important;
  place-items:center;
  padding:0!important;
  border-radius:999px;
  background:rgba(5,5,6,.28);
  border:1px solid rgba(255,255,255,.16);
  color:#fff;
  backdrop-filter:blur(10px);
}
.song-card-video.is-landscape .video-options-menu{
  top:calc(100% + 8px);
  right:0;
}
.song-card-video.is-landscape .song-card-video-actions:empty{
  display:none;
}

/* Bottom app actions for main video player */
.version-workspace-player{
  position:relative;
}
.version-workspace-bottom-actions{
  position:absolute;
  right:10px;
  bottom:34px;
  z-index:16;
}
.version-workspace-bottom-actions .video-options-trigger{
  width:38px;
  height:38px;
  display:inline-grid!important;
  place-items:center;
  padding:0!important;
  border-radius:999px;
  background:rgba(5,5,6,.68);
  border:1px solid rgba(255,255,255,.22);
  color:#fff;
  backdrop-filter:blur(10px);
}
.version-workspace-bottom-actions .video-options-menu{
  right:0;
  bottom:calc(100% + 10px);
  top:auto;
}
@media(max-width:900px){
  .version-workspace-bottom-actions .video-options-menu{
    position:fixed!important;
    right:8px!important;
    left:auto!important;
    top:auto!important;
    bottom:calc(96px + env(safe-area-inset-bottom,0px))!important;
    max-width:min(315px,calc(100vw - 16px));
    max-height:calc(100dvh - 132px);
    overflow:auto;
  }
}
@media(max-width:720px){
  .song-card-video.is-landscape .video-options-menu{
    position:fixed!important;
    right:8px!important;
    left:auto!important;
    top:calc(84px + env(safe-area-inset-top,0px))!important;
    bottom:auto!important;
    max-width:min(238px,calc(100vw - 16px));
    max-height:calc(100dvh - 120px);
    overflow:auto;
  }
}


/* App actions menu for the Short fold preview */
.version-workspace-short{
  position:relative;
  display:inline-block;
  width:fit-content;
  max-width:100%;
}
.version-workspace-short .version-workspace-short-media{
  display:block;
}
.version-workspace-short .video-options-wrap{
  position:absolute;
  right:10px;
  bottom:30px;
  z-index:30;
}
.version-workspace-short .video-options-trigger{
  width:30px;
  height:30px;
  display:inline-grid!important;
  place-items:center;
  padding:0!important;
  border-radius:999px;
  background:rgba(5,5,6,.68);
  border:1px solid rgba(255,255,255,.22);
  color:#fff;
  backdrop-filter:blur(10px);
}
.version-workspace-short .video-options-menu{
  right:0;
  top:auto;
  bottom:calc(100% + 10px);
}


/* Short fold uses one custom bottom control bar; no separate top options button. */
.version-workspace-short .short-preview-controls .video-options-wrap{
  position:static;
  z-index:auto;
  display:grid;
  place-items:center;
}
.version-workspace-short .short-preview-controls .video-options-trigger{
  width:24px;
  height:24px;
  margin:auto;
  border:0;
  background:transparent;
  color:#fff;
  box-shadow:none;
  backdrop-filter:none;
}
.version-workspace-short .short-preview-controls .video-options-menu{
  right:0;
  top:auto;
  bottom:calc(100% + 12px);
}


/* Keep the Short preview options dropdown in the same full menu layout as the main player. */
.version-workspace-short .short-preview-controls .video-options-menu{
  min-width:238px;
  max-width:min(238px,calc(100vw - 32px));
  padding:7px;
  text-align:left;
}
.version-workspace-short .short-preview-controls .video-options-menu .song-menu-item,
.version-workspace-short .short-preview-controls .video-options-menu .song-menu-label,
.version-workspace-short .short-preview-controls .video-options-menu .danger{
  width:100%;
  height:auto;
  min-height:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  padding:10px 11px;
  border-radius:10px;
  color:var(--ink);
  background:transparent;
  font-size:13px;
  font-weight:700;
  line-height:1.2;
  text-align:left;
  white-space:nowrap;
}
.version-workspace-short .short-preview-controls .video-options-menu .song-speed-options{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  padding:0 8px 6px;
}
.version-workspace-short .short-preview-controls .video-options-menu .song-speed-option{
  width:auto;
  height:auto;
  margin:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:5px 8px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#17191e;
  color:#dfe2e8;
  font-size:11px;
  font-weight:800;
  line-height:1;
}
.version-workspace-short .short-preview-controls .video-options-menu svg{
  width:16px;
  height:16px;
  flex:0 0 16px;
  filter:none;
}


/* Short fold bottom controls: keep icons and progress line inside the video frame. */
.version-workspace-short > .short-preview-controls{
  left:0;
  right:0;
  bottom:6px;
  grid-template-columns:repeat(4,minmax(0,1fr));
  justify-items:center;
  gap:0;
  padding:4px 12px 13px;
  box-sizing:border-box;
}
.version-workspace-short > .short-preview-controls:after{
  left:12px;
  right:12px;
  bottom:4px;
}
.version-workspace-short > .short-preview-controls button,
.version-workspace-short > .short-preview-controls .video-options-wrap{
  justify-self:center;
}


/* Short fold frame: controls belong to the video frame, not the captioned figure. */
.version-workspace-short-frame{
  position:relative;
  width:fit-content;
  max-width:100%;
  overflow:visible;
  border-radius:8px;
}
.version-workspace-short-frame .version-workspace-short-media{
  display:block;
}
.version-workspace-short-frame > .short-preview-controls{
  left:0;
  right:0;
  bottom:0;
  grid-template-columns:repeat(4,minmax(0,1fr));
  justify-items:center;
  gap:0;
  padding:4px 12px 14px;
  box-sizing:border-box;
}
.version-workspace-short-frame > .short-preview-controls:after{
  left:12px;
  right:12px;
  bottom:5px;
}
.version-workspace-short-frame > .short-preview-controls button,
.version-workspace-short-frame > .short-preview-controls .video-options-wrap{
  justify-self:center;
}


.version-workspace-short-label{
  display:block;
  margin-top:8px;
}


/* Inner bottom breathing room for Short fold controls, matching the large video. */
.version-workspace-short-frame > .short-preview-controls{
  padding-bottom:20px;
}
.version-workspace-short-frame > .short-preview-controls:after{
  bottom:9px;
}


/* Right version card publishing buttons: align all labels consistently from the left. */
.version-workspace-publications{
  display:flex;
  flex-direction:column;
  gap:9px;
}
.version-workspace-publications .version-workspace-option{
  width:100%;
  min-height:44px;
  display:flex!important;
  align-items:center;
  justify-content:flex-start!important;
  gap:10px;
  padding:10px 14px!important;
  text-align:left!important;
}
.version-workspace-publications .version-workspace-option .platform-symbol,
.version-workspace-publications .version-workspace-option > i,
.version-workspace-publications .version-workspace-option > svg{
  flex:0 0 24px;
}
.version-workspace-publications .version-workspace-option span:not(.platform-symbol){
  flex:1;
  min-width:0;
  text-align:left;
}
.version-workspace-publications .version-workspace-publish-lead{
  justify-content:flex-start!important;
}
.version-workspace-publications .version-workspace-publish-everywhere{
  border-color:rgba(216,168,78,.44)!important;
  background:linear-gradient(135deg,rgba(216,168,78,.88),rgba(127,82,28,.72))!important;
  color:#120d08!important;
  font-weight:900!important;
  box-shadow:0 14px 30px rgba(216,168,78,.14),inset 0 1px 0 rgba(255,241,190,.24)!important;
}
.version-workspace-publications .version-workspace-publish-everywhere:hover{
  border-color:rgba(255,222,145,.68)!important;
  background:linear-gradient(135deg,rgba(240,199,111,.94),rgba(165,106,34,.82))!important;
  color:#090a0c!important;
  box-shadow:0 16px 34px rgba(216,168,78,.18),inset 0 1px 0 rgba(255,246,204,.30)!important;
}
.version-workspace-publications .version-workspace-publish-everywhere svg{
  color:#120d08!important;
}
.publish-everywhere-card{
  gap:14px;
}
.publish-everywhere-copy{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
}
.publish-everywhere-list{
  display:grid;
  gap:9px;
  margin:4px 0;
}
.publish-everywhere-row{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.035);
}
.publish-everywhere-row .publication-account-field{
  grid-column:2 / -1;
  margin:0;
}
.publish-everywhere-row .publication-account-choices{
  margin-top:6px;
}
.publish-everywhere-row.ready{
  border-color:rgba(89,189,131,.28);
  background:rgba(34,92,61,.22);
}
.publish-everywhere-row.muted{
  opacity:.68;
}
.publish-everywhere-row .platform-symbol{
  width:25px;
  height:25px;
}
.publish-everywhere-row span{
  font-weight:850;
}
.publish-everywhere-row strong{
  color:#d8a84e;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.publish-everywhere-row.ready strong{
  color:#6ed58f;
}


/* Remix dialog button polish: quieter voice tools and cleaner footer actions. */
.regeneration-dialog .regen-voice-section{
  padding:12px 14px;
  border-radius:12px;
  background:rgba(255,255,255,.025);
  border-color:rgba(255,255,255,.08);
}
.regeneration-dialog .regen-voice-actions{
  gap:8px;
}
.regeneration-dialog .regen-voice-actions .secondary{
  min-height:36px;
  padding:8px 12px;
  border-radius:10px;
  border-color:rgba(255,255,255,.10);
  background:#121419;
  color:#f1eadc;
  font-size:13px;
  font-weight:750;
  line-height:1;
}
.regeneration-dialog .regen-voice-actions .secondary:hover{
  border-color:rgba(216,168,78,.34);
  background:rgba(216,168,78,.08);
}
.regeneration-dialog .regen-voice-actions .secondary svg{
  width:15px;
  height:15px;
  color:#d8a84e;
}
.regeneration-dialog .regen-actions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:10px;
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.08);
}
.regeneration-dialog .regen-actions .secondary,
.regeneration-dialog .regen-actions .primary{
  min-height:40px;
  padding:9px 15px;
  border-radius:9px;
  font-size:14px;
  font-weight:800;
  line-height:1;
}
.regeneration-dialog .regen-actions .secondary{
  border-color:rgba(255,255,255,.12);
  background:#121419;
  color:#f1eadc;
}
.regeneration-dialog .regen-actions .primary{
  background:#c79033;
  color:#fff8e8;
  box-shadow:none;
}
.regeneration-dialog .regen-actions .primary:hover{
  background:#d8a84e;
}
.regeneration-dialog .regen-actions svg{
  width:15px;
  height:15px;
}
/* n 1198 - confirmer() : la boite de confirmation de l application. Le reste
   vient de .profile-dialog et .regeneration-dialog ; seuls le texte et la
   couleur d une action destructive sont propres a elle. */
.confirmer-dialog .confirmer-message{margin:0;color:var(--ink);font-size:15px;line-height:1.5;text-align:left;white-space:pre-line;}
.regeneration-dialog .regen-actions .primary.danger{background:#b3261e;color:#fff;}
.regeneration-dialog .regen-actions .primary.danger:hover{background:#d0342b;}
@media(max-width:700px){
  .regeneration-dialog .regen-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
  }
}


.version-workspace-short-frame .version-workspace-short-media{
  border-radius:8px;
  overflow:hidden;
}
.version-workspace-short-frame > .short-preview-controls{
  border-radius:0 0 8px 8px;
  overflow:visible;
}
.version-workspace-short-frame .video-options-menu{
  z-index:80;
}


/* Unified version-card publish style for every song/project state. */
.version-workspace-publications .version-workspace-option,
.version-workspace-publications a.version-workspace-option,
.version-workspace-publications button.version-workspace-option{
  width:100%!important;
  min-height:44px!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  padding:10px 14px!important;
  border-radius:9px!important;
  text-align:left!important;
  white-space:normal!important;
  line-height:1.15!important;
}
.version-workspace-publications .version-workspace-publish-lead{
  background:#15171b!important;
  border-color:rgba(255,255,255,.09)!important;
  color:#f4f1e8!important;
  box-shadow:none!important;
}
.version-workspace-publications .version-workspace-publish-lead:hover{
  background:#15171b!important;
  border-color:rgba(216,168,78,.62)!important;
  color:var(--accent)!important;
  box-shadow:none!important;
}
.version-workspace-publications .version-workspace-schedule,
.version-workspace-publications .coming-soon-action{
  background:#15171b!important;
  border-color:rgba(255,255,255,.09)!important;
  color:#f4f1e8!important;
  box-shadow:none!important;
}
.version-workspace-publications .coming-soon-action{
  opacity:.62!important;
  cursor:not-allowed!important;
}
.version-workspace-publications .version-workspace-option .platform-symbol{
  width:24px!important;
  height:24px!important;
  flex:0 0 24px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
}
.version-workspace-publications .version-workspace-option .platform-symbol svg,
.version-workspace-publications .version-workspace-option > svg,
.version-workspace-publications .version-workspace-option > i{
  width:18px!important;
  height:18px!important;
  flex:0 0 18px!important;
}
.version-workspace-publications .version-workspace-option span:not(.platform-symbol){
  flex:1 1 auto!important;
  min-width:0!important;
  text-align:left!important;
  font-size:14px!important;
  font-weight:850!important;
}


/* Consistent readable published status pill across version cards. */
.version-workspace-card-published{
  display:flex;
  align-items:center;
  gap:8px;
  margin:12px 0 14px;
  color:#9aa1ad;
  font-size:12px;
  font-weight:750;
}
.version-workspace-card-published-label{
  color:#9aa1ad;
}
.version-published{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:22px;
  padding:4px 9px;
  border:1px solid rgba(89,189,131,.36);
  border-radius:999px;
  background:rgba(89,189,131,.10);
  color:#71d89b;
  font-size:11px;
  font-weight:900;
  line-height:1;
  letter-spacing:0;
}
.version-published-text{
  color:#71d89b;
}
.version-published-platform{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
}
.version-published-platform .platform-symbol{
  width:18px;
  height:18px;
}
.version-published-platform .platform-symbol svg{
  width:13px;
  height:13px;
}


/* Restore lighter typography on version-card publish controls. */
.version-workspace-publications .version-workspace-option span:not(.platform-symbol){
  font-weight:700!important;
}
.version-workspace-card-published{
  font-weight:600!important;
}
.version-published{
  font-weight:750!important;
}
.version-published-text{
  font-weight:750!important;
}
.version-workspace-title{
  font-weight:750!important;
}


/* Version card platform status chips, matching the project list chips. */
.version-platform-statuses{
  margin-top:12px;
  gap:6px;
}
.version-platform-statuses .project-platform-status{
  font-size:10px;
  font-weight:800;
  letter-spacing:.03em;
}
.version-platform-statuses .project-platform-status.linked{
  text-decoration:none;
  cursor:pointer;
}
.version-platform-statuses .project-platform-status.linked:hover{
  border-color:rgba(216,168,78,.72);
  color:#f6d98d;
}


/* Disabled publish buttons when a required video asset is missing. */
.version-workspace-publications .missing-video-action{
  opacity:.62!important;
  cursor:not-allowed!important;
  background:#15171b!important;
  border-color:rgba(255,255,255,.09)!important;
  color:#a5abb5!important;
  box-shadow:none!important;
}
.version-workspace-publications .missing-video-action .platform-symbol{
  filter:grayscale(.28);
  opacity:.8;
}


/* Keep version platform chips anchored at the bottom of the right card. */
.version-workspace-card{
  display:flex;
  flex-direction:column;
}
.version-workspace-card .version-platform-statuses{
  margin-top:auto;
  padding-top:18px;
}

/* Suno-style create mode controls. */
.create-mode-toggle{
  width:max-content;
  display:inline-flex;
  gap:4px;
  padding:4px;
  margin:0 0 18px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.035);
}
.create-mode-toggle label{
  display:block;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
  cursor:pointer;
}
.create-mode-toggle input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.create-mode-toggle span{
  display:block;
  padding:8px 14px;
  border-radius:999px;
}
.create-mode-toggle input:checked+span{
  background:rgba(216,168,78,.22);
  color:var(--ink);
}
.lyrics-create-fields{
  display:grid;
  gap:14px;
  min-width:0;
}
.lyrics-create-fields input,
.lyrics-create-fields textarea{
  width:100%;
  min-width:0;
}
.lyrics-create-fields textarea{
  min-height:300px;
}
.lyrics-create-grid{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(220px,1fr);
  gap:12px;
  min-width:0;
}
.lyrics-create-grid label{
  min-width:0;
}
.lyrics-choice-toggle{
  width:100%;
  min-height:34px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:10px;
  background:rgba(255,255,255,.025);
  color:var(--ink);
  font-size:13px;
  font-weight:700;
  text-align:left;
}
.lyrics-choice-toggle:hover,
.lyrics-choice-toggle[aria-expanded=true]{
  border-color:rgba(224,169,70,.45);
  background:rgba(224,169,70,.10);
}
.lyrics-choice-caret{
  width:16px;
  flex:0 0 16px;
  color:var(--gold);
  transition:transform .16s ease;
}
.lyrics-choice-toggle[aria-expanded=true] .lyrics-choice-caret{
  transform:rotate(90deg);
}
.lyrics-choice-panel{
  display:grid;
  gap:12px;
  padding:12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  background:rgba(255,255,255,.03);
  width:100%;
  max-width:100%;
  min-width:0;
  overflow:hidden;
}
.lyrics-choice-panel span{
  display:block;
  margin-bottom:7px;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.lyrics-choice-chips{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  overflow:hidden;
  padding-bottom:4px;
  scrollbar-width:thin;
}
.lyrics-choice-chip{
  flex:0 1 auto;
  max-width:100%;
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
  padding:6px 10px;
  background:rgba(255,255,255,.06);
  color:var(--text);
  font-size:13px;
  font-weight:650;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  cursor:pointer;
}
.lyrics-choice-chip:hover,
.lyrics-choice-chip.selected{
  border-color:rgba(224,169,70,.65);
  background:rgba(224,169,70,.18);
  color:var(--gold);
}
@media(max-width:700px){
  .create-mode-toggle{width:100%;}
  .create-mode-toggle label{flex:1;text-align:center;}
  .lyrics-create-grid{grid-template-columns:1fr;}
}

/* 20260804 unified schedule platform chooser */
.schedule-platform-dialog .schedule-card h2{
  margin-bottom:10px!important;
}
.schedule-platform-hint{
  margin:0 0 18px;
  text-align:center;
  line-height:1.5;
}
.schedule-platform-options{
  display:grid;
  gap:12px;
  margin:8px 0 20px;
}
.schedule-platform-option{
  width:100%;
  justify-content:flex-start!important;
  min-height:62px!important;
  padding:14px 16px!important;
  gap:12px!important;
}
.schedule-platform-option .platform-symbol,
.schedule-platform-option svg{
  flex:0 0 auto;
}
.schedule-platform-option > span:not(.platform-symbol){
  flex:1;
  text-align:left;
}
.schedule-platform-reason{
  display:block;
  width:100%;
  margin-top:4px;
  font-size:11px;
  font-weight:650;
  text-transform:none;
}
.schedule-platform-option:disabled{
  opacity:.55;
  cursor:not-allowed;
}
.schedule-platform-all-option{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  column-gap:12px!important;
  row-gap:2px!important;
  min-height:64px!important;
  padding:13px 15px!important;
  border-color:rgba(216,168,78,.56)!important;
  background:linear-gradient(135deg,rgba(216,168,78,.16),rgba(216,168,78,.06) 48%,rgba(255,255,255,.035))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 14px 28px rgba(0,0,0,.22);
}
.schedule-platform-all-option > svg,
.schedule-platform-all-option > i{
  grid-column:1;
  width:21px;
  height:21px;
  color:#f0ca78;
}
.schedule-platform-all-option > span:not(.platform-symbol){
  grid-column:2;
  min-width:0;
  max-width:100%;
  font-weight:850;
  line-height:1.22;
  letter-spacing:-.01em;
  text-align:left;
}
.schedule-platform-all-option .schedule-platform-reason{
  grid-column:3;
  justify-self:end;
  align-self:center;
  width:auto;
  margin:0;
  padding:5px 9px;
  border:1px solid rgba(216,168,78,.5);
  border-radius:999px;
  background:rgba(216,168,78,.16);
  color:#f5d890!important;
  font-size:10px;
  font-weight:900;
  line-height:1;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
}
@media(max-width:430px){
  .schedule-platform-all-option{
    grid-template-columns:22px minmax(0,1fr) auto;
    column-gap:10px!important;
    padding:12px 13px!important;
  }
  .schedule-platform-all-option > span:not(.platform-symbol){
    font-size:14px;
  }
  .schedule-platform-all-option .schedule-platform-reason{
    padding:5px 8px;
  }
}


/* 20260805 workflow core spacing final override — title/button balance and clear outer orbit */




/* 20260805 real brand svg social icons — use local Simple Icons brand SVGs, not hand-drawn approximations */
.platform-symbol img{width:18px;height:18px;display:block;object-fit:contain}
.platform-instagram img,.platform-facebook img{width:23px;height:23px}
.platform-youtube img{width:22px;height:22px}
.platform-tiktok img{width:19px;height:19px}

/* Project workflow — clean centered orbital layout */
#view-project .flow{
  position:relative;
  width:min(760px,100%);
  aspect-ratio:1 / 1;
  margin:36px auto 52px;
  padding:0;
  border:0;
  border-radius:50%;
  overflow:visible;
  background:radial-gradient(circle at 50% 50%,rgba(216,168,78,.10) 0 18%,transparent 19% 38%,rgba(216,168,78,.08) 39%,transparent 40%),radial-gradient(circle at 50% 50%,rgba(255,255,255,.035),transparent 62%);
  box-shadow:none;
}
#view-project .flow:before,
#view-project .flow:after{
  content:"";
  position:absolute;
  border-radius:50%;
  pointer-events:none;
}
#view-project .flow:before{
  inset:90px;
  border:1px solid rgba(216,168,78,.30);
  background:conic-gradient(from -40deg,rgba(216,168,78,.10),rgba(216,168,78,.78) 16%,rgba(216,168,78,.52) 42%,rgba(255,255,255,.08) 55%,rgba(255,255,255,.045) 78%,rgba(216,168,78,.12));
  box-shadow:0 0 46px rgba(216,168,78,.16);
  mask:radial-gradient(circle,transparent 0 calc(100% - 3px),#000 calc(100% - 2px));
  -webkit-mask:radial-gradient(circle,transparent 0 calc(100% - 3px),#000 calc(100% - 2px));
  z-index:1;
}
#view-project .flow:after{
  inset:160px;
  border:1px solid rgba(255,255,255,.055);
  background:radial-gradient(circle at 50% 52%,rgba(216,168,78,.13),transparent 34%);
  z-index:1;
}
#view-project .flow-core{
  position:absolute;
  left:50%;
  top:50%;
  width:min(320px,82%);
  aspect-ratio:1 / 1;
  transform:translate(-50%,-50%);
  border-radius:50%;
  border:1px solid rgba(216,168,78,.42);
  background:radial-gradient(ellipse at 50% 42%,rgba(216,168,78,.16),transparent 32%),linear-gradient(180deg,#17191f,#090a0c);
  box-shadow:0 0 56px rgba(216,168,78,.20),inset 0 0 60px rgba(0,0,0,.58);
  z-index:4;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-align:center;
  padding:30px;
  overflow:hidden;
}
#view-project .flow-core:before{
  content:"";
  position:absolute;
  left:12%;
  right:12%;
  top:50%;
  height:44px;
  border:0;
  border-radius:50%;
  background:linear-gradient(90deg,transparent,rgba(216,168,78,.10),rgba(216,168,78,.62),rgba(216,168,78,.10),transparent);
  filter:blur(3px);
  pointer-events:none;
}
#view-project .flow-core:after{
  content:"";
  position:absolute;
  inset:28px;
  border-radius:50%;
  border:1px dashed rgba(216,168,78,.18);
  pointer-events:none;
}
#view-project .flow-core small{
  position:relative;
  z-index:1;
  font-size:9px;
  letter-spacing:.20em;
  text-transform:uppercase;
  color:#d8a84e;
  font-weight:900;
}
#view-project .flow-core strong{
  position:relative;
  z-index:1;
  width:min(82%,240px);
  max-width:240px;
  margin:0 auto;
  font:900 clamp(20px,2.2vw,34px) Manrope;
  line-height:1.04;
  letter-spacing:0;
  overflow-wrap:anywhere;
  word-break:normal;
  hyphens:auto;
  text-wrap:balance;
  text-transform:uppercase;
  color:#fff;
  text-shadow:0 0 28px rgba(216,168,78,.18);
}
#view-project .flow-core strong[data-title-length="medium"]{
  font-size:clamp(18px,1.9vw,28px);
}
#view-project .flow-core strong[data-title-length="long"]{
  width:min(78%,224px);
  max-width:224px;
  font-size:clamp(14px,1.35vw,21px);
  line-height:1.06;
}
#view-project .flow-core .concept-style{
  position:relative;
  z-index:1;
  max-width:218px;
  min-height:26px;
  padding:5px 10px;
  border:1px solid rgba(216,168,78,.26);
  border-radius:999px;
  background:rgba(216,168,78,.08);
  color:#f0d49a;
  font-size:11px;
  font-weight:800;
  text-transform:none;
  letter-spacing:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  flex:0 0 auto;
}
#view-project .flow-preview{
  position:relative;
  z-index:1;
  width:56px;
  height:56px;
  border:0;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#f4d28a,#b98228);
  color:#090a0c;
  box-shadow:0 0 34px rgba(216,168,78,.38);
  padding:0;
  margin-top:2px;
  flex:0 0 auto;
}
#view-project .flow-preview svg{
  width:22px;
  height:22px;
  fill:#090a0c;
  stroke-width:3;
  transform:translateX(2px);
}
#view-project .flow-preview.is-playing{
  animation:flowPreviewZoom 1.15s ease-in-out infinite;
  box-shadow:0 0 42px rgba(216,168,78,.55),0 0 0 10px rgba(216,168,78,.10);
}
#view-project .flow-preview.is-playing:before{
  content:"";
  position:absolute;
  inset:-12px;
  border:1px solid rgba(216,168,78,.42);
  border-radius:50%;
  animation:flowPreviewHalo 1.15s ease-out infinite;
  pointer-events:none;
}
#view-project .flow-preview.is-playing svg{
  transform:none;
}
@keyframes flowPreviewZoom{
  0%,100%{transform:scale(.92);}
  50%{transform:scale(1.14);}
}
@keyframes flowPreviewHalo{
  0%{transform:scale(.72);opacity:.9;}
  100%{transform:scale(1.55);opacity:0;}
}
#view-project .flow-core em{
  position:relative;
  z-index:1;
  color:#8f949d;
  font-style:normal;
  font-size:10px;
  font-weight:800;
  letter-spacing:.09em;
  text-transform:uppercase;
  flex:0 0 auto;
}
#view-project .flow-step{
  position:absolute;
  width:126px;
  height:126px;
  min-height:126px;
  border-radius:50%;
  padding:12px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  text-align:center;
  background:radial-gradient(circle at 50% 32%,rgba(255,255,255,.055),transparent 38%),linear-gradient(180deg,#17191e,#0b0c0f);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 50px rgba(0,0,0,.50);
  z-index:5;
  backdrop-filter:blur(10px);
}
#view-project .flow-step:before{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:50%;
  border:1px solid rgba(216,168,78,.08);
  pointer-events:none;
}
#view-project .flow-step:after{
  display:none;
}
#view-project .flow-number{
  order:1;
  min-width:0;
  height:auto;
  border:0;
  background:transparent;
  color:#8f949d;
  font:900 11px Manrope;
  letter-spacing:.14em;
}
#view-project .flow-icon{
  order:2;
  width:36px;
  height:36px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#aeb4bd;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:none;
}
#view-project .flow-icon svg{
  width:20px;
  height:20px;
  stroke-width:2;
}
#view-project .flow-step strong{
  order:3;
  font:900 12px Manrope;
  color:#dfe3ea;
  letter-spacing:.10em;
  text-transform:uppercase;
  align-self:center;
}
#view-project .flow-step em{
  order:4;
  color:#717783;
  font-size:9px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-style:normal;
}
#view-project .flow-step.done{
  border-color:rgba(216,168,78,.52);
  box-shadow:0 20px 54px rgba(0,0,0,.50),0 0 30px rgba(216,168,78,.18);
}
#view-project .flow-step.done .flow-icon{
  color:#090a0c;
  background:linear-gradient(135deg,#f2d18b,#b98228);
  border-color:transparent;
  box-shadow:0 0 22px rgba(216,168,78,.25);
}
#view-project .flow-step.done:before{
  border-color:rgba(216,168,78,.25);
}
#view-project .flow-step.done .flow-number,
#view-project .flow-step.done strong{
  color:#f2d18b;
}
#view-project .flow-step.done .flow-icon:after{
  content:"✓";
  position:absolute;
  right:-8px;
  bottom:-8px;
  width:22px;
  height:22px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#d8a84e;
  color:#08090b;
  font:900 12px Inter;
  box-shadow:0 0 18px rgba(216,168,78,.35);
}
#view-project .flow-step.active{
  border-color:rgba(216,168,78,.95);
  box-shadow:0 20px 58px rgba(0,0,0,.52),0 0 42px rgba(216,168,78,.30);
}
#view-project .flow-step.active .flow-icon{
  color:#090a0c;
  background:linear-gradient(135deg,#ffe3a0,#d8a84e);
  border-color:transparent;
}
#view-project .flow-step.active:before{
  inset:-13px;
  border-color:rgba(216,168,78,.48);
  box-shadow:0 0 26px rgba(216,168,78,.22);
}
#view-project .flow-step.active em{
  position:absolute;
  bottom:-36px;
  left:50%;
  transform:translateX(-50%);
  padding:7px 12px;
  border-radius:999px;
  border:1px solid rgba(216,168,78,.26);
  background:#111318;
  color:#f2d18b;
  white-space:nowrap;
  box-shadow:0 10px 24px rgba(0,0,0,.35);
}
/* n 783 - La place vient du calcul de `flowSteps`, plus de sept regles ecrites
   en dur sur huit creneaux. Le POURQUOI est ecrit la-bas, avec le defaut qu il
   ferme : la derniere etape se collait a la premiere, et la huitieme etape
   (quand la publication s affiche) n avait aucune place du tout.
   Le repli `50%` garde les pastilles au centre plutot que dans un coin si les
   variables manquaient. */
#view-project .flow-step{
  left:var(--x,50%);
  top:var(--y,50%);
  transform:translate(-50%,-50%);
}

/* Project automatic production: process + lyrics side by side */
.project-workflow-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);
  gap:18px;
  align-items:start;
  margin:22px 0 30px;
}
.project-workflow-grid #flow{
  width:100%;
  margin:0;
}
.project-lyrics-panel{
  min-width:0;
  border:1px solid rgba(216,168,78,.22);
  border-radius:24px;
  background:linear-gradient(180deg,rgba(17,19,24,.96),rgba(10,11,14,.98));
  box-shadow:0 22px 66px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.035);
  padding:20px;
  position:sticky;
  top:18px;
}
.project-lyrics-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  margin-bottom:14px;
}
.project-lyrics-head h3{
  margin:5px 0 5px;
  font:900 20px Manrope;
  color:var(--ink);
  line-height:1.15;
}
.project-lyrics-head span{
  display:block;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}
.project-lyrics-edit{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:7px;
  border-radius:999px;
}
.project-lyrics-edit svg{
  width:15px;
  height:15px;
}
.project-lyrics-text{
  margin:0;
  max-height:min(560px,62vh);
  overflow:auto;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:#090b0f;
  color:#e8e1d2;
  padding:18px;
  font:500 14px/1.72 Inter,"Sakira JP",sans-serif;
}

/* Desktop: fixed-size orbital process, centered bubble */
@media(min-width:1120px){
  .project-workflow-grid{
    grid-template-columns:760px minmax(360px,1fr);
    gap:24px;
  }
  .project-workflow-grid #flow{
    width:760px;
    height:760px;
    justify-self:center;
  }
}

@media(max-width:1120px){
  .project-workflow-grid{
    grid-template-columns:1fr;
  }
  .project-workflow-grid #flow{
    width:min(760px,100%);
    height:min(760px,100vw);
    margin:36px auto 52px;
  }
}

@media(max-width:900px){
  .project-workflow-grid #flow{
    width:100%;
    height:auto;
    margin:0;
  }
  #view-project .flow{
    display:grid;
    grid-template-columns:1fr;
    width:100%;
    height:auto;
    border-radius:28px;
    padding:16px;
    background:linear-gradient(135deg,#101217,#090a0c);
    border:1px solid rgba(216,168,78,.18);
    gap:10px;
  }
  #view-project .flow:before,
  #view-project .flow:after{
    display:none;
  }
  #view-project .flow-core{
    position:relative;
    left:auto;
    top:auto;
    transform:none;
    width:100%;
    height:auto;
    border-radius:24px;
    padding:24px;
  }
  #view-project .flow-step,
  #view-project .flow-step:nth-child(n){
    position:relative;
    left:auto;
    right:auto;
    top:auto;
    bottom:auto;
    transform:none;
    width:100%;
    height:auto;
    min-height:92px;
    border-radius:22px;
    flex-direction:row;
    justify-content:flex-start;
    text-align:left;
    padding:14px 16px;
  }
  #view-project .flow-step.active em{
    position:static;
    transform:none;
    padding:0;
    background:transparent;
    border:0;
    box-shadow:none;
    margin-left:auto;
  }
}

@media(max-width:760px){
  .project-workflow-grid{
    grid-template-columns:1fr;
  }
  .project-lyrics-panel{
    position:relative;
    top:auto;
  }
}

@media(max-width:600px){
  .project-workflow-grid{
    gap:14px;
    margin:16px 0 24px;
  }
  .project-lyrics-panel{
    padding:15px;
    border-radius:20px;
  }
  .project-lyrics-head{
    align-items:stretch;
    flex-direction:column;
  }
  .project-lyrics-edit{
    justify-content:center;
  }
  .project-lyrics-text{
    max-height:420px;
    font-size:13px;
  }
}

/* 20260807 mobile project-list rows: stop right-side cut */
@media(max-width:600px){
 .project-row{
   grid-template-columns:minmax(0,1fr) minmax(0,auto)!important;
   gap:12px!important;
   padding:14px!important;
   align-items:start!important;
 }
 .project-row .project-title-cell{
   min-width:0!important;
   overflow:hidden!important;
 }
 .project-row strong{
   overflow:hidden!important;
   text-overflow:ellipsis!important;
   white-space:nowrap!important;
 }
 .project-row .project-platform-statuses{
   flex-wrap:wrap!important;
   gap:5px!important;
 }
 .project-row .project-platform-status{
   max-width:100%!important;
   overflow:hidden!important;
   text-overflow:ellipsis!important;
 }
 .project-row .status,
 .project-row .row-cost{
   white-space:normal!important;
   min-width:0!important;
   max-width:120px!important;
   overflow-wrap:anywhere!important;
 }
 .project-row .project-row-actions{
   flex:none!important;
   gap:6px!important;
 }
}

/* playlist-premium-20260808: denser, calmer premium playlist rows */
#view-playlist .section-head{margin-bottom:18px!important;}
#view-playlist .section-head h2{font-size:18px!important;line-height:1.15!important;letter-spacing:-.025em!important;}
#view-playlist .section-head p{font-size:12px!important;line-height:1.45!important;color:#8f949d!important;}
#view-playlist .playlist-list{gap:8px!important;}
#view-playlist .playlist-row{grid-template-columns:58px minmax(0,1fr) auto!important;gap:13px!important;min-height:86px!important;padding:12px 14px!important;border-radius:18px!important;border-color:rgba(255,255,255,.075)!important;background:linear-gradient(135deg,rgba(255,255,255,.032),rgba(255,255,255,.012)),#101216!important;box-shadow:0 10px 28px rgba(0,0,0,.22)!important;}
#view-playlist .playlist-row:hover{border-color:rgba(216,168,78,.34)!important;background:linear-gradient(135deg,rgba(216,168,78,.07),rgba(255,255,255,.014)),#111318!important;}
#view-playlist .playlist-cover{width:58px!important;height:58px!important;border-radius:14px!important;}
#view-playlist .playlist-meta strong{font:800 14px/1.2 Manrope,Inter,"Sakira JP",sans-serif!important;letter-spacing:-.015em!important;color:#f7f3ea!important;}
#view-playlist .playlist-meta span,#view-playlist .playlist-meta small{margin-top:4px!important;font-size:11px!important;line-height:1.35!important;font-weight:650!important;color:#8f949d!important;}
#view-playlist .playlist-actions{gap:7px!important;}
#view-playlist .playlist-actions .song-quick-action{min-height:34px!important;padding:7px 11px!important;border-radius:999px!important;font-size:11px!important;font-weight:800!important;}
#view-playlist .playlist-actions .song-quick-action svg{width:15px!important;height:15px!important;}
#view-playlist .playlist-play-all{min-height:38px!important;padding:9px 16px!important;font-size:13px!important;border-radius:999px!important;}
@media(max-width:700px){#view-playlist .playlist-row{grid-template-columns:50px minmax(0,1fr)!important;min-height:auto!important;padding:10px!important;border-radius:15px!important;}#view-playlist .playlist-cover{width:50px!important;height:50px!important;}#view-playlist .playlist-meta strong{font-size:13px!important;}#view-playlist .playlist-meta span,#view-playlist .playlist-meta small{font-size:10.5px!important;}#view-playlist .playlist-actions{margin-top:4px!important;}}

/* playlist-premium-v2-20260808: quieter typography, tighter music-app layout */
#view-playlist{max-width:1220px;margin:0 auto;}
#view-playlist .section-head{margin-bottom:16px!important;align-items:center!important;}
#view-playlist .section-head h2{font:800 17px/1.15 Manrope,Inter,"Sakira JP",sans-serif!important;letter-spacing:-.03em!important;color:#f4f1e8!important;}
#view-playlist .section-head p{margin-top:6px!important;font:500 12px/1.45 Inter,"Sakira JP",sans-serif!important;color:#7f858f!important;letter-spacing:0!important;}
#view-playlist .playlist-list{gap:7px!important;}
#view-playlist .playlist-row{grid-template-columns:52px minmax(0,1fr) auto!important;gap:12px!important;min-height:74px!important;padding:10px 12px!important;border-radius:15px!important;border:1px solid rgba(255,255,255,.065)!important;background:linear-gradient(180deg,rgba(255,255,255,.032),rgba(255,255,255,.014)),#111317!important;box-shadow:none!important;transition:border-color .16s ease,background .16s ease,transform .16s ease!important;}
#view-playlist .playlist-row:hover{transform:translateY(-1px)!important;border-color:rgba(216,168,78,.28)!important;background:linear-gradient(180deg,rgba(216,168,78,.052),rgba(255,255,255,.014)),#121419!important;}
#view-playlist .playlist-cover{width:52px!important;height:52px!important;border-radius:12px!important;box-shadow:0 0 0 1px rgba(255,255,255,.07) inset!important;}
#view-playlist .playlist-meta{display:grid!important;gap:2px!important;min-width:0!important;}
#view-playlist .playlist-meta strong{font:750 13px/1.18 Manrope,Inter,"Sakira JP",sans-serif!important;letter-spacing:-.018em!important;color:#f2efe8!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
#view-playlist .playlist-meta span,#view-playlist .playlist-meta small{display:block!important;margin:0!important;font:500 11px/1.32 Inter,"Sakira JP",sans-serif!important;letter-spacing:0!important;color:#858b96!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
#view-playlist .playlist-meta small{color:#9a927f!important;}
#view-playlist .playlist-actions{gap:6px!important;align-items:center!important;}
#view-playlist .playlist-actions .song-quick-action{min-height:31px!important;padding:6px 10px!important;border-radius:999px!important;font:750 11px/1 Inter,"Sakira JP",sans-serif!important;letter-spacing:-.01em!important;}
#view-playlist .playlist-actions .song-quick-action svg{width:14px!important;height:14px!important;}
#view-playlist .playlist-actions .song-quick-action.secondary{background:#111419!important;border-color:rgba(255,255,255,.09)!important;color:#d9dde4!important;}
#view-playlist .playlist-play-all{min-height:36px!important;padding:8px 15px!important;font:800 12px/1 Inter,"Sakira JP",sans-serif!important;letter-spacing:-.01em!important;box-shadow:0 8px 22px rgba(216,168,78,.18)!important;}
#view-playlist .playlist-play-all svg{width:15px!important;height:15px!important;}
@media(max-width:700px){#view-playlist{max-width:none;}#view-playlist .section-head{align-items:flex-start!important;}#view-playlist .playlist-row{grid-template-columns:48px minmax(0,1fr)!important;gap:10px!important;min-height:auto!important;padding:9px 10px!important;border-radius:14px!important;}#view-playlist .playlist-cover{width:48px!important;height:48px!important;border-radius:11px!important;}#view-playlist .playlist-meta strong{font-size:12.5px!important;}#view-playlist .playlist-meta span,#view-playlist .playlist-meta small{font-size:10.5px!important;}#view-playlist .playlist-actions{grid-column:1 / -1!important;margin-top:4px!important;justify-content:flex-start!important;}}

/* playlist-icon-hover-20260808: Spotify/Apple-style compact row actions */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;}
#view-playlist .playlist-row{position:relative!important;}
#view-playlist .playlist-actions{opacity:0!important;transform:translateX(6px)!important;transition:opacity .16s ease,transform .16s ease!important;}
#view-playlist .playlist-row:hover .playlist-actions,
#view-playlist .playlist-row:focus-within .playlist-actions{opacity:1!important;transform:translateX(0)!important;}
#view-playlist .playlist-actions .playlist-icon-action{width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;padding:0!important;display:inline-grid!important;place-items:center!important;border-radius:999px!important;gap:0!important;backdrop-filter:blur(12px)!important;-webkit-backdrop-filter:blur(12px)!important;box-shadow:0 10px 24px rgba(0,0,0,.28)!important;}
#view-playlist .playlist-actions .playlist-icon-action svg{width:16px!important;height:16px!important;display:block!important;}
#view-playlist .playlist-actions .playlist-play-action{background:#f4f1e8!important;color:#08090b!important;border-color:rgba(244,241,232,.92)!important;}
#view-playlist .playlist-actions .playlist-play-action:hover{background:#ffffff!important;transform:scale(1.05)!important;}
#view-playlist .playlist-actions .playlist-remove-action{background:rgba(17,20,25,.78)!important;color:#cfd3da!important;border-color:rgba(255,255,255,.10)!important;}
#view-playlist .playlist-actions .playlist-remove-action:hover{color:#ff9b8d!important;border-color:rgba(255,155,141,.32)!important;background:rgba(42,20,18,.86)!important;}
#view-playlist .playlist-actions .playlist-icon-action:focus-visible{opacity:1!important;outline:2px solid rgba(216,168,78,.72)!important;outline-offset:3px!important;}
@media(max-width:700px){#view-playlist .playlist-actions{opacity:1!important;transform:none!important;grid-column:auto!important;margin-top:0!important;justify-content:flex-end!important;}#view-playlist .playlist-row{grid-template-columns:48px minmax(0,1fr) auto!important;}#view-playlist .playlist-actions .playlist-icon-action{width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;}}

/* playlist-search-20260808: premium filtering for saved songs */
#view-playlist .playlist-toolbar{margin:-4px 0 14px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;}
#view-playlist .playlist-search{width:min(420px,100%)!important;min-height:42px!important;display:flex!important;align-items:center!important;gap:10px!important;padding:0 14px!important;border:1px solid rgba(255,255,255,.085)!important;border-radius:999px!important;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018)),#101216!important;color:#aeb4bd!important;box-shadow:0 12px 32px rgba(0,0,0,.20)!important;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease!important;}
#view-playlist .playlist-search:focus-within{border-color:rgba(216,168,78,.44)!important;background:linear-gradient(180deg,rgba(216,168,78,.07),rgba(255,255,255,.018)),#111318!important;box-shadow:0 16px 40px rgba(0,0,0,.26),0 0 0 3px rgba(216,168,78,.10)!important;}
#view-playlist .playlist-search svg{width:16px!important;height:16px!important;flex:0 0 auto!important;color:#d8a84e!important;opacity:.9!important;}
#view-playlist .playlist-search input{width:100%!important;border:0!important;outline:0!important;background:transparent!important;color:#f4f1e8!important;font:650 13px/1 Inter,"Sakira JP",sans-serif!important;letter-spacing:-.01em!important;}
#view-playlist .playlist-search input::placeholder{color:#707782!important;}

/* project-mobile-generated-date-20260813: keep generated date visible on mobile project/song rows */
.project-mobile-generated-date{display:none!important;}
@media(max-width:600px){
  .project-row .project-mobile-generated-date{
    display:inline-flex!important;
    align-items:center!important;
    width:max-content!important;
    max-width:100%!important;
    margin-top:7px!important;
    padding:5px 9px!important;
    border-radius:999px!important;
    border:1px solid rgba(216,168,78,.24)!important;
    background:rgba(216,168,78,.08)!important;
    color:#d8c28f!important;
    font:800 11px/1.15 Inter,"Sakira JP",sans-serif!important;
    letter-spacing:.01em!important;
    white-space:normal!important;
  }
}
#view-playlist .playlist-search input:disabled{cursor:not-allowed!important;opacity:.55!important;}
#view-playlist .playlist-search-empty{border:1px dashed rgba(216,168,78,.25)!important;background:rgba(216,168,78,.045)!important;}
@media(max-width:700px){#view-playlist .playlist-toolbar{margin:0 0 12px!important;}#view-playlist .playlist-search{width:100%!important;min-height:40px!important;}}

/* tiktok review app icon visibility */.legal-brand-review{display:inline-flex!important;align-items:center!important;gap:12px!important}.legal-brand-icon{width:52px!important;height:52px!important;border-radius:16px!important;display:block!important;box-shadow:0 0 28px rgba(216,168,78,.28)!important}.legal-brand-text{font:800 18px Manrope,Inter,"Sakira JP",sans-serif!important;letter-spacing:-.02em!important;color:#fff3cf!important}.legal-brand-logo{height:38px;width:auto;display:block}


/* 20260817 one-click mode: calm default creation + release readiness */
#create-form.composer{
  gap:16px;
}
#create-form .prompt-label{
  font-size:18px!important;
  font-weight:900!important;
  color:var(--ink)!important;
}
#create-form #prompt{
  min-height:190px;
  border-radius:24px!important;
  border-color:rgba(216,168,78,.30)!important;
  background:linear-gradient(180deg,#101217,#0b0c10)!important;
  font-size:16px;
  line-height:1.65;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 20px 60px rgba(0,0,0,.28);
}
.create-advanced{
  border:1px solid rgba(216,168,78,.18);
  border-radius:18px;
  background:rgba(255,255,255,.025);
  overflow:hidden;
}
.create-advanced>summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px 16px;
  cursor:pointer;
  list-style:none;
  color:#f0eadc;
  font-weight:900;
}
.create-advanced>summary::-webkit-details-marker{display:none}
.create-advanced>summary:after{
  content:"+";
  display:inline-grid;
  place-items:center;
  width:26px;
  height:26px;
  border-radius:999px;
  border:1px solid rgba(216,168,78,.26);
  color:var(--accent);
}
.create-advanced[open]>summary:after{content:"–"}
.create-advanced>summary span{font-size:14px;letter-spacing:.01em}
.create-advanced>summary small{margin-left:auto;color:var(--muted);font-size:12px;font-weight:750;text-align:right}
.create-advanced[open]{padding-bottom:14px}
.create-advanced[open]>:not(summary){margin-left:16px;margin-right:16px}
.create-platform-fieldset{margin-top:12px}
.composer-actions .primary{
  min-height:54px;
  padding-inline:22px!important;
  border-radius:18px!important;
}
.composer-actions .primary svg{width:19px;height:19px}
.release-readiness-card{
  display:grid;
  gap:12px;
  padding:16px;
  border-radius:22px;
  border:1px solid rgba(216,168,78,.24);
  background:linear-gradient(145deg,rgba(216,168,78,.09),rgba(255,255,255,.035) 42%,rgba(0,0,0,.12));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
}
.release-readiness-head .eyebrow{margin:0 0 5px;color:var(--accent);font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.release-readiness-head h3{margin:0;color:var(--ink);font:900 18px Manrope,Inter,"Sakira JP",sans-serif}
.release-readiness-head span{display:block;margin-top:5px;color:var(--muted);font-size:12px;line-height:1.4}
.release-readiness-list{display:grid;gap:7px}
.release-readiness-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 0;border-top:1px solid rgba(255,255,255,.055)}
.release-readiness-row:first-child{border-top:0}
.release-readiness-dot{width:8px;height:8px;border-radius:50%;background:#6f7580;box-shadow:0 0 0 4px rgba(255,255,255,.035)}
.release-readiness-row.ready .release-readiness-dot{background:var(--green);box-shadow:0 0 0 4px rgba(89,189,131,.12)}
.release-readiness-row.missing .release-readiness-dot{background:#d8a84e;box-shadow:0 0 0 4px rgba(216,168,78,.11)}
.release-readiness-row strong{font-size:12px;font-weight:850;color:#ede7d9;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.release-readiness-row em{font-style:normal;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.045em;color:var(--accent);text-align:right}
.release-readiness-row.ready em{color:var(--green)}
.release-readiness-action{width:100%;justify-content:center!important;min-height:46px!important;border-radius:16px!important}
.release-readiness-action.needs-fix{background:#15171b!important;color:#f1eadc!important;border:1px solid rgba(216,168,78,.36)!important;box-shadow:none!important}
.version-workspace-publish-advanced{
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:rgba(255,255,255,.024);
  overflow:hidden;
}
.version-workspace-publish-advanced>summary{
  display:flex;
  align-items:center;
  gap:9px;
  padding:11px 13px;
  cursor:pointer;
  list-style:none;
  color:#ede7d9;
  font-size:13px;
  font-weight:900;
}
.version-workspace-publish-advanced>summary::-webkit-details-marker{display:none}
.version-workspace-publish-advanced>summary:after{content:"+";margin-left:auto;color:var(--accent);font-size:18px;line-height:1}
.version-workspace-publish-advanced[open]>summary:after{content:"–"}
.version-workspace-publish-advanced summary small{display:block;color:var(--muted);font-size:10px;font-weight:750;line-height:1.2}
.version-workspace-publish-advanced-list{display:grid;gap:8px;padding:0 10px 10px}
/* n 1598 : envois TikTok restants, sous le bouton */
.tiktok-envois-restants{display:block;margin:-4px 2px 2px;font-size:12px;line-height:1.35;color:var(--muted,#6b7280)}
.tiktok-envois-restants.tiktok-envois-epuises{color:var(--danger,#b91c1c);font-weight:600}
@media(max-width:700px){
  .create-advanced>summary{align-items:flex-start;flex-direction:column}.create-advanced>summary small{margin-left:0;text-align:left}.create-advanced>summary:after{position:absolute;right:16px}
}

/* 20260817 publish everywhere confirmation polish */
.publish-everywhere-dialog::backdrop{
  background:rgba(0,0,0,.74);
  backdrop-filter:blur(16px) saturate(.86);
}
.publish-everywhere-dialog{
  padding:0;
  border:0;
  background:transparent;
  overflow:visible;
}
.publish-everywhere-card{
  position:relative;
  box-sizing:border-box;
  width:min(520px,calc(100vw - 32px));
  gap:18px;
  padding:30px 32px 26px;
  text-align:left;
  border-radius:28px;
  border:1px solid rgba(216,168,78,.22);
  background:
    radial-gradient(circle at 18% 0%,rgba(216,168,78,.12),transparent 34%),
    linear-gradient(180deg,rgba(20,22,25,.98),rgba(11,12,14,.98));
  box-shadow:0 34px 90px rgba(0,0,0,.72),0 0 0 1px rgba(255,255,255,.04) inset;
}
.publish-everywhere-card .profile-close{
  top:16px;
  right:16px;
  border-color:rgba(216,168,78,.24);
  background:rgba(255,255,255,.035);
  color:rgba(255,246,226,.78);
}
.publish-everywhere-head{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:16px;
  align-items:start;
  padding-right:28px;
}
.publish-everywhere-mark{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:18px;
  color:#fff6db;
  background:linear-gradient(135deg,rgba(216,168,78,.9),rgba(127,82,28,.78));
  box-shadow:0 14px 34px rgba(216,168,78,.18);
}
.publish-everywhere-mark svg{width:20px;height:20px}
.publish-everywhere-card h2{
  margin:0 0 6px;
  color:#fff7e8;
  font-size:clamp(24px,3.2vw,32px);
  line-height:1.05;
  letter-spacing:-.045em;
  text-align:left;
}
.publish-everywhere-copy{
  max-width:360px;
  margin:0;
  color:rgba(235,229,216,.68);
  font-size:14px;
  line-height:1.55;
  text-align:left;
}
.publish-everywhere-list{
  display:grid;
  gap:8px;
  margin:2px 0 4px;
}
.publish-everywhere-row{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  min-height:50px;
  padding:10px 13px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.075);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.022));
}
.publish-everywhere-row.ready{
  border-color:rgba(216,168,78,.18);
  background:linear-gradient(180deg,rgba(216,168,78,.08),rgba(255,255,255,.025));
}
.publish-everywhere-row.muted{
  opacity:.72;
}
.publish-everywhere-row .platform-symbol{
  width:28px;
  height:28px;
  padding:5px;
  border-radius:10px;
  background:rgba(0,0,0,.28);
}
.publish-everywhere-row span{
  text-align:left;
  min-width:0;
  color:#f4efe3;
  font-weight:850;
  letter-spacing:-.015em;
}
.publish-everywhere-row strong{
  padding:5px 8px;
  border-radius:999px;
  border:1px solid rgba(216,168,78,.18);
  color:#d8a84e;
  background:rgba(216,168,78,.08);
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.publish-everywhere-row.ready strong{
  border-color:rgba(112,215,146,.22);
  color:#8ce0a7;
  background:rgba(112,215,146,.08);
}
.publish-everywhere-actions{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  align-items:center;
  margin-top:2px;
}
.publish-everywhere-actions .primary{
  justify-content:center;
  min-height:48px;
  border-radius:16px;
  border:1px solid rgba(255,221,139,.35)!important;
  background:linear-gradient(135deg,rgba(224,174,79,.96),rgba(143,91,29,.92))!important;
  color:#120d08!important;
  font-size:15px;
  font-weight:950;
  box-shadow:0 18px 34px rgba(216,168,78,.18);
}
.publish-everywhere-actions .secondary{
  min-height:48px;
  padding:0 16px;
  border-radius:16px;
  border-color:rgba(255,255,255,.08)!important;
  background:rgba(255,255,255,.035)!important;
  color:rgba(255,246,226,.82)!important;
}
@media(max-width:560px){
  .publish-everywhere-card{padding:26px 20px 22px}
  .publish-everywhere-head{grid-template-columns:1fr;padding-right:36px;gap:12px}
  .publish-everywhere-mark{width:42px;height:42px;border-radius:16px}
  .publish-everywhere-actions{grid-template-columns:1fr}
  .publish-everywhere-actions .secondary{width:100%;justify-content:center}
}


/* 20260817 publish dialog: one consistent hover/focus language */
.publish-everywhere-card button{
  transition:border-color .18s ease,background .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.publish-everywhere-card button:not(:disabled):hover,
.publish-everywhere-card button:not(:disabled):focus-visible{
  transform:translateY(-1px);
  border-color:rgba(216,168,78,.58)!important;
  box-shadow:0 16px 34px rgba(216,168,78,.16),0 0 0 1px rgba(216,168,78,.12) inset;
  outline:none;
}
.publish-everywhere-actions .primary:not(:disabled):hover,
.publish-everywhere-actions .primary:not(:disabled):focus-visible{
  background:linear-gradient(135deg,rgba(232,188,99,.98),rgba(160,101,31,.96))!important;
  color:#120d08!important;
}
.publish-everywhere-actions .secondary:not(:disabled):hover,
.publish-everywhere-actions .secondary:not(:disabled):focus-visible,
.publish-everywhere-card .profile-close:not(:disabled):hover,
.publish-everywhere-card .profile-close:not(:disabled):focus-visible{
  background:rgba(216,168,78,.10)!important;
  color:#fff4d9!important;
}

/* 20260902 release everywhere premium account-selection cards */
.publish-everywhere-dialog{
  max-width:100vw;
  max-height:100dvh;
  width:min(640px,calc(100vw - 40px));
  box-sizing:border-box;
}
.publish-everywhere-dialog .publish-everywhere-card{
  width:100%;
  max-height:calc(100dvh - 24px);
  overflow:hidden;
}
.publish-everywhere-dialog .publish-everywhere-list{
  max-height:min(54vh,520px);
  overflow-y:auto;
  overflow-x:hidden;
  padding:2px 2px 4px;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
.publish-everywhere-dialog .publish-everywhere-row{
  grid-template-columns:34px minmax(0,1fr) auto;
  align-items:start;
  gap:12px;
  padding:13px;
  border-radius:20px;
  border-color:rgba(216,168,78,.16);
  background:
    radial-gradient(circle at 0% 0%,rgba(216,168,78,.13),transparent 40%),
    linear-gradient(180deg,rgba(25,23,19,.94),rgba(10,11,13,.96));
  box-shadow:0 16px 38px rgba(0,0,0,.22),0 0 0 1px rgba(255,255,255,.035) inset;
}
.publish-everywhere-dialog .publish-everywhere-row.ready{
  border-color:rgba(216,168,78,.32);
  background:
    radial-gradient(circle at 0% 0%,rgba(232,188,99,.18),transparent 42%),
    linear-gradient(180deg,rgba(31,27,20,.98),rgba(10,11,13,.98));
}
.publish-everywhere-dialog .publish-everywhere-row>.platform-symbol{
  width:34px;
  height:34px;
  box-sizing:border-box;
  border:1px solid rgba(216,168,78,.20);
  border-radius:13px;
  background:rgba(0,0,0,.36);
  box-shadow:0 10px 20px rgba(0,0,0,.20);
}
.publish-everywhere-dialog .publish-everywhere-row>span{
  align-self:center;
  font-size:15px;
  line-height:1.2;
  color:#fff6e4;
}
.publish-everywhere-dialog .publish-everywhere-row>strong{
  align-self:center;
  justify-self:end;
  max-width:100%;
  white-space:nowrap;
}
.publish-everywhere-dialog .publish-everywhere-row .publication-account-field{
  grid-column:2 / -1;
  width:100%;
  min-width:0;
  margin:1px 0 0!important;
  padding:10px;
  border:1px solid rgba(216,168,78,.12);
  border-radius:16px;
  background:rgba(0,0,0,.20);
  box-sizing:border-box;
}
.publish-everywhere-dialog .publication-account-field>span{
  display:block;
  margin:0 0 8px;
  color:#d6c49c!important;
  font-size:10px!important;
  font-weight:950!important;
  letter-spacing:.09em!important;
  text-transform:uppercase!important;
}
.magic-platform .magic-account-checklist,
.publish-everywhere-dialog .publication-account-choices{
  gap:8px!important;
  margin-top:0!important;
  min-width:0;
}
.magic-platform .magic-account-checklist .publication-account-choice,
.publish-everywhere-dialog .publication-account-choice{
  display:grid!important;
  grid-template-columns:20px minmax(0,1fr) auto;
  align-items:center!important;
  min-width:0;
  min-height:52px;
  gap:10px!important;
  padding:9px 11px!important;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018));
  color:#f4ead5!important;
  box-shadow:0 10px 22px rgba(0,0,0,.16);
  transition:border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease;
}
.magic-platform .magic-account-checklist .publication-account-choice:has(input[type="checkbox"]:checked),
.publish-everywhere-dialog .publication-account-choice:has(input[type="checkbox"]:checked){
  border-color:rgba(232,188,99,.72);
  background:
    linear-gradient(180deg,rgba(216,168,78,.18),rgba(216,168,78,.055)),
    rgba(255,255,255,.025);
  box-shadow:0 14px 30px rgba(216,168,78,.12),0 0 0 1px rgba(255,231,170,.12) inset;
}
.publish-everywhere-dialog .publication-account-choice:hover,
.magic-platform .magic-account-checklist .publication-account-choice:hover,
.magic-platform .magic-account-checklist .publication-account-choice:focus-within,
.publish-everywhere-dialog .publication-account-choice:focus-within{
  transform:translateY(-1px);
  border-color:rgba(216,168,78,.58);
}
.magic-platform .magic-account-checklist .publication-account-choice input[type="checkbox"],
.publish-everywhere-dialog .publication-account-choice input[type="checkbox"]{
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  display:grid;
  place-items:center;
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  min-height:20px!important;
  padding:0!important;
  margin:0!important;
  border:1px solid rgba(216,168,78,.62);
  border-radius:7px;
  background:rgba(5,6,8,.94);
  box-shadow:0 0 0 1px rgba(255,255,255,.05) inset;
  accent-color:#d8a84e;
}
.magic-platform .magic-account-checklist .publication-account-choice input[type="checkbox"]::after,
.publish-everywhere-dialog .publication-account-choice input[type="checkbox"]::after{
  content:"";
  width:5px;
  height:9px;
  border:solid #151009;
  border-width:0 2px 2px 0;
  transform:translateY(-1px) rotate(45deg) scale(0);
  transform-origin:center;
  transition:transform .14s ease;
}
.magic-platform .magic-account-checklist .publication-account-choice input[type="checkbox"]:checked,
.publish-everywhere-dialog .publication-account-choice input[type="checkbox"]:checked{
  border-color:#f2c76d;
  background:linear-gradient(135deg,#fee7ad,#d8a84e 70%,#a96b24);
  box-shadow:0 0 0 3px rgba(216,168,78,.16),0 7px 18px rgba(216,168,78,.18);
}
.publish-everywhere-dialog .publication-account-choice input[type="checkbox"]:checked::after{transform:translateY(-1px) rotate(45deg) scale(1)}
.magic-platform .magic-account-checklist .publication-account-choice input[type="checkbox"]:checked::after{transform:translateY(-1px) rotate(45deg) scale(1)}
.magic-platform .magic-account-checklist .publication-account-choice input[type="checkbox"]:focus-visible,
.publish-everywhere-dialog .publication-account-choice input[type="checkbox"]:focus-visible{
  outline:0;
  box-shadow:0 0 0 4px rgba(216,168,78,.22),0 7px 18px rgba(216,168,78,.18);
}
.magic-platform .magic-account-checklist .publication-account-copy,
.publish-everywhere-dialog .publication-account-copy{
  display:grid!important;
  gap:2px;
  min-width:0;
  overflow:hidden;
}
.publish-everywhere-dialog .publication-account-copy strong,
.magic-platform .magic-account-checklist .publication-account-copy strong,
.magic-platform .magic-account-checklist .publication-account-copy small,
.publish-everywhere-dialog .publication-account-copy small{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:left;
}
.magic-platform .magic-account-checklist .publication-account-copy strong,
.publish-everywhere-dialog .publication-account-copy strong{
  color:#fff8e9;
  font-size:13px;
  font-weight:900;
  letter-spacing:-.01em;
}
.magic-platform .magic-account-checklist .publication-account-copy small,
.publish-everywhere-dialog .publication-account-copy small{
  color:rgba(232,220,191,.70);
  font-size:11px;
  font-weight:700;
}
@media(max-width:560px){
  .publish-everywhere-dialog .publish-everywhere-card{
    width:100%;
    max-height:calc(100dvh - 12px);
    padding:22px 14px 16px;
    border-radius:24px;
  }
  .publish-everywhere-dialog .publish-everywhere-list{max-height:min(42vh,360px)}
  .publish-everywhere-dialog .publish-everywhere-row{
    grid-template-columns:30px minmax(0,1fr);
    gap:10px;
    padding:11px;
    border-radius:18px;
  }
  .publish-everywhere-dialog .publish-everywhere-row>.platform-symbol{width:30px;height:30px;border-radius:12px}
  .publish-everywhere-dialog .publish-everywhere-row>span{font-size:14px}
  .publish-everywhere-dialog .publish-everywhere-row>strong{
    grid-column:2;
    justify-self:start;
    white-space:normal;
    font-size:9.5px;
    line-height:1.2;
  }
  .publish-everywhere-dialog .publish-everywhere-row .publication-account-field{
    grid-column:1 / -1;
    padding:9px;
  }
  .publish-everywhere-dialog .publication-account-choice{
    min-height:48px;
    padding:8px 9px!important;
  }
}
@media(max-width:340px){
  .publish-everywhere-dialog .publication-account-choice{grid-template-columns:18px minmax(0,1fr) auto;gap:8px!important}
  .publish-everywhere-dialog .publication-account-choice input[type="checkbox"]{width:18px!important;height:18px!important;min-width:18px!important;min-height:18px!important}
  .publish-everywhere-dialog .publication-account-copy strong{font-size:12px}
  .publish-everywhere-dialog .publication-account-copy small{font-size:10px}
}

/* 20260902 Facebook Page chooser after Meta multi-page OAuth */
.facebook-page-dialog::backdrop{
  background:rgba(0,0,0,.76);
  backdrop-filter:blur(14px) saturate(.9);
}
.facebook-page-dialog{width:min(620px,calc(100vw - 28px));max-width:100vw;max-height:100dvh;padding:0;border:0;background:transparent}
.facebook-page-dialog .facebook-page-card{
  display:grid;gap:15px;width:100%;max-height:calc(100dvh - 24px);overflow:auto;
  padding:28px 22px 20px!important;border:1px solid rgba(216,168,78,.32)!important;border-radius:28px!important;
  background:radial-gradient(circle at 16% 0%,rgba(24,119,242,.24),transparent 36%),radial-gradient(circle at 92% 4%,rgba(216,168,78,.18),transparent 32%),linear-gradient(180deg,rgba(18,19,24,.98),rgba(8,9,12,.98))!important;
  box-shadow:0 30px 90px rgba(0,0,0,.62),0 0 0 1px rgba(255,255,255,.04) inset!important;
}
.facebook-page-head{display:grid;grid-template-columns:42px minmax(0,1fr);align-items:start;gap:13px}.facebook-page-head h2{margin:2px 0 4px!important;text-align:left!important;color:#fff6e4;font-size:22px!important;line-height:1.08!important}.facebook-page-head .eyebrow,.facebook-page-head .facebook-page-intro{text-align:left!important}.facebook-page-status{padding:10px 12px;border:1px solid rgba(216,168,78,.14);border-radius:16px;background:rgba(0,0,0,.24);color:#e8d8b7;font-size:13px}.facebook-page-list{display:grid;gap:8px;margin:0}.facebook-page-dialog .facebook-page-choice{display:grid!important;grid-template-columns:20px minmax(0,1fr);align-items:center!important;gap:10px!important;min-height:54px;padding:10px!important;border:1px solid rgba(255,255,255,.09);border-radius:15px;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.018));color:#f5ecd9!important;cursor:pointer}.facebook-page-dialog .facebook-page-choice:has(input[type="checkbox"]:checked){border-color:rgba(232,188,99,.72);background:linear-gradient(180deg,rgba(24,119,242,.2),rgba(216,168,78,.09)),rgba(255,255,255,.025);box-shadow:0 14px 30px rgba(24,119,242,.1),0 0 0 1px rgba(255,231,170,.12) inset}.facebook-page-dialog .facebook-page-choice input[type="checkbox"]{width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important;margin:0!important;accent-color:#d8a84e}.facebook-page-dialog .publication-account-copy strong{color:#fff7e8}.facebook-page-dialog .facebook-page-choice:has(input[type="checkbox"]:checked) .publication-account-copy strong{color:#ffd56c}
@media(max-width:600px){.facebook-page-dialog .facebook-page-card{padding:20px 16px 16px!important;border-radius:24px!important}.facebook-page-head{grid-template-columns:1fr}.facebook-page-dialog .lyrics-actions{grid-template-columns:1fr}}

/* 20260902 immediate advanced publication account dialog polish */
.immediate-publication-account-dialog::backdrop{
  background:rgba(0,0,0,.74);
  backdrop-filter:blur(14px) saturate(.9);
}
.immediate-publication-account-dialog{
  width:min(540px,calc(100vw - 28px));
  max-width:100vw;
  max-height:100dvh;
  padding:0;
  border:0;
  background:transparent;
}
.immediate-publication-account-dialog .immediate-publication-account-card{
  position:relative;
  display:grid;
  gap:15px;
  width:100%;
  max-height:calc(100dvh - 24px);
  overflow:auto;
  padding:28px 22px 20px!important;
  border:1px solid rgba(216,168,78,.28)!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 16% 0%,rgba(216,168,78,.22),transparent 38%),
    linear-gradient(180deg,rgba(19,18,16,.98),rgba(8,9,12,.98))!important;
  box-shadow:0 30px 90px rgba(0,0,0,.62),0 0 0 1px rgba(255,255,255,.04) inset!important;
}
.immediate-publication-head{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:start;
  gap:13px;
}
.immediate-publication-head h2{
  margin:2px 0 4px!important;
  text-align:left!important;
  color:#fff6e4;
  font-size:22px!important;
  line-height:1.08!important;
}
.immediate-publication-head .eyebrow,
.immediate-publication-head .schedule-platform-hint{
  text-align:left!important;
}
.immediate-publication-account-dialog .youtube-privacy-field,
.immediate-publication-account-dialog .publication-account-field{
  margin:0!important;
  padding:12px;
  border:1px solid rgba(216,168,78,.14);
  border-radius:18px;
  background:rgba(0,0,0,.22);
}
.immediate-publication-account-dialog .publication-account-field>span{
  display:block;
  margin:0 0 9px;
  color:#d6c49c!important;
  font-size:10px!important;
  font-weight:950!important;
  letter-spacing:.09em!important;
  text-transform:uppercase!important;
}
.immediate-publication-account-dialog .publication-account-choices{
  display:grid;
  gap:8px!important;
  min-width:0;
  margin:0!important;
}
.immediate-publication-account-dialog .publication-account-choice{
  display:grid!important;
  grid-template-columns:20px minmax(0,1fr) auto;
  align-items:center!important;
  min-width:0;
  min-height:54px;
  gap:10px!important;
  padding:9px 10px!important;
  border:1px solid rgba(255,255,255,.09);
  border-radius:15px;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.018));
  color:#f5ecd9!important;
  box-shadow:0 10px 24px rgba(0,0,0,.16);
}
.immediate-publication-account-dialog .publication-account-choice:has(input[type="checkbox"]:checked){
  border-color:rgba(232,188,99,.72);
  background:linear-gradient(180deg,rgba(216,168,78,.18),rgba(216,168,78,.055)),rgba(255,255,255,.025);
  box-shadow:0 14px 30px rgba(216,168,78,.12),0 0 0 1px rgba(255,231,170,.12) inset;
}
.immediate-publication-account-dialog .publication-account-choice input[type="checkbox"]{
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  display:grid;
  place-items:center;
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  min-height:20px!important;
  padding:0!important;
  margin:0!important;
  border:1px solid rgba(216,168,78,.62);
  border-radius:7px;
  background:rgba(5,6,8,.94);
}
.immediate-publication-account-dialog .publication-account-choice input[type="checkbox"]::after{
  content:"";
  width:5px;
  height:9px;
  border:solid #151009;
  border-width:0 2px 2px 0;
  transform:translateY(-1px) rotate(45deg) scale(0);
}
.immediate-publication-account-dialog .publication-account-choice input[type="checkbox"]:checked{
  border-color:#f2c76d;
  background:linear-gradient(135deg,#fee7ad,#d8a84e 70%,#a96b24);
  box-shadow:0 0 0 3px rgba(216,168,78,.16),0 7px 18px rgba(216,168,78,.18);
}
.immediate-publication-account-dialog .publication-account-choice input[type="checkbox"]:checked::after{transform:translateY(-1px) rotate(45deg) scale(1)}
.immediate-publication-account-dialog .publication-account-copy{
  display:grid!important;
  gap:2px;
  min-width:0;
  overflow:hidden;
}
.immediate-publication-account-dialog .publication-account-copy strong,
.immediate-publication-account-dialog .publication-account-copy small{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:left;
}
.immediate-publication-account-dialog .publication-account-copy strong{color:#fff8e9;font-size:13px;font-weight:900;letter-spacing:-.01em}
.immediate-publication-account-dialog .publication-account-copy small{color:rgba(232,220,191,.72);font-size:11px;font-weight:700}
.immediate-publication-account-dialog .publication-account-remove{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:32px;
  padding:7px 9px;
  border:1px solid rgba(255,112,112,.28);
  border-radius:999px;
  background:rgba(255,112,112,.075);
  color:#ffc8ba!important;
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}
.immediate-publication-account-dialog .publication-account-remove svg{width:13px;height:13px}
.immediate-publication-account-dialog .immediate-publication-account-tools{
  display:flex;
  justify-content:flex-start;
  margin-top:-5px;
}
.immediate-publication-add-account{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:38px;
  padding:9px 13px!important;
  border-color:rgba(216,168,78,.34)!important;
  background:rgba(216,168,78,.09)!important;
  color:#f4d28e!important;
  font-size:12px!important;
  font-weight:950!important;
  border-radius:999px!important;
}
.immediate-publication-add-account svg{width:15px;height:15px}
.immediate-publication-account-dialog .publication-account-empty{
  display:grid;
  gap:7px;
  justify-items:start;
  padding:14px;
  border:1px dashed rgba(216,168,78,.32);
  border-radius:16px;
  background:rgba(216,168,78,.06);
}
.immediate-publication-account-dialog .publication-account-empty strong{color:#fff6e4;font-weight:900}
.immediate-publication-account-dialog .publication-account-empty small{color:#d6c49c;line-height:1.4}
.immediate-publication-account-dialog .lyrics-actions{
  display:grid!important;
  grid-template-columns:1fr;
  gap:9px;
  margin-top:1px!important;
}
.immediate-publication-account-dialog .lyrics-actions .primary{
  display:flex!important;
  align-items:center;
  width:100%;
  min-width:0;
  min-height:48px;
  justify-content:center;
  gap:8px;
  overflow:visible;
  white-space:normal;
  line-height:1.15;
  padding-inline:18px!important;
  border-radius:17px!important;
}
.immediate-publication-account-dialog .lyrics-actions .primary .platform-symbol{
  flex:0 0 24px;
}
.immediate-publication-account-dialog .lyrics-actions .primary span:not(.platform-symbol){
  flex:0 1 auto;
  min-width:0;
  max-width:calc(100% - 32px);
  overflow:visible;
  text-overflow:clip;
  white-space:normal;
}
.immediate-publication-account-dialog .lyrics-actions .secondary{
  min-height:42px;
  justify-content:center;
}
@media(max-width:420px){
  .immediate-publication-account-dialog{width:calc(100vw - 14px)}
  .immediate-publication-account-dialog .immediate-publication-account-card{padding:22px 13px 15px!important;border-radius:23px!important;gap:12px}
  .immediate-publication-head{grid-template-columns:34px minmax(0,1fr);gap:10px}
  .immediate-publication-head h2{font-size:19px!important}
  .immediate-publication-account-dialog .publication-account-choice{grid-template-columns:18px minmax(0,1fr) auto;gap:8px!important;padding:8px!important}
  .immediate-publication-account-dialog .publication-account-choice input[type="checkbox"]{width:18px!important;height:18px!important;min-width:18px!important;min-height:18px!important}
  .immediate-publication-account-dialog .publication-account-remove span{display:none}
  .immediate-publication-account-dialog .publication-account-remove{min-width:32px;padding:7px!important}
}

/* 20260817 sidebar account menu: keep language/signout, add gold border hover to other rows */
.account-menu button,
.account-menu-language,
.account-menu-theme{
  font-family:Inter,"Sakira JP",sans-serif!important;
  font-size:14px!important;
  font-weight:700!important;
  letter-spacing:0!important;
  background:transparent!important;
  box-sizing:border-box!important;
}
.account-menu button:not(#logout):not([data-lang]):not([data-theme-choice]){
  color:#aeb4bd!important;
  border:1px solid transparent!important;
}
.account-menu button:not(#logout):not([data-lang]):not([data-theme-choice]):hover,
.account-menu button:not(#logout):not([data-lang]):not([data-theme-choice]):focus-visible{
  background:rgba(216,168,78,.10)!important;
  border-color:rgba(216,168,78,.58)!important;
  color:#f2d18b!important;
  box-shadow:none!important;
  outline:none;
}
.account-menu-language,
.account-menu-theme{
  color:var(--ink)!important;
}
.account-menu-language:hover,
.account-menu-theme:hover{
  background:#252119!important;
  color:var(--ink)!important;
}
.account-menu #logout{
  color:#f2d18b!important;
  border:1px solid transparent!important;
}
.account-menu #logout:hover,
.account-menu #logout:focus-visible{
  background:#252119!important;
  color:#f2d18b!important;
  border-color:transparent!important;
  box-shadow:none!important;
  outline:none;
}
.account-menu .language-switch,
.account-menu .theme-switch{
  background:#121419!important;
  border-color:var(--line)!important;
  box-shadow:none!important;
}
.account-menu .language-switch button,
.account-menu .theme-switch button{
  border:0!important;
  color:var(--muted)!important;
  background:transparent!important;
  box-shadow:none!important;
  font-size:11px!important;
  font-weight:700!important;
}
.account-menu .language-switch button.active,
.account-menu .theme-switch button.active,
.account-menu .language-switch button:hover,
.account-menu .theme-switch button:hover,
.account-menu .language-switch button:focus-visible,
.account-menu .theme-switch button:focus-visible,
:root[data-theme="gold"] .account-menu .language-switch button.active,
:root[data-theme="gold"] .account-menu .theme-switch button.active,
:root[data-theme="gold"] .account-menu .language-switch button:hover,
:root[data-theme="gold"] .account-menu .theme-switch button:hover{
  background:var(--accent)!important;
  color:#090a0c!important;
  -webkit-text-fill-color:#090a0c!important;
  text-shadow:none!important;
  box-shadow:none!important;
  outline:none;
}

/* 20260905 account menu height: internal scrolling + add-account near account trigger */
.account-menu{
  max-height:min(580px,calc(100dvh - 150px));
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.account-menu .account-switch-option{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.account-add-near-trigger{
  width:min(188px,100%);
  min-height:34px;
  margin:8px auto 0;
  padding:7px 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid rgba(216,168,78,.30);
  border-radius:999px;
  background:rgba(216,168,78,.08);
  color:#f2d18b;
  font:800 12px/1 Inter,"Sakira JP",sans-serif;
  letter-spacing:.01em;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.account-add-near-trigger span[aria-hidden="true"]{
  display:inline-grid;
  place-items:center;
  width:18px;
  height:18px;
  border-radius:999px;
  background:rgba(216,168,78,.16);
  font-size:16px;
  font-weight:900;
  line-height:1;
  transform:translateY(-1px);
}
.account-add-near-trigger:hover,
.account-add-near-trigger:focus-visible{
  background:rgba(216,168,78,.14);
  border-color:rgba(216,168,78,.62);
  color:#fff4d6;
  outline:none;
  box-shadow:0 0 0 3px rgba(216,168,78,.12),inset 0 1px 0 rgba(255,255,255,.06);
}
@media(max-width:600px){
  .account-menu{
    max-height:calc(100dvh - 112px - env(safe-area-inset-bottom,0px));
  }
  .account-add-near-trigger{
    position:absolute;
    right:-4px;
    top:-6px;
    z-index:2;
    width:24px!important;
    min-width:24px!important;
    height:24px!important;
    min-height:24px!important;
    margin:0!important;
    padding:0!important;
    border-radius:999px!important;
    border-color:rgba(216,168,78,.68)!important;
    background:#d8a84e!important;
    color:#090a0c!important;
    box-shadow:0 0 0 2px #0d0f12,0 8px 18px rgba(0,0,0,.34)!important;
  }
  .account-add-near-trigger .account-add-label{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
  }
  .account-add-near-trigger span[aria-hidden="true"]{
    width:auto;
    height:auto;
    background:transparent;
    font-size:18px;
    color:inherit;
  }
}

/* 20260817 profile includes account details */
.profile-account-summary{
  display:grid;
  gap:8px;
  width:100%;
  margin:4px 0 2px;
}
.profile-account-summary>div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:10px 12px;
  border:1px solid rgba(216,168,78,.16);
  border-radius:14px;
  background:rgba(255,255,255,.035);
}
.profile-account-summary span{
  color:#8f98a6;
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.profile-account-summary strong{
  color:#f5efe4;
  font-size:13px;
  font-weight:850;
  text-align:right;
  max-width:220px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
@media(max-width:640px){
  .profile-account-summary>div{align-items:flex-start;flex-direction:column;gap:4px}
  .profile-account-summary strong{text-align:left;max-width:100%}
}

/* 20260817 profile dialog calm hover polish */
#profile-dialog .profile-card button,
#profile-dialog .profile-account-summary > div,
#profile-dialog .profile-meta,
#profile-dialog .voice-item{
  transition:border-color .18s ease,background-color .18s ease,box-shadow .18s ease,transform .18s ease,color .18s ease;
}
#profile-dialog .profile-account-summary > div:hover,
#profile-dialog .profile-meta:hover,
#profile-dialog .voice-item:hover{
  border-color:rgba(255,255,255,.14)!important;
  background:rgba(255,255,255,.045)!important;
  box-shadow:none!important;
  transform:none!important;
}
#profile-dialog .voice-library-actions .secondary:hover,
#profile-dialog .voice-item-actions .secondary:hover,
#profile-dialog .voice-item-actions button:hover{
  border-color:rgba(216,168,78,.32)!important;
  background:#181a20!important;
  color:#f0d69a!important;
  box-shadow:none!important;
  transform:none!important;
}
#profile-dialog .voice-delete:hover{
  border-color:rgba(248,113,113,.42)!important;
  background:#1b1719!important;
  color:#ffb4b4!important;
  box-shadow:none!important;
  transform:none!important;
}
#profile-dialog .primary:hover,
#profile-dialog .profile-save:hover,
#profile-dialog .voice-library-actions .primary:hover{
  background:#e0ad55!important;
  color:#111318!important;
  box-shadow:none!important;
  transform:none!important;
  filter:none!important;
}
#profile-dialog .profile-close:hover{
  border-color:rgba(255,255,255,.16)!important;
  background:rgba(255,255,255,.055)!important;
  color:#f4f1e8!important;
  box-shadow:none!important;
  transform:none!important;
}


/* 20260817 profile buttons: match artwork preview actions */
#profile-dialog .voice-library-actions button,
#profile-dialog .voice-item-actions button,
#profile-dialog .profile-save{
  min-width:118px!important;
  min-height:44px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  padding:10px 13px!important;
  border-radius:13px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  background:rgba(255,255,255,.045)!important;
  color:#f7ead0!important;
  box-shadow:0 10px 28px rgba(0,0,0,.22)!important;
  font-size:12px!important;
  font-weight:900!important;
  line-height:1!important;
  white-space:nowrap!important;
  transform:none!important;
  filter:none!important;
}
#profile-dialog .voice-library-actions button svg,
#profile-dialog .voice-item-actions button svg,
#profile-dialog .profile-save svg{
  width:16px!important;
  height:16px!important;
  flex:0 0 16px!important;
  padding:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#profile-dialog .voice-library-actions .primary,
#profile-dialog .profile-save{
  border-color:rgba(216,168,78,.58)!important;
  background:linear-gradient(135deg,rgba(216,168,78,.18),rgba(255,255,255,.045))!important;
  color:#ffe7ae!important;
}
#profile-dialog .voice-library-actions .primary svg,
#profile-dialog .profile-save svg,
#profile-dialog .voice-item-actions .secondary svg{
  color:#d8a84e!important;
}
#profile-dialog .voice-delete{
  min-width:44px!important;
  width:44px!important;
  border-color:rgba(255,120,120,.38)!important;
  color:#ffd5cf!important;
}
#profile-dialog .voice-delete svg{color:#ff8f81!important;}
#profile-dialog .voice-library-actions button:hover,
#profile-dialog .voice-library-actions button:focus-visible,
#profile-dialog .voice-item-actions button:hover,
#profile-dialog .voice-item-actions button:focus-visible,
#profile-dialog .profile-save:hover,
#profile-dialog .profile-save:focus-visible{
  border-color:rgba(246,213,139,.72)!important;
  background:linear-gradient(145deg,rgba(216,168,78,.22),rgba(255,255,255,.06))!important;
  color:#ffe7ae!important;
  box-shadow:0 10px 28px rgba(0,0,0,.22)!important;
  transform:translateY(-1px)!important;
  outline:none!important;
}
#profile-dialog .voice-delete:hover,
#profile-dialog .voice-delete:focus-visible{
  border-color:rgba(255,120,120,.48)!important;
  background:rgba(255,120,120,.10)!important;
  color:#ffd5cf!important;
}


/* 20260817 profile buttons: fix blending on dark panel */
#profile-dialog .voice-library-actions button,
#profile-dialog .voice-item-actions button,
#profile-dialog .profile-save{
  background:linear-gradient(180deg,#202228,#17191f)!important;
  border-color:rgba(255,255,255,.20)!important;
  color:#f7ead0!important;
  box-shadow:0 12px 30px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.055)!important;
}
#profile-dialog .voice-library-actions .primary,
#profile-dialog .profile-save{
  border-color:rgba(246,213,139,.70)!important;
  background:linear-gradient(145deg,rgba(216,168,78,.30),rgba(83,62,31,.30) 48%,rgba(255,255,255,.055))!important;
  color:#fff2c7!important;
  box-shadow:0 14px 34px rgba(0,0,0,.36),0 0 0 1px rgba(216,168,78,.10),inset 0 1px 0 rgba(255,255,255,.10)!important;
}
#profile-dialog .voice-library-actions .secondary{
  border-color:rgba(255,255,255,.18)!important;
  background:linear-gradient(180deg,#202228,#17191f)!important;
  color:#f7ead0!important;
}
#profile-dialog .voice-item{
  background:#121419!important;
  border-color:rgba(255,255,255,.10)!important;
}
#profile-dialog .voice-item-actions button{
  min-width:104px!important;
  background:linear-gradient(180deg,#24262d,#1a1c22)!important;
  border-color:rgba(255,255,255,.18)!important;
}
#profile-dialog .voice-delete{
  min-width:44px!important;
  background:linear-gradient(180deg,#24262d,#1a1c22)!important;
  border-color:rgba(255,120,120,.42)!important;
}
#profile-dialog .voice-library-actions button:hover,
#profile-dialog .voice-library-actions button:focus-visible,
#profile-dialog .voice-item-actions button:hover,
#profile-dialog .voice-item-actions button:focus-visible,
#profile-dialog .profile-save:hover,
#profile-dialog .profile-save:focus-visible{
  border-color:rgba(246,213,139,.82)!important;
  background:linear-gradient(145deg,rgba(216,168,78,.28),rgba(35,30,23,.96))!important;
  color:#fff4d2!important;
  box-shadow:0 14px 34px rgba(0,0,0,.38),0 0 0 1px rgba(216,168,78,.14),inset 0 1px 0 rgba(255,255,255,.08)!important;
}


/* 20260817 profile voice delete bin icon */
#profile-dialog .voice-delete svg{
  display:block!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}


/* 20260818 short fold first-open layout fix */
.version-workspace-panel-short{
  display:grid;
  justify-items:center;
}
.version-workspace-short{
  display:grid!important;
  justify-items:center;
  width:100%!important;
  max-width:100%!important;
  /* n 671 - C est une <figure> : le navigateur lui donne 40 px de marge a
     gauche et a droite. Avec width:100%, elle depassait son conteneur de 80 px
     et `.main` (overflow-x:hidden) rognait le reel sans qu aucune mesure du
     document ne le voie. Mesure le 25/09 par scripts/mobile-interaction-probes.mjs,
     une fois la sonde capable de voir ce que `.main` rogne. */
  margin:0;
}
/* n 783 -- DEUX REELS COTE A COTE : l extrait et l entier.
   Cette regle vient APRES `.version-workspace-short{width:100%!important}` --
   c est tout le sujet : posee plus haut, elle perdait, et les deux reels se
   retrouvaient l un SOUS l autre. Un `!important` plus haut dans la feuille ne
   bat pas un `!important` plus bas. */
.version-workspace-shorts{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  align-items:flex-start;
  justify-content:center;
}
.version-workspace-shorts>.version-workspace-short{
  width:auto!important;
  max-width:calc(50% - 8px)!important;
  flex:0 1 auto;
}
/* Quand la place manque vraiment, ils se replient l un sous l autre plutot que
   de retrecir jusqu a l illisible. */
@media(max-width:640px){
  .version-workspace-shorts>.version-workspace-short{max-width:100%!important;}
}
/* n 783 -- LA PASTILLE QUI DIT LEQUEL C EST.
   Demandee par Saray : « pour qu on identifie tout de suite le full du short ».
   Posee sur les DEUX -- une seule obligerait a deduire que l autre est le
   court. Elle vit DANS le cadre : la legende se lit, la pastille se voit.
   L or n est pas decoratif : c est la couleur d accent de l ecran, et elle
   marque le format qu on publie le moins souvent, donc celui qu on cherche.
   `pointer-events:none` parce qu elle recouvre la video, et qu un clic dessus
   doit lancer la lecture comme partout ailleurs sur l image. */
.reel-pastille{
  position:absolute;
  top:10px;
  left:10px;
  z-index:3;
  padding:4px 9px;
  border-radius:999px;
  font:900 10px/1 Manrope,system-ui,"Sakira JP",sans-serif;
  letter-spacing:.14em;
  text-transform:uppercase;
  pointer-events:none;
  backdrop-filter:blur(6px);
  box-shadow:0 2px 10px rgba(0,0,0,.45);
}
.reel-pastille[data-reel="short"]{
  background:rgba(9,10,12,.72);
  color:rgba(244,241,232,.86);
  border:1px solid rgba(255,255,255,.18);
}
.reel-pastille[data-reel="full"]{
  background:linear-gradient(180deg,#e8c887,#d8a84e);
  color:#141007;
  border:1px solid rgba(255,255,255,.28);
}

.version-workspace-short-frame{
  width:min(360px,100%)!important;
  aspect-ratio:9/16;
  border-radius:14px;
  overflow:hidden!important;
  background:#050506;
  box-shadow:0 22px 70px rgba(0,0,0,.42),0 0 0 1px rgba(255,255,255,.08);
}
.version-workspace-short-frame .version-workspace-short-media{
  width:100%!important;
  height:100%!important;
  aspect-ratio:9/16;
  object-fit:contain!important;
  background:#000;
}
.version-workspace-short-label{
  width:min(360px,100%);
  text-align:center;
}
@media(max-width:640px){
  .version-workspace-short-frame,
  .version-workspace-short-label{width:min(320px,100%)!important}
}


/* 20260818 short disk follows global playback */
.vertical-disk-thumb[data-source-url] .disk-record{
  animation-play-state:paused;
}
.vertical-disk-thumb[data-source-url].is-playing .disk-record{
  animation-play-state:running;
}


/* 20260818 disk preview title text */
.vertical-disk-thumb .disk-copy{
  position:absolute;
  left:8%;
  right:8%;
  bottom:17%;
  z-index:5;
  display:grid;
  gap:5px;
  justify-items:center;
  text-align:center;
  pointer-events:none;
  text-shadow:0 2px 12px rgba(0,0,0,.82),0 0 22px rgba(0,0,0,.75);
}
.vertical-disk-thumb .disk-copy strong{
  max-width:100%;
  color:#fff7e8;
  font:900 clamp(16px,5vw,25px)/1.08 Manrope,"Sakira JP",sans-serif;
  letter-spacing:-.045em;
  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.vertical-disk-thumb .disk-copy span,
.vertical-disk-thumb .disk-copy small{
  color:rgba(255,255,255,.88);
  font:800 clamp(10px,2.6vw,14px)/1.1 Manrope,"Sakira JP",sans-serif;
  letter-spacing:.005em;
}
.vertical-disk-thumb .disk-copy small{
  color:rgba(255,255,255,.82);
}
.version-workspace-short-frame .vertical-disk-thumb .disk-copy{
  bottom:18%;
  gap:6px;
}
.version-workspace-short-frame .vertical-disk-thumb .disk-copy strong{
  font-size:28px;
}
.version-workspace-short-frame .vertical-disk-thumb .disk-copy span,
.version-workspace-short-frame .vertical-disk-thumb .disk-copy small{
  font-size:16px;
}

/* 20260818 DistroKid-ready release pack */
.version-workspace-store-release{
  border-color:rgba(235,190,95,.36)!important;
  background:rgba(18,16,13,.68)!important;
  color:#fff2c8!important;
}
.version-workspace-store-release:hover,
.version-workspace-store-release:focus-visible{
  border-color:rgba(255,214,122,.68)!important;
  background:rgba(50,36,16,.84)!important;
  transform:translateY(-1px);
}
.distrokid-pack-dialog{
  width:min(620px,calc(100vw - 32px));
  max-width:min(620px,calc(100vw - 32px));
  padding:34px 34px 28px!important;
  overflow:visible;
}
.distrokid-pack-dialog,
.distrokid-pack-dialog *{box-sizing:border-box;}
.distrokid-pack-dialog::backdrop{
  background:rgba(0,0,0,.78);
  backdrop-filter:blur(12px);
}
.distrokid-pack-dialog .profile-close{
  top:18px!important;
  right:18px!important;
  width:34px!important;
  height:34px!important;
  border-radius:12px!important;
  background:rgba(14,12,10,.96)!important;
  color:#f4c46b!important;
  border:1px solid rgba(244,196,107,.42)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.35)!important;
}
.distrokid-pack-dialog .profile-close svg{
  width:17px!important;
  height:17px!important;
  stroke:#f4c46b!important;
  stroke-width:2.4!important;
}
.distrokid-pack-dialog .profile-close:hover,
.distrokid-pack-dialog .profile-close:focus-visible{
  background:rgba(244,196,107,.18)!important;
  color:#ffe7a5!important;
  border-color:rgba(255,226,160,.72)!important;
}
.distrokid-pack-dialog .profile-close:hover svg,
.distrokid-pack-dialog .profile-close:focus-visible svg{stroke:#ffe7a5!important;}
.distrokid-pack-dialog-minimal .distrokid-pack-card{
  display:grid;
  gap:14px;
  padding:2px 48px 18px 0;
  min-width:0;
}
.distrokid-pack-mark{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:16px;
  color:#171108;
  background:linear-gradient(135deg,#ffe7a5,#d99d35);
  box-shadow:0 18px 42px rgba(217,157,53,.22);
}
.distrokid-pack-mark svg{width:22px;height:22px;}
.distrokid-pack-dialog-minimal .eyebrow{
  margin:2px 0 -7px;
  color:rgba(244,196,107,.72);
  letter-spacing:.16em;
}
.distrokid-pack-dialog-minimal h2{
  margin:0;
  font-size:clamp(1.85rem,5vw,2.55rem);
  line-height:.98;
  letter-spacing:-.055em;
  color:#fff6dc;
  padding-right:8px;
}
.distrokid-pack-copy{
  margin:0;
  max-width:100%;
  padding-right:6px;
  color:rgba(255,244,216,.72);
  line-height:1.5;
  overflow-wrap:break-word;
}
.distrokid-pack-assets{
  display:grid;
  gap:8px;
  margin:4px 0 7px;
}
.distrokid-pack-assets span{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:39px;
  padding:9px 13px;
  border:1px solid rgba(255,214,122,.14);
  border-radius:13px;
  background:rgba(255,255,255,.035);
  color:rgba(255,242,205,.88);
  min-width:0;
}
.distrokid-pack-assets svg{width:16px;height:16px;color:#f4c46b;flex:0 0 auto;}
.distrokid-pack-assets b{
  min-width:0;
  font-size:.9rem;
  font-weight:750;
  overflow-wrap:anywhere;
}
.distrokid-pack-actions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:9px;
}
.distrokid-pack-actions .primary,
.distrokid-pack-actions .secondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  min-height:40px;
  border-radius:999px;
  text-decoration:none;
  white-space:normal;
  text-align:center;
}
.distrokid-pack-download{
  grid-column:1/-1;
  min-height:50px!important;
  font-weight:900;
}
.distrokid-pack-actions .secondary{
  font-size:.86rem;
  opacity:.9;
}
.distrokid-pack-actions .secondary:disabled{opacity:.48;cursor:not-allowed;}
.distrokid-pack-status{
  margin:0;
  padding-top:2px;
  color:rgba(255,244,216,.56);
  font-size:.84rem;
  overflow-wrap:anywhere;
}
@media (max-width:620px){
  .distrokid-pack-dialog{padding:30px 24px 26px!important;}
  .distrokid-pack-dialog-minimal .distrokid-pack-card{padding-right:36px;}
  .distrokid-pack-actions{grid-template-columns:1fr;}
}

/* 20260818 DistroKid account selector */
.distrokid-account-picker{
  display:grid;
  gap:8px;
  margin:2px 0 8px;
  padding:12px;
  border:1px solid rgba(236,191,96,.22);
  border-radius:16px;
  background:rgba(255,255,255,.035);
}
.distrokid-account-picker-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:0 0 2px;
}
.distrokid-account-picker-head p{
  margin:0;
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(246,205,120,.82);
  font-weight:800;
}
.distrokid-account-add{
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:28px;
  padding:5px 9px;
  border:1px solid rgba(236,191,96,.35);
  border-radius:999px;
  background:rgba(236,191,96,.08);
  color:#f6cd78;
  font-size:.72rem;
  font-weight:800;
  cursor:pointer;
}
.distrokid-account-add:hover{background:rgba(236,191,96,.16);color:#fff7df;}
.distrokid-account-add svg{width:13px;height:13px;}
.distrokid-account-option{
  display:flex;
  align-items:center;
  gap:9px;
  width:100%;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  background:rgba(0,0,0,.18);
  color:rgba(255,244,216,.9);
  cursor:pointer;
}
.distrokid-account-option:hover,
.distrokid-account-option:focus-within{
  border-color:rgba(238,190,88,.42);
  background:rgba(238,190,88,.08);
}
.distrokid-account-option input{
  accent-color:#e7b654;
  width:16px;
  height:16px;
  margin:0;
}
.distrokid-account-option span{
  min-width:0;
  overflow-wrap:anywhere;
  font-size:.88rem;
  font-weight:760;
}

/* 20260818 clearer active production step */
#view-project .flow-step.active{
  border-color:rgba(255,214,129,1)!important;
  background:radial-gradient(circle at 50% 34%,rgba(255,224,154,.30),rgba(30,24,14,.98) 62%,rgba(11,12,14,.98))!important;
  box-shadow:0 22px 64px rgba(0,0,0,.58),0 0 0 1px rgba(255,214,129,.30),0 0 54px rgba(216,168,78,.48)!important;
}
#view-project .flow-step.active::after{
  content:"NOW";
  position:absolute;
  top:-12px;
  right:-14px;
  padding:5px 7px;
  border-radius:999px;
  border:1px solid rgba(255,227,160,.75);
  background:linear-gradient(135deg,#ffe3a0,#d8a84e);
  color:#090a0c;
  font-size:9px;
  font-weight:950;
  letter-spacing:.09em;
  box-shadow:0 0 22px rgba(216,168,78,.42);
}
#view-project .flow-step.active .flow-icon{
  animation:sakira-flow-active-pulse 1.45s ease-in-out infinite;
}
#view-project .flow-step.active em{
  color:#ffe3a0!important;
  font-weight:900;
}
@keyframes sakira-flow-active-pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(216,168,78,.38),0 0 22px rgba(216,168,78,.25)}
  50%{box-shadow:0 0 0 10px rgba(216,168,78,0),0 0 34px rgba(216,168,78,.45)}
}
@media(max-width:900px){
  #view-project .flow-step.active::after{
    top:10px;
    right:12px;
  }
}

.lyrics-upload-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}.lyrics-upload-grid input[type=file]{display:block;width:100%;margin-top:6px}.lyrics-upload-help{display:block;margin-top:8px;color:var(--muted)}@media(max-width:720px){.lyrics-upload-grid{grid-template-columns:1fr}}

/* --- Choix de clips a la creation --------------------------------------- */
.create-library-fieldset { border:1px solid #2b3145; border-radius:10px; padding:12px; margin:12px 0; }
.create-library-fieldset legend { padding:0 6px; font-size:.85rem; }
.library-hint { margin:0 0 8px; color:#8b93a7; font-size:.8rem; line-height:1.4; }
.library-empty { margin:0 0 8px; color:#6f7688; font-size:.8rem; font-style:italic; }
.library-chosen { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
.library-chip { position:relative; display:inline-block; }
.library-chip img { width:84px; aspect-ratio:16/9; object-fit:cover; border-radius:6px; display:block; }
.library-chip button { position:absolute; top:-6px; right:-6px; width:18px; height:18px; line-height:1;
  border-radius:9px; border:none; background:#c2384b; color:#fff; cursor:pointer; font-size:.8rem; padding:0; }
/* n 553 — UNE FENETRE MODALE PASSE AU-DESSUS DU DECOR COLLANT.
   Elle etait a 60, sous `.project-filter-bar` (120) et
   `.project-table-header` (119), tous deux `position:sticky`. La barre de
   filtres et l'en-tete du tableau des projets se dessinaient donc PAR-DESSUS
   la bibliotheque : on croyait que les vignettes debordaient, c'etait la page
   qui repassait devant. Mesure le 24/08 dans un vrai navigateur.
   200 la met franchement au-dessus du decor de page, et bien en dessous des
   couches d'alerte deja posees a 999 et plus. */
.library-overlay { position:fixed; inset:0; z-index:200; background:rgba(8,10,18,.72);
  display:flex; align-items:center; justify-content:center; padding:24px; }
.library-modal { background:#12151f; border:1px solid #262b3a; border-radius:14px; width:min(1040px,100%);
  max-height:88vh; display:flex; flex-direction:column; padding:20px; gap:12px;
  /* n 553 — RIEN NE PEINT HORS DE CETTE FENETRE.
     Sans ceci, les « deja choisis » debordaient par le bas et se dessinaient
     par-dessus la page : la barre de filtres et la liste des projets
     apparaissaient AU TRAVERS des vignettes. Mesure le 24/08 : 808 px
     d'enfants dans une fenetre de 792, et le bouton « Termine » a 55 px
     SOUS le bas de l'ecran, donc hors d'atteinte. */
  overflow: hidden; }
.library-head { display:flex; align-items:center; justify-content:space-between; }
.library-head h3 { margin:0; font-size:1.05rem; }
.library-close { background:none; border:none; color:#9aa3b8; font-size:1.6rem; cursor:pointer; }
.library-search { width:100%; padding:10px 12px; border-radius:8px; border:1px solid #2b3145;
  background:#0d1017; color:inherit; }
.library-origin { margin:0; color:#8b93a7; font-size:.85rem; min-height:1.2em; }
.library-grid { overflow-y:auto; display:grid; gap:12px; grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
  /* Un element de boite flexible ne descend pas sous la taille de son contenu
     tant que `min-height` vaut `auto`. La grille refusait donc de retrecir,
     poussait le pied dehors, et se retrouvait paradoxalement ecrasee a 0 px
     quand les epingles prenaient le dessus. `min-height:0` lui rend le droit
     de retrecir, et `flex:1 1 auto` lui donne tout ce qui reste. */
  min-height: 0; flex: 1 1 auto; }
.library-item { display:flex; flex-direction:column; gap:6px; text-align:left; background:#171b27;
  border:1px solid #262b3a; border-radius:10px; padding:8px; cursor:pointer; color:inherit; font:inherit; }
.library-item:hover { border-color:#4c7dff; }
.library-item.choisi { border-color:#3ba55d; box-shadow:0 0 0 1px #3ba55d inset; }
.library-item img, .library-noimg { width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:6px; background:#0d1017; }
/* n 553 — l apercu se pose PAR-DESSUS la vignette, au meme endroit et a la
   meme taille : la carte ne bouge pas d un pixel au survol. La vignette reste
   dessous, donc un clip qui ne charge pas laisse l image, jamais un trou. */
.library-item { position: relative; }
.library-apercu {
  position: absolute;
  left: 8px; right: 8px; top: 8px;
  aspect-ratio: 16/9;
  /* n 553 bis — PAS `width:auto`. Sur un element REMPLACE en position absolue,
     `width:auto` se resout a la taille INTRINSEQUE du media et `right` est
     IGNORE (CSS 2.1 10.3.8). Les clips etant en 1280x720, l apercu se peignait
     a 1280x720 par-dessus une vignette de 172x97 et recouvrait 19 des 23 cartes
     voisines. La largeur doit donc etre dite : 100% du bloc conteneur (la boite
     de padding de .library-item) moins les deux retraits lateraux. */
  width: calc(100% - 16px);
  object-fit: cover;
  border-radius: 6px;
  background: #0d1017;
  opacity: 0;
  transition: opacity .12s ease-in;
  pointer-events: none;
}
.library-item.apercu-actif .library-apercu { opacity: 1; }
.library-epingles .library-apercu { left: 4px; right: 4px; top: 4px; width: calc(100% - 8px); }
.library-meta { color:#7f879b; font-size:.75rem; }
.library-desc { font-size:.8rem; line-height:1.35; color:#c4cad8; display:-webkit-box;
  -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.library-foot { display:flex; align-items:center; justify-content:space-between; }
.library-count { color:#8b93a7; font-size:.85rem; }

/* n° 346 — le choix entre « mes vidéos seules » et le vivier privilégié.
   La case est collée sous le bouton qui la concerne, et son aide juste après :
   sans elle, « n'utiliser que ces vidéos » ne dit pas ce qui se passe quand il
   y a plus de scènes que de vidéos choisies. */
.library-exclusif {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.6rem;
  cursor: pointer;
  font-size: 0.95rem;
}
.library-exclusif input { cursor: pointer; }
#library-exclusif-aide { margin-top: 0.25rem; opacity: 0.75; }

/* n° 365 — les médias déjà choisis, épinglés en tête de la fenêtre.
   Changer de recherche les faisait disparaître de l'écran : ils restaient
   choisis, mais plus rien ne le montrait. */
.library-epingles {
  border-bottom: 1px solid rgba(128, 128, 128, 0.25);
  padding-bottom: 0.75rem;
  margin-bottom: 0.75rem;
  /* n 553 — LE RAPPEL NE DOIT PAS MANGER LE CHOIX.
     Ce bloc reprenait la MEME carte pleine que la grille : a 15 videos
     choisies il faisait 679 px a lui seul, la grille de selection tombait a
     0 px, et il n'y avait plus rien a cliquer. Mesure le 24/08.
     Il garde son role -- montrer ce qui est deja pris, meme apres une
     recherche (n 365) -- mais en vignettes compactes, borne, et il defile. */
  flex: 0 0 auto;
  max-height: 21vh;
  overflow-y: auto;
}
/* Dans les epingles, une vignette suffit : le texte est deja lisible dans la
   grille du dessous, et c'est lui qui faisait la hauteur. */
.library-epingles .library-grid {
  grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
  gap: 8px;
  overflow: visible;
  min-height: 0;
  flex: 0 0 auto;
}
.library-epingles .library-item { padding: 4px; gap: 0; }
.library-epingles .library-meta,
.library-epingles .library-desc { display: none; }
.library-foot .library-plus { margin-left: auto; }
/* 20260823 mobile song-version cards: give title/chips room on ~390px phones. */
@media(max-width:600px){
  .song-version-inline-player.workflow-inline-player{
    grid-template-columns:58px minmax(0,1fr)!important;
    align-items:start!important;
    gap:12px!important;
    padding:12px!important;
    border-radius:18px!important;
  }
  .song-version-inline-player .inline-player-cover,
  .song-version-inline-player .inline-player-cover.is-landscape{
    grid-column:1!important;
    grid-row:1!important;
    width:58px!important;
    height:58px!important;
    aspect-ratio:auto!important;
    border-radius:13px!important;
  }
  .song-version-inline-player .inline-player-meta{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    min-width:0!important;
    align-self:start!important;
  }
  .song-version-inline-player .inline-player-title-row{
    align-items:flex-start!important;
    gap:6px!important;
    min-width:0!important;
  }
  .song-version-inline-player .inline-player-title-row strong{
    flex:1 1 auto!important;
    max-width:none!important;
    min-width:0!important;
    white-space:normal!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:14px!important;
    line-height:1.22!important;
  }
  .song-version-inline-player .inline-title-edit{
    flex:0 0 30px!important;
    width:30px!important;
    height:30px!important;
  }
  .song-version-inline-player .inline-player-version{
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    gap:5px 6px!important;
    margin-top:5px!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
  .song-version-inline-player .inline-player-version .version-number,
  .song-version-inline-player .inline-player-version .version-rest{
    flex:0 1 auto!important;
    min-width:0!important;
  }
  .song-version-inline-player .inline-player-version .version-rest{
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  .song-version-inline-player .inline-player-version .version-workspace-like{
    width:28px!important;
    height:28px!important;
  }
  .song-version-inline-player .inline-player-version .version-published{
    max-width:100%!important;
    white-space:nowrap!important;
  }
  .song-version-inline-player .inline-player-style-mood{
    gap:5px!important;
    margin-top:7px!important;
    overflow:visible!important;
  }
  .song-version-inline-player .inline-player-style-mood span{
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    text-overflow:clip!important;
    line-height:1.2!important;
  }
  .song-version-inline-player .inline-player-menu{
    grid-column:1 / -1!important;
    grid-row:2!important;
    justify-content:flex-start!important;
    align-items:center!important;
    gap:8px!important;
    min-width:0!important;
  }
  .song-version-inline-player .inline-player-menu .song-more-trigger{
    width:36px!important;
    height:36px!important;
  }
  .song-version-inline-player .inline-player-center{
    grid-column:1 / -1!important;
    grid-row:3!important;
    width:100%!important;
    gap:9px!important;
  }
  .song-version-inline-player .inline-player-controls{
    justify-content:center!important;
    gap:clamp(9px,4vw,14px)!important;
  }
  .song-version-inline-player .inline-player-timeline{
    grid-template-columns:38px minmax(0,1fr) 38px!important;
    gap:8px!important;
  }
}

/* n 558 - Composition du reel vertical.
   Meme moule que la boite d'engagement du rendu paysage : un <dialog> natif,
   ouvert par showModal(). Un <dialog> modal vit dans la couche superieure du
   navigateur -- les trois pieges payes le 24/08 sur la fenetre de
   bibliotheque (n 553 : debordement hors de la fenetre, `min-height:auto`
   qui empeche une zone de retrecir, empilement sous une barre `sticky` en
   z-index 120) n'ont pas d'equivalent ici, parce qu'il n'y a ni z-index a
   negocier ni parent qui rogne. Les deux premieres precautions sont tout de
   meme reprises : un ecran court reste un ecran court, et la liste des
   reglages doit pouvoir defiler SANS pousser les boutons hors de l'ecran. */
.reel-dialog .profile-card{max-height:88vh;display:flex;flex-direction:column;overflow:hidden;}
.reel-dialog .reel-body{overflow-y:auto;min-height:0;flex:1 1 auto;text-align:left;}
.reel-dialog .reel-note{color:var(--muted);font-size:12px;margin:0 0 14px;text-align:left;line-height:1.45;}
.reel-dialog .reel-master-missing{color:#e3b25a;}
.reel-dialog .reel-subtitles-hint{margin:2px 0 4px;}
.reel-top{border:1px solid rgba(255,255,255,.10);border-radius:12px;padding:12px 14px;margin:0 0 16px;
  display:flex;flex-direction:column;gap:9px;}
.reel-top legend{padding:0 6px;font-size:12px;font-weight:700;color:#f7ead0;}
.reel-top label{display:flex;align-items:center;gap:9px;font-size:13px;color:#f7ead0;cursor:pointer;}
.reel-top input{accent-color:#d8a84e;width:16px;height:16px;flex:0 0 16px;}
.reel-top label:has(input:disabled){opacity:.45;cursor:not-allowed;}
.reel-toggles{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 12px;}
.reel-toggles label{display:flex;align-items:center;gap:7px;min-height:34px;padding:8px 12px;
  border:1px solid rgba(255,255,255,.10);border-radius:999px;background:rgba(255,255,255,.045);
  color:#f7ead0;font-size:12px;font-weight:700;cursor:pointer;}
.reel-toggles input{accent-color:#d8a84e;}
/* n 609 - Les bornes de duree. Deux nombres et une phrase qui nomme QUI
   plafonne : la contrainte de plateforme se lit, elle ne se subit pas. */
.reel-bornes,.reel-length-choice{border:1px solid rgba(255,255,255,.10);border-radius:12px;padding:12px 14px;margin:0 0 14px;
  display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;}
.reel-bornes legend,.reel-length-choice legend{padding:0 6px;font-size:12px;font-weight:700;color:#f7ead0;}
.reel-bornes label,.reel-length-field{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:#f7ead0;}
.reel-bornes input[type="number"],.reel-length-field input[type="number"]{
  width:86px;min-height:34px;padding:6px 10px;border-radius:10px;
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#f7ead0;
  font-size:13px;font-weight:700;text-align:right;}
.reel-bornes em,.reel-length-unit{font-style:normal;color:var(--muted);font-size:12px;}

/* n 851 - LES REGLAGES PAR PLATEFORME N AVAIENT AUCUNE REGLE A EUX.
   Ils heritaient de `.provider-choice label`, qui est une grille a DEUX
   colonnes faite pour « case a cocher + texte ». Or une ligne de reglage a
   TROIS enfants : le nom de la plateforme, le champ, et l unite. Le « s »
   tombait donc a la ligne suivante, et chaque reglage occupait un pave entier
   -- huit paves pour quatre plateformes.
   Une ligne = un nom, un controle, une unite. Les quatre plateformes se posent
   en colonnes selon la largeur disponible : sur un ecran etroit elles
   s empilent, sans jamais casser une ligne en deux. */
.reel-publie-choice{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px 12px;}
.reel-publie-choice>legend,.reel-publie-choice>.reel-note,.reel-publie-choice>.reel-plafonds{grid-column:1/-1;}
.reel-plafonds{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px 12px;margin:2px 0 0;}
/* Tous les blocs qui posent « un nom, un champ, une unite » -- les plafonds par
   plateforme, la longueur du reel, les bornes. La premiere version ne couvrait
   que les plafonds : le meme defaut restait deux blocs plus bas. */
/* n 851 - Le choix par plateforme n est PAS une grille.
   Il l a ete une heure, et le nom de la plateforme se dessinait par-dessus le
   menu : la colonne `1fr` du nom s ecrase a zero quand le menu reclame sa
   largeur, et le texte deborde de sa boite au lieu de la pousser.
   En flex, le nom garde sa largeur naturelle et c est le menu qui prend ce qui
   reste -- l inverse exact, et c est le bon sens de priorite : un nom de
   plateforme ne se tronque pas.
   Les lignes de duree restent en grille : elles ont une quatrieme cellule, la
   mention d etat, qui doit s etendre sur toute la largeur. */
.reel-publie-choice .reel-publie-field{
  display:flex!important;align-items:center!important;gap:10px!important;
  justify-content:space-between;flex-wrap:nowrap;}
.reel-publie-choice .reel-publie-field>span{flex:0 0 auto;white-space:nowrap;}
.reel-publie-choice .reel-publie-field>select{flex:1 1 auto;min-width:0;}

.reel-plafonds .reel-length-field,
.reel-length-choice .reel-length-field,
.reel-bornes label{
  display:grid!important;grid-template-columns:1fr auto auto;align-items:center!important;gap:10px!important;}
.reel-publie-choice .reel-publie-field>span,
.reel-plafonds .reel-length-field>span,
.reel-length-choice .reel-length-field>span,
.reel-bornes label>span{
  font-size:13px;font-weight:600;color:#f7ead0;min-width:0;white-space:nowrap;}
.reel-publie-choice select{min-height:34px;padding:6px 28px 6px 10px;border-radius:10px;
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#f7ead0;
  font-size:13px;font-weight:700;}
/* L unite reste COLLEE au nombre : `.provider-choice em` en faisait un bloc. */
.reel-plafonds .reel-length-unit,
.reel-length-choice .reel-length-unit,
.reel-bornes em{display:inline!important;margin-top:0!important;}
.reel-bornes .reel-bornes-note,.reel-length-choice .preferences-note{flex:1 1 100%;margin:2px 0 0;}
/* n 1178 - L effet FX : une liste et deux nombres. Les regles de ligne
   ci-dessus posent `display:grid!important` : sans cette regle plus precise,
   `hidden` ne masquerait pas la quantite d un effet filme. */
.reel-effet .reel-effet-field[hidden],.reel-effet-choice .reel-effet-field[hidden]{display:none!important;}
.reel-effet-field select{min-height:34px;max-width:100%;padding:6px 28px 6px 10px;border-radius:10px;
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#f7ead0;
  font-size:13px;font-weight:700;}
.reel-effet .reel-effet-note{flex:1 1 100%;margin:2px 0 0;}
/* n 851 - UN PLAFOND QUI NE SERT PAS NE DOIT PAS AVOIR L AIR A REMPLIR.
   Le plafond ne decide que pour « dans la limite de duree ». Sur « le meilleur
   moment » l extrait est court par nature, et sur « sans limite » le plafond
   n est pas consulte du tout. Laisser le champ actif ferait ecrire un temps qui
   ne sert a rien -- exactement ce que Saray voulait eviter.
   Il est donc estompe et desactive, mais il RESTE A L ECRAN avec son nombre :
   c est la preuve visible que le reglage est conserve. Le remplacer par un
   texte laisserait croire qu on l a perdu. */
.reel-plafonds .reel-length-field.is-sans-effet>span,
.reel-plafonds .reel-length-field.is-sans-effet>input,
.reel-plafonds .reel-length-field.is-sans-effet>.reel-length-unit{opacity:.45;}
.reel-plafonds .reel-length-field.is-sans-effet>input{cursor:not-allowed;}
.reel-plafonds .reel-length-field>.reel-plafond-etat{grid-column:1/-1;margin:2px 0 0;
  font-size:11px;font-weight:600;line-height:1.3;color:#f7ead0;opacity:.6;}
.reel-plafonds .reel-length-field>.reel-plafond-etat:empty{display:none;}

.reel-defaults-toggles{display:flex;flex-wrap:wrap;gap:8px 12px;}
.reel-dialog .regen-actions{flex:0 0 auto;}
.reel-dialog button:disabled{cursor:not-allowed;opacity:.6;}

/* n559 : la liste des chaines YouTube d'un utilisateur, sous la carte de
   connexion. Le compte principal est celui qui sert quand une publication ne
   choisit personne. */
.connection-accounts{list-style:none;margin:.6rem 0 0;padding:0;display:flex;flex-direction:column;gap:.4rem;}
.connection-account{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-size:.9rem;}
.connection-account-copy{min-width:0;display:grid;gap:2px;}
.connection-account-name{font-weight:600;}
.connection-account-email{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.connection-account.is-primary .connection-account-name{text-decoration:underline;}
.connection-account-badge{font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;border:1px solid currentColor;border-radius:999px;padding:.05rem .45rem;opacity:.8;}
.connection-account-action{font-size:.78rem;padding:.35rem .7rem;min-height:34px;}

/* 20260825 connections premium panels: scoped to the Connections page only. */
#view-connections{max-width:1160px;}
#view-connections .section-head{
  position:relative;overflow:hidden;align-items:flex-end;gap:18px;margin-bottom:22px;padding:22px;
  border:1px solid rgba(216,168,78,.26);border-radius:28px;
  background:
    radial-gradient(circle at 9% 10%,rgba(216,168,78,.22),transparent 34%),
    linear-gradient(145deg,rgba(23,20,13,.96),rgba(7,8,11,.98) 62%,rgba(14,12,8,.98));
  box-shadow:0 28px 80px rgba(0,0,0,.44),inset 0 1px 0 rgba(255,255,255,.05);
}
#view-connections .section-head:before{
  content:"";position:absolute;inset:14px;border:1px solid rgba(255,255,255,.045);border-radius:22px;pointer-events:none;
}
#view-connections .section-head:after{
  content:"SOCIAL ACCOUNTS";position:absolute;right:22px;top:18px;
  font:800 10px/1 Inter,"Sakira JP",sans-serif;letter-spacing:.22em;color:rgba(216,168,78,.62);
}
#view-connections .section-head h2{margin:0 0 8px!important;font:900 clamp(30px,5vw,52px)/.92 Manrope,"Sakira JP",sans-serif!important;letter-spacing:-.055em;color:#fff7df;}
#view-connections .section-head p{max-width:680px;margin:0!important;color:rgba(244,241,232,.74)!important;font-size:15px;line-height:1.55;}
#view-connections .connection-list{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px!important;align-items:stretch;width:100%;min-width:0;
}
#view-connections #connected-apps{
  margin-top:clamp(28px,4vw,44px);
}
#view-connections #connected-apps[hidden]{
  display:none!important;
}
#view-connections .connection{
  position:relative;overflow:hidden;min-width:0;min-height:0!important;padding:16px!important;border-radius:24px!important;
  border:1px solid rgba(216,168,78,.16)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.042),rgba(255,255,255,.012)),
    radial-gradient(circle at 16% 0,rgba(216,168,78,.18),transparent 34%),
    #0d0e11!important;
  box-shadow:0 20px 56px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.045)!important;
  gap:12px!important;
}
#view-connections .connection:after{content:"";position:absolute;inset:auto 14px 0;height:1px;background:linear-gradient(90deg,transparent,rgba(216,168,78,.45),transparent);pointer-events:none;}
#view-connections .connection.connected{border-color:rgba(216,168,78,.34)!important;}
#view-connections .connection.not-connected{border-color:rgba(216,168,78,.22)!important;}
#view-connections .connection-top{position:relative;z-index:1;align-items:flex-start!important;gap:10px!important;min-width:0;}
#view-connections .connection h3{min-width:0;gap:9px!important;color:#fff6dc!important;font-size:17px!important;letter-spacing:-.02em;}
#view-connections .connection h3 .platform-symbol,#view-connections .connection h3 svg{flex:0 0 auto;width:22px;height:22px;filter:drop-shadow(0 0 12px rgba(216,168,78,.16));}
#view-connections .connection-badge{
  flex:0 0 auto;border-radius:999px!important;padding:6px 9px!important;font-size:10px!important;letter-spacing:.12em;text-transform:uppercase;
  background:rgba(255,255,255,.045)!important;border-color:rgba(255,255,255,.08)!important;color:rgba(244,241,232,.68)!important;
}
#view-connections .connection.connected .connection-badge{color:#7ee0a5!important;background:rgba(89,189,131,.12)!important;border-color:rgba(89,189,131,.32)!important;}
#view-connections .connection.not-connected .connection-badge{color:#f1c76d!important;background:rgba(216,168,78,.105)!important;border-color:rgba(216,168,78,.32)!important;}
#view-connections .connection p{position:relative;z-index:1;color:rgba(244,241,232,.82)!important;font-size:14px!important;line-height:1.45!important;}
#view-connections .connection small{position:relative;z-index:1;color:rgba(244,241,232,.52)!important;font-size:12px;}
#view-connections .connection-accounts{position:relative;z-index:1;margin:2px 0 0!important;gap:8px!important;}
#view-connections .connection-account{
  display:grid!important;grid-template-columns:minmax(0,1fr) auto auto auto;align-items:center;gap:7px!important;width:100%;min-width:0;
  padding:9px;border:1px solid rgba(255,255,255,.075);border-radius:16px;background:rgba(0,0,0,.22);font-size:13px!important;
}
#view-connections .connection-account.is-primary{border-color:rgba(216,168,78,.32);background:linear-gradient(135deg,rgba(216,168,78,.12),rgba(255,255,255,.025));}
#view-connections .connection-account-copy{min-width:0;overflow:hidden;display:grid!important;gap:2px;}
#view-connections .connection-account-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none!important;color:#fff4dc;font-weight:800!important;}
#view-connections .connection-account-email{display:block;min-width:0;overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:anywhere;color:#f2d287!important;font-size:12.5px!important;font-weight:800!important;line-height:1.35!important;}
#view-connections .connection-account-badge{white-space:nowrap;font-size:9px!important;font-weight:900;letter-spacing:.13em;color:#171107;background:linear-gradient(135deg,#f5d88b,#d8a84e);border:0!important;padding:5px 7px!important;opacity:1!important;box-shadow:0 8px 18px rgba(216,168,78,.18);}
#view-connections .connection-account-action{margin:0!important;min-height:30px!important;padding:7px 9px!important;border-radius:999px!important;font-size:11px!important;font-weight:850!important;line-height:1!important;white-space:nowrap;}
#view-connections .connection-account-action:first-of-type{border-color:rgba(216,168,78,.26)!important;color:#f2d287!important;background:rgba(216,168,78,.08)!important;}
#view-connections .connection-account-action:last-of-type{border-color:rgba(255,255,255,.1)!important;color:rgba(244,241,232,.72)!important;background:rgba(255,255,255,.035)!important;}
#view-connections .connection-account-edit{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;border-color:rgba(216,168,78,.34)!important;color:#efd591!important;background:rgba(216,168,78,.08)!important;}
#view-connections .connection-account-edit svg{width:13px!important;height:13px!important;}
#view-connections .connection-account-remove{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;border-color:rgba(255,104,104,.34)!important;color:#ffb7b7!important;background:rgba(255,78,78,.08)!important;}
#view-connections .connection-account-remove svg{width:13px!important;height:13px!important;}
#view-connections .connection-actions{position:relative;z-index:1;margin-top:auto!important;display:grid!important;grid-template-columns:1fr;gap:8px!important;}
#view-connections .connection-actions button{width:100%;min-width:0;min-height:40px!important;border-radius:999px!important;font-weight:850!important;letter-spacing:-.01em;}
#view-connections .connection-actions .primary,#view-connections .connection-primary{
  border:0!important;color:#160f05!important;background:linear-gradient(135deg,#fff0b6,#d8a84e 58%,#9f722b)!important;
  box-shadow:0 14px 30px rgba(216,168,78,.24)!important;
}
#view-connections .connection-actions .secondary{border-color:rgba(216,168,78,.22)!important;background:rgba(255,255,255,.035)!important;color:#f2d287!important;}
#view-connections .connection-actions .connection-locked{border-color:rgba(216,168,78,.38)!important;background:linear-gradient(135deg,rgba(216,168,78,.16),rgba(0,0,0,.28))!important;color:#ffe4a3!important;box-shadow:inset 0 0 0 1px rgba(255,227,161,.08)!important;}
#view-connections .connection-actions .secondary:last-child:not(:only-child){color:rgba(244,241,232,.76)!important;border-color:rgba(255,255,255,.1)!important;background:rgba(0,0,0,.2)!important;}
#view-connections .connection button:hover,#view-connections .connection button:focus-visible{transform:translateY(-1px);border-color:rgba(216,168,78,.48)!important;box-shadow:0 14px 28px rgba(0,0,0,.24),0 0 0 1px rgba(216,168,78,.12)!important;}
@media(max-width:980px){#view-connections .connection-list{grid-template-columns:repeat(2,minmax(0,1fr))!important;}#view-connections .section-head:after{position:static;display:inline-flex;margin-top:14px;}}
@media(max-width:640px){
  #view-connections{padding-inline:0;}
  #view-connections .section-head{margin-inline:0;padding:20px 18px;border-radius:24px;}
  #view-connections .section-head:before{inset:10px;border-radius:19px;}
  #view-connections .connection-list{grid-template-columns:minmax(0,1fr)!important;gap:12px!important;}
  #view-connections .connection{padding:14px!important;border-radius:22px!important;}
  #view-connections .connection-account{grid-template-columns:minmax(0,1fr) auto;gap:7px 6px!important;}
  #view-connections .connection-account-copy{grid-column:1/2;}
  #view-connections .connection-account-name{grid-column:auto;}
  #view-connections .connection-account-badge{grid-column:2/3;justify-self:end;}
  #view-connections .connection-account-action{font-size:10.5px!important;padding-inline:8px!important;}
  #view-connections .connection-account-action:first-of-type{grid-column:1/2;justify-self:start;}
  #view-connections .connection-account-action:last-of-type{grid-column:2/3;justify-self:end;}
}
@media(max-width:360px){#view-connections .connection-account-action{padding-inline:7px!important;font-size:10px!important;}#view-connections .connection h3{font-size:16px!important;}#view-connections .connection-badge{padding-inline:7px!important;}}

/* 20260824 profile voices mobile fit: keep voice row actions inside card */
.voice-dialog .profile-card{
  max-height:min(88vh,calc(100dvh - 30px))!important;
  overflow:auto!important;
  -webkit-overflow-scrolling:touch;
}
.voice-dialog .voice-form button.primary[type="submit"]{
  position:sticky!important;
  bottom:0!important;
  z-index:3!important;
}
@media(max-width:640px){
  #profile-dialog.profile-dialog{
    padding:10px!important;
    align-items:flex-start!important;
  }
  #profile-dialog .profile-card{
    width:min(100%,390px)!important;
    max-width:calc(100vw - 20px)!important;
    max-height:calc(100dvh - 20px)!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch;
    box-sizing:border-box!important;
  }
  #profile-dialog #profile-email,
  #profile-dialog .profile-account-summary,
  #profile-dialog .profile-account-summary strong{
    min-width:0!important;
    max-width:100%!important;
    overflow-wrap:anywhere!important;
  }
  #profile-dialog .voice-library,
  #profile-dialog #voice-library-list,
  #profile-dialog .voice-item,
  #profile-dialog .voice-item>div:first-child,
  #profile-dialog .voice-item-actions{
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }
  #profile-dialog .voice-item{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    align-items:stretch!important;
    gap:10px!important;
    overflow:hidden!important;
  }
  #profile-dialog .voice-item>div:first-child strong,
  #profile-dialog .voice-item>div:first-child span{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  #profile-dialog .voice-item-actions{
    width:100%!important;
    justify-content:flex-start!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:7px!important;
  }
  #profile-dialog .voice-item-actions button{
    flex:1 1 calc(50% - 7px)!important;
    min-width:0!important;
    width:auto!important;
    max-width:100%!important;
    min-height:40px!important;
    padding:9px 10px!important;
  }
  #profile-dialog .voice-item-actions .icon,
  #profile-dialog .voice-item-actions .voice-delete{
    flex:0 0 44px!important;
    width:44px!important;
    min-width:44px!important;
    padding:0!important;
  }
  #profile-dialog .voice-library-actions{
    grid-template-columns:minmax(0,1fr)!important;
  }
  #profile-dialog .voice-library-actions button,
  #profile-dialog .profile-save{
    width:100%!important;
    min-width:0!important;
  }
}

/* 20260824 preferences premium plus-minus compact layout */
.preferences-dialog{width:min(560px,calc(100vw - 24px))!important;max-height:calc(100dvh - 20px)!important;overflow:hidden!important;}
.preferences-dialog .preferences-card{max-height:calc(100dvh - 24px);display:flex;flex-direction:column;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch;text-align:left!important;padding:24px!important;background:linear-gradient(180deg,rgba(18,19,23,.98),rgba(9,10,12,.98))!important;border:1px solid rgba(216,168,78,.22)!important;box-shadow:0 24px 80px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.04) inset!important;overscroll-behavior:contain;}
.preferences-dialog .preferences-card>.eyebrow,.preferences-dialog .preferences-card>h2,.preferences-dialog .preferences-card>#preferences-copy{text-align:left;flex:0 0 auto;}
.preferences-dialog .preferences-card>h2{margin:3px 0 4px!important;font-size:24px!important;letter-spacing:-.02em;}
.preferences-dialog .preferences-card>#preferences-copy{margin:0 0 12px!important;font-size:13px;line-height:1.45;color:#b9bec8;}
.preferences-sections{display:grid;gap:10px;overflow:visible!important;min-height:0;flex:0 0 auto;padding:1px 3px 2px 0;}
.preferences-section{border:1px solid rgba(255,255,255,.10);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.022));overflow:hidden;box-shadow:0 12px 36px rgba(0,0,0,.22);}
.preferences-section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(72px,auto) 34px;align-items:center;gap:10px;padding:12px 12px 8px 14px;color:var(--ink);font-weight:760;}
.preferences-section-head span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;line-height:1.22;}
.preferences-section-head em{min-width:0;max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-style:normal;color:#f7d992;border:1px solid rgba(216,168,78,.24);background:rgba(216,168,78,.09);border-radius:999px;padding:4px 8px;font-size:11px;font-weight:760;}
.preferences-section-toggle{width:32px;height:32px;border-radius:12px;border:1px solid rgba(216,168,78,.35);background:linear-gradient(180deg,rgba(216,168,78,.16),rgba(216,168,78,.06));color:#ffe3a0;font-size:22px;font-weight:900;line-height:1;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 8px 22px rgba(0,0,0,.20),0 0 0 1px rgba(255,255,255,.04) inset;cursor:pointer;}
.preferences-section-toggle:hover,.preferences-section-toggle:focus-visible{border-color:rgba(246,218,148,.72);background:linear-gradient(180deg,rgba(216,168,78,.28),rgba(216,168,78,.10));outline:none;transform:translateY(-1px);}
.preferences-section.is-collapsed{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.018));}
.preferences-section.is-collapsed>.provider-choice,.preferences-section.is-collapsed>.preferences-note,.preferences-section.is-collapsed>.youtube-video-current-card{display:none!important;}
.preferences-section .provider-choice{margin:0!important;padding:0 10px 11px!important;gap:7px!important;}
.preferences-section .provider-choice legend.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.preferences-section .provider-choice label{border-radius:13px!important;padding:9px 10px!important;gap:9px!important;align-items:center!important;background:rgba(7,8,10,.42)!important;border-color:rgba(255,255,255,.09)!important;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease;min-width:0!important;max-width:100%!important;box-sizing:border-box!important;}
.preferences-section .provider-choice label:hover{border-color:rgba(216,168,78,.32)!important;background:rgba(216,168,78,.055)!important;}
.preferences-section .provider-choice label:has(input:checked){border-color:rgba(216,168,78,.62)!important;background:linear-gradient(180deg,rgba(216,168,78,.13),rgba(216,168,78,.045))!important;box-shadow:0 0 0 1px rgba(216,168,78,.12) inset;}
.preferences-section .provider-choice input{margin-top:0!important;accent-color:#d8a84e;}
.preferences-section .provider-choice label>span{min-width:0!important;max-width:100%!important;}
.preferences-section .provider-choice strong{font-size:13px!important;line-height:1.25!important;font-weight:760!important;letter-spacing:-.01em!important;}
.preferences-section .provider-choice em{margin-top:3px!important;font-size:12px!important;line-height:1.38!important;font-weight:500!important;color:#aeb4c0;}
.preferences-section .preferences-note{margin:0 10px 8px!important;font-size:11px!important;line-height:1.35!important;color:#aeb4c0;}
.preferences-video-section{border-color:rgba(216,168,78,.20);background:linear-gradient(180deg,rgba(216,168,78,.075),rgba(255,255,255,.025));}
.youtube-video-current-card{position:sticky;top:0;z-index:2;margin:0 10px 10px;padding:12px 13px;border:1px solid rgba(216,168,78,.36);border-radius:15px;background:radial-gradient(circle at top left,rgba(216,168,78,.18),transparent 48%),linear-gradient(135deg,rgba(37,29,12,.98),rgba(16,16,18,.98));box-shadow:0 14px 32px rgba(0,0,0,.22),0 0 0 1px rgba(255,255,255,.04) inset;display:grid;gap:3px;}
.youtube-video-current-card span{color:#c5a360;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.10em;}
.youtube-video-current-card strong{color:#fff2bd;font-size:16px;line-height:1.25;font-weight:900;letter-spacing:-.01em;}
.preferences-video-section .youtube-video-style-choice{grid-template-columns:1fr;}
.preferences-video-section .youtube-video-style-choice .preferences-note{grid-column:1/-1;margin-bottom:3px!important;}
.preferences-video-section .youtube-video-style-choice label{position:relative;display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;min-width:0;padding:10px 11px!important;}
.preferences-video-section .youtube-video-style-choice label>span{min-width:0;}
.preferences-video-section .youtube-video-style-choice label>span>em{display:block;overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:break-word;}
.preferences-video-section .youtube-video-style-choice label small[data-youtube-video-style-state]{align-self:center;justify-self:end;min-height:22px;display:inline-flex;align-items:center;white-space:nowrap;border-radius:999px;padding:4px 8px;color:#c9ced8;font-size:10px;font-weight:800;letter-spacing:.01em;}
.preferences-video-section .youtube-video-style-choice label.is-selected{border-color:rgba(216,168,78,.86)!important;background:linear-gradient(180deg,rgba(216,168,78,.18),rgba(216,168,78,.07))!important;box-shadow:0 0 0 1px rgba(216,168,78,.20) inset,0 10px 26px rgba(216,168,78,.08);}
.preferences-video-section .youtube-video-style-choice label.is-selected small[data-youtube-video-style-state]{color:#15120a;background:linear-gradient(135deg,#f6da94,#d8a84e);box-shadow:0 8px 20px rgba(216,168,78,.18);}
.preferences-video-section .youtube-video-style-choice label.plan-locked:not(.is-selected){opacity:.72;}
.preferences-video-section .youtube-video-style-choice label.plan-locked:not(.is-selected) small[data-youtube-video-style-state]{border:1px solid rgba(216,168,78,.26);background:rgba(216,168,78,.08);color:#e6c77e;}
.preferences-video-section .youtube-video-style-choice label.plan-locked input{filter:grayscale(1);}
.preferences-subtitle-section .provider-choice label{grid-template-columns:auto minmax(0,1fr)!important;align-items:flex-start!important;}
.preferences-subtitle-section .provider-choice label>span>em{display:block;overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:break-word;}
.preferences-dialog .profile-save{flex:0 0 auto;margin-top:12px!important;position:sticky;bottom:0;z-index:5;box-shadow:0 -10px 22px rgba(8,9,11,.82)!important;}
@media(max-width:600px){
  .preferences-dialog{width:min(430px,calc(100vw - 16px))!important;max-height:calc(100dvh - 12px)!important;}
  .preferences-dialog .preferences-card{max-height:calc(100dvh - 16px);padding:18px 14px 14px!important;}
  .preferences-dialog .preferences-card>h2{font-size:22px!important;}
  .preferences-dialog .preferences-card>#preferences-copy{font-size:12px;}
  .preferences-section-head{padding:11px 10px 8px 11px;grid-template-columns:minmax(0,1fr) 34px;gap:6px 8px;}
  .preferences-section-head em{grid-column:1;max-width:100%;justify-self:start;}
  .preferences-section-toggle{grid-column:2;grid-row:1 / span 2;align-self:center;}
  .youtube-video-current-card{margin:0 9px 9px;padding:11px 12px;}
  .youtube-video-current-card strong{font-size:15px;}
  .preferences-section .provider-choice label{padding:8px 9px!important;}
  .preferences-video-section .youtube-video-style-choice label{grid-template-columns:auto minmax(0,1fr);}
  .preferences-video-section .youtube-video-style-choice label small[data-youtube-video-style-state]{grid-column:2;justify-self:start;margin-top:3px;padding:3px 7px;}
  .preferences-video-section .youtube-video-style-choice label>span>em{white-space:normal;display:block;overflow:visible;-webkit-line-clamp:unset;-webkit-box-orient:initial;}
}


/* Social multi-account Pro upsell */
.social-upgrade-dialog{width:min(500px,calc(100vw - 24px));border-color:rgba(216,168,78,.34)!important;background:#090a0c!important}
.social-upgrade-dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(8px)}
.social-upgrade-card{text-align:left!important;background:radial-gradient(circle at 88% 0,rgba(216,168,78,.20),transparent 34%),linear-gradient(180deg,#15120d,#090a0c)!important;border:1px solid rgba(216,168,78,.24);border-radius:24px}
.social-upgrade-mark{width:46px;height:46px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(135deg,#f6dc98,#d8a84e);color:#12100b;box-shadow:0 18px 42px rgba(216,168,78,.20);margin-bottom:14px}
.social-upgrade-mark svg{width:22px;height:22px}
.social-upgrade-card h2{text-align:left!important;margin:5px 0 8px!important;font:900 clamp(24px,5vw,34px) Manrope!important;letter-spacing:-.04em;color:#fff7e4}
.social-upgrade-card>p:not(.eyebrow){color:#d6c49c!important;line-height:1.6!important;margin-bottom:20px!important}
.social-upgrade-actions{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}
.social-upgrade-pro{justify-content:center;min-height:46px;background:linear-gradient(135deg,#f6dc98,#d8a84e)!important;color:#17120a!important;border:0!important;box-shadow:0 16px 36px rgba(216,168,78,.18)}
.social-upgrade-actions .secondary{min-height:46px;border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#f4f1e8}
.billing-plan.billing-plan-focus{animation:billing-plan-focus-pulse 1.8s ease both}
@keyframes billing-plan-focus-pulse{0%,100%{box-shadow:0 0 0 1px rgba(216,168,78,.20) inset,0 18px 48px rgba(216,168,78,.10)}35%,70%{box-shadow:0 0 0 2px rgba(255,218,141,.88) inset,0 0 0 5px rgba(216,168,78,.18),0 24px 62px rgba(216,168,78,.22)}}
@media(max-width:520px){.social-upgrade-card{padding:24px!important}.social-upgrade-actions{grid-template-columns:1fr}.social-upgrade-actions .secondary{width:100%;justify-content:center}}
/* n 604 : cocher les comptes qui recevront la publication. Une ligne par
   compte, la case a gauche, le badge PRINCIPAL a droite -- meme information
   que la liste deroulante d'avant, mais on peut en cocher plusieurs. */
.publication-account-choices{display:flex;flex-direction:column;gap:6px;margin-top:7px}
.publication-account-choice{display:flex;align-items:center;gap:8px;color:var(--ink);cursor:pointer}
.publication-account-choice input{width:auto;margin:0;flex:none}
.publication-account-choice .publication-account-copy{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:grid;gap:2px}
.publication-account-choice .publication-account-copy strong,.publication-account-choice .publication-account-copy small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
.publication-account-choice .publication-account-copy small{font-size:.8em;color:var(--muted)}
.publication-account-edit{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:4px;min-height:28px;padding:4px 8px;border:1px solid rgba(216,168,78,.26);border-radius:999px;background:rgba(216,168,78,.08);color:var(--ink);font-size:11px;font-weight:800;cursor:pointer}
.publication-account-edit svg{width:12px;height:12px}
.publication-account-edit:hover,.publication-account-edit:focus-visible{border-color:rgba(216,168,78,.58);background:rgba(216,168,78,.14);outline:0}
.publication-account-primary{flex:none;font-style:normal;font-size:.72em;letter-spacing:.06em;
  padding:2px 6px;border-radius:999px;border:1px solid currentColor;color:var(--muted)}

/* 20260824 schedule publication modal mobile fit polish.
   Scope: scheduled publication dialogs only — layout/visibility, no publishing logic. */
.schedule-dialog{
  width:min(560px,calc(100vw - 24px))!important;
  max-height:calc(100dvh - 24px)!important;
  overflow:hidden!important;
}
.schedule-dialog::backdrop{background:rgba(0,0,0,.70);backdrop-filter:blur(8px)}
.schedule-dialog .schedule-card{
  position:relative;
  display:flex!important;
  flex-direction:column;
  max-height:calc(100dvh - 24px)!important;
  overflow:hidden!important;
  padding:24px!important;
  border-color:rgba(216,168,78,.24)!important;
  background:linear-gradient(180deg,rgba(20,18,14,.98),rgba(9,10,12,.98))!important;
}
.schedule-dialog .schedule-card .profile-close{
  top:12px!important;
  right:12px!important;
  width:34px!important;
  height:34px!important;
  min-height:34px!important;
  border-radius:12px!important;
  border:1px solid rgba(216,168,78,.22)!important;
  background:rgba(255,255,255,.045)!important;
  color:#efd591!important;
  box-shadow:none!important;
  outline:0!important;
}
.schedule-dialog .schedule-card .profile-close svg{width:15px!important;height:15px!important;stroke-width:2!important}
.schedule-dialog .schedule-card .profile-close:hover,
.schedule-dialog .schedule-card .profile-close:focus-visible{
  border-color:rgba(216,168,78,.62)!important;
  background:rgba(216,168,78,.10)!important;
  color:#fff1c3!important;
  box-shadow:0 0 0 3px rgba(216,168,78,.16)!important;
}
.schedule-dialog .schedule-card .eyebrow{flex:none;margin-right:34px;margin-left:34px}
.schedule-dialog .schedule-card h2{
  flex:none;
  margin:4px 34px 14px!important;
  font-size:clamp(24px,4.8vw,32px)!important;
  line-height:1.05!important;
}
.schedule-dialog .schedule-picker{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  gap:12px!important;
  padding:1px 2px 2px;
}
.schedule-dialog .schedule-native-fields{grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:14px!important;row-gap:8px!important}
.schedule-dialog .schedule-native-fields label{gap:6px!important;min-width:0}
.schedule-dialog .schedule-native-fields input,
.schedule-dialog .profile-field select{
  min-width:0;
  min-height:46px!important;
  border-radius:12px!important;
  font-size:14px!important;
  padding:10px 11px!important;
}
.schedule-dialog .publication-account-field{min-width:0;margin:0!important;display:grid!important;gap:7px!important}
.schedule-dialog .publication-account-field>span,
.schedule-dialog .youtube-privacy-field>span{
  color:#d6c49c!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.07em!important;
  text-transform:uppercase!important;
}
.schedule-dialog .publication-account-choices{gap:7px!important;margin-top:0!important;min-width:0}
.schedule-dialog .publication-account-choice{
  display:grid!important;
  grid-template-columns:16px minmax(0,1fr) auto auto;
  align-items:center!important;
  gap:8px!important;
  min-width:0;
  min-height:38px;
  padding:8px 9px!important;
  border:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  background:rgba(255,255,255,.035);
}
.schedule-dialog .publication-account-choice input[type="checkbox"]{
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  display:grid;
  place-items:center;
  box-sizing:border-box;
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  padding:0!important;
  margin:0!important;
  border:1px solid rgba(216,168,78,.54);
  border-radius:5px;
  background:rgba(8,9,11,.88);
  box-shadow:0 0 0 1px rgba(255,255,255,.04) inset;
  accent-color:#d8a84e;
}
.schedule-dialog .publication-account-choice input[type="checkbox"]::after{
  content:"";
  width:4px;
  height:7px;
  border:solid #151009;
  border-width:0 1.8px 1.8px 0;
  transform:translateY(-1px) rotate(45deg) scale(0);
  transform-origin:center;
}
.schedule-dialog .publication-account-choice input[type="checkbox"]:checked{
  border-color:#e5b95e;
  background:linear-gradient(135deg,#f7dda0,#d8a84e);
}
.schedule-dialog .publication-account-choice input[type="checkbox"]:checked::after{
  transform:translateY(-1px) rotate(45deg) scale(1);
}
.schedule-dialog .publication-account-choice input[type="checkbox"]:focus-visible{
  outline:0;
  box-shadow:0 0 0 3px rgba(216,168,78,.18);
}
.schedule-dialog .publication-account-choice .publication-account-copy{
  min-width:0;
  font-size:12px;
  line-height:1.25;
}
.schedule-dialog .publication-account-edit{min-height:26px!important;padding:5px 7px!important;font-size:10px!important;color:#edd18a!important;background:rgba(216,168,78,.08)!important;border-color:rgba(216,168,78,.24)!important}
.schedule-dialog .publication-account-primary{
  max-width:100%;
  padding:2px 6px!important;
  border-color:rgba(216,168,78,.36)!important;
  background:rgba(216,168,78,.09);
  color:#e7c672!important;
  font-size:9px!important;
  line-height:1.2!important;
  white-space:nowrap;
}
.schedule-dialog .publication-account-remove{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  min-height:24px!important;
  padding:4px 7px!important;
  border:1px solid rgba(255,104,104,.32)!important;
  border-radius:999px!important;
  background:rgba(255,78,78,.08)!important;
  color:#ffb7b7!important;
  font-size:10px!important;
  font-weight:850!important;
  line-height:1!important;
}
.schedule-dialog .publication-account-remove svg{width:12px!important;height:12px!important;}
.schedule-dialog .schedule-preview{
  padding:10px 12px!important;
  border-radius:12px!important;
  font-size:13px!important;
  line-height:1.35!important;
  text-align:left!important;
}
.schedule-dialog .schedule-card>.lyrics-actions{
  flex:none;
  position:sticky;
  bottom:0;
  z-index:2;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto;
  gap:9px!important;
  margin:14px -24px -24px!important;
  padding:12px 24px calc(12px + env(safe-area-inset-bottom,0px))!important;
  border-top:1px solid rgba(216,168,78,.18);
  background:linear-gradient(180deg,rgba(14,13,11,.94),rgba(7,8,10,.99));
  box-shadow:0 -16px 34px rgba(0,0,0,.32);
}
.schedule-dialog .schedule-card>.lyrics-actions .primary,
.schedule-dialog .schedule-card>.lyrics-actions .secondary{
  min-height:44px!important;
  border-radius:999px!important;
  padding:10px 16px!important;
}
.schedule-dialog .schedule-card>.lyrics-actions .primary{width:100%;box-shadow:0 14px 34px rgba(216,168,78,.16)}
@media(max-width:600px){
  .schedule-dialog .schedule-native-fields{grid-template-columns:1fr!important;column-gap:0!important;row-gap:12px!important}
  .schedule-dialog .schedule-native-fields label{width:100%!important;min-width:0!important}
  .schedule-dialog .schedule-native-fields input{width:100%!important;box-sizing:border-box!important}
}
@media(max-width:480px){
  .schedule-dialog{width:calc(100vw - 12px)!important;max-height:calc(100dvh - 12px)!important}
  .schedule-dialog .schedule-card{max-height:calc(100dvh - 12px)!important;padding:18px 14px 0!important}
  .schedule-dialog .schedule-card .profile-close{top:9px!important;right:9px!important;width:32px!important;height:32px!important;min-height:32px!important}
  .schedule-dialog .schedule-card .eyebrow{margin:0 34px 0!important;font-size:10px!important}
  .schedule-dialog .schedule-card h2{margin:3px 34px 10px!important;font-size:23px!important}
  .schedule-dialog .schedule-picker{gap:9px!important;padding-bottom:2px}
  .schedule-dialog .schedule-native-fields{grid-template-columns:1fr!important;column-gap:0!important;row-gap:12px!important}
  .schedule-dialog .schedule-native-fields label{width:100%!important}
  .schedule-dialog .schedule-native-fields input,
  .schedule-dialog .profile-field select{width:100%!important;min-height:42px!important;font-size:13px!important;padding:9px 10px!important}
  .schedule-dialog .publication-account-choice{grid-template-columns:14px minmax(0,1fr) auto;min-height:34px;padding:6px 7px!important;gap:7px!important}
  .schedule-dialog .publication-account-choice input[type="checkbox"]{width:14px!important;height:14px!important;min-width:14px!important;min-height:14px!important;border-radius:4px}
  .schedule-dialog .publication-account-choice input[type="checkbox"]::after{width:3.5px;height:6px;border-width:0 1.6px 1.6px 0}
  .schedule-dialog .publication-account-choice span{font-size:11.5px}
  .schedule-dialog .publication-account-primary{font-size:8px!important;padding:2px 5px!important;letter-spacing:.04em!important}
  .schedule-dialog .schedule-preview{font-size:10.5px!important;line-height:1.15!important;padding:5px 9px!important}
  .schedule-dialog .schedule-card>.lyrics-actions{grid-template-columns:minmax(0,1fr) auto;margin:10px -14px 0!important;padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px))!important}
  .schedule-dialog .schedule-card>.lyrics-actions .primary{width:100%;min-height:42px!important}
  .schedule-dialog .schedule-card>.lyrics-actions .secondary{width:auto;min-width:72px;min-height:42px!important;padding-inline:13px!important}
}
@media(max-width:340px){
  .schedule-dialog .schedule-native-fields{grid-template-columns:1fr!important;row-gap:9px!important}
}

/* Schedule modal: keep Date/Time side-by-side on phones with a wider dark center gap. */
@media(max-width:600px){
  .schedule-dialog .schedule-picker{
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
  }
  .schedule-dialog .schedule-native-fields{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,calc(50% - 26px)))!important;
    column-gap:24px!important;
    row-gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
    margin:0!important;
    justify-content:center!important;
    align-items:start!important;
    overflow:visible!important;
  }
  .schedule-dialog .schedule-native-fields label{
    width:auto!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }
  .schedule-dialog .schedule-native-fields input{
    display:block!important;
    width:100%!important;
    inline-size:100%!important;
    max-width:100%!important;
    max-inline-size:100%!important;
    min-width:0!important;
    min-inline-size:0!important;
    box-sizing:border-box!important;
  }
}

@media(max-width:480px){
  .schedule-dialog .schedule-native-fields{
    grid-template-columns:repeat(2,minmax(0,calc(50% - 26px)))!important;
    column-gap:24px!important;
    row-gap:8px!important;
  }
  .schedule-dialog .schedule-native-fields input{
    min-height:40px!important;
    padding:7px 6px!important;
    font-size:11px!important;
    letter-spacing:-.02em!important;
  }
}

@media(max-width:340px){
  .schedule-dialog .schedule-native-fields{
    grid-template-columns:repeat(2,minmax(0,calc(50% - 22px)))!important;
    column-gap:18px!important;
  }
  .schedule-dialog .schedule-native-fields input{
    padding-inline:5px!important;
    font-size:10.5px!important;
  }
}

/* Feedback rating selected/focus state must stay Sakira gold after late global button rules. */
#feedback-dialog .feedback-star.selected,
#feedback-dialog .feedback-star.selected:focus,
#feedback-dialog .feedback-star.selected:focus-visible{
  color:#f6d77f!important;
  border-color:rgba(246,215,127,.72)!important;
  background:linear-gradient(180deg,rgba(216,168,78,.26),rgba(216,168,78,.10))!important;
  box-shadow:0 0 0 3px rgba(216,168,78,.18),0 10px 28px rgba(216,168,78,.12)!important;
  text-shadow:0 0 18px rgba(246,215,127,.42)!important;
}

/* Create page mobile polish: keep Advanced toggle and CTA inside the card. */
@media(max-width:700px){
  #view-create #create-form.composer{
    padding-inline:18px;
  }
  #view-create .create-advanced{
    border-radius:20px;
    overflow:hidden;
  }
  #view-create .create-advanced>summary{
    position:relative;
    min-height:86px;
    padding:16px 58px 16px 18px;
    gap:8px;
  }
  #view-create .create-advanced>summary:after{
    top:50%;
    right:16px;
    transform:translateY(-50%);
    width:34px;
    height:34px;
    border-color:rgba(216,168,78,.38);
    background:linear-gradient(180deg,rgba(216,168,78,.12),rgba(255,255,255,.035));
    box-shadow:0 10px 24px rgba(0,0,0,.24),0 0 0 1px rgba(255,255,255,.035) inset;
    font-size:20px;
    line-height:1;
  }
  #view-create .create-advanced>summary small{
    max-width:100%;
    line-height:1.35;
  }
  #view-create .composer-actions{
    display:grid;
    grid-template-columns:1fr;
    align-items:stretch;
    gap:13px;
    padding-top:18px;
  }
  #view-create .composer-actions span{
    max-width:30rem;
    color:#aeb4bd;
    font-size:13px;
    line-height:1.38;
  }
  #view-create .composer-actions .primary{
    width:100%;
    justify-content:center;
    min-height:58px;
    padding:14px 18px!important;
    border-radius:20px!important;
    border:1px solid rgba(255,221,139,.36)!important;
    background:linear-gradient(135deg,#e0b85d,#c89236 52%,#9f651f)!important;
    color:#170f08!important;
    font-size:16px;
    font-weight:950;
    line-height:1.12;
    text-align:center;
    white-space:normal;
    box-shadow:0 18px 36px rgba(216,168,78,.22),0 1px 0 rgba(255,255,255,.28) inset;
  }
  #view-create .composer-actions .primary svg{
    flex:0 0 auto;
    width:18px;
    height:18px;
  }
}

/* create-desktop-composer-premium-20260827: give the desktop Create card the same black/gold blended shell as mobile. */
@media(min-width:701px){
  #view-create #create-form.composer{
    position:relative;
    overflow:hidden;
    border-color:rgba(216,168,78,.24)!important;
    border-radius:30px!important;
    background:
      radial-gradient(circle at 8% -14%,rgba(216,168,78,.22),transparent 36%),
      radial-gradient(circle at 98% 116%,rgba(216,168,78,.13),transparent 30%),
      linear-gradient(135deg,rgba(20,18,14,.985),rgba(9,10,13,.99) 56%,rgba(18,15,10,.985))!important;
    box-shadow:0 30px 82px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.055)!important;
  }
  #view-create #create-form.composer:before{
    content:"";
    position:absolute;
    inset:-1px;
    pointer-events:none;
    background:
      linear-gradient(120deg,rgba(255,255,255,.075),transparent 28%,transparent 72%,rgba(216,168,78,.08)),
      radial-gradient(circle at 16% 0%,rgba(255,221,139,.12),transparent 28%);
    opacity:.78;
  }
  #view-create #create-form.composer > *{
    position:relative;
    z-index:1;
  }
}


/* Trash premium archive polish — scoped to the Trash view only. */
#view-trash.trash-view{
  width:min(100%,1120px);
  margin:0 auto;
  padding-bottom:24px;
}
#view-trash .trash-hero{
  position:relative;
  align-items:stretch!important;
  gap:18px;
  margin-bottom:18px!important;
  padding:22px;
  border:1px solid rgba(216,168,78,.24);
  border-radius:28px;
  background:
    radial-gradient(circle at 14% 0%,rgba(216,168,78,.24),transparent 34%),
    linear-gradient(135deg,rgba(20,20,25,.98),rgba(9,10,13,.98) 56%,rgba(33,24,11,.95));
  box-shadow:0 24px 80px rgba(0,0,0,.46),0 0 0 1px rgba(255,255,255,.035) inset;
  overflow:hidden;
}
#view-trash .trash-hero:after{
  content:"";
  position:absolute;
  inset:auto -48px -90px auto;
  width:210px;
  height:210px;
  border-radius:999px;
  background:radial-gradient(circle,rgba(216,168,78,.18),transparent 67%);
  pointer-events:none;
}
#view-trash .trash-hero>div{
  position:relative;
  z-index:1;
  min-width:0;
}
#view-trash .trash-hero .eyebrow{
  margin:0 0 8px!important;
  color:#d8a84e!important;
  font:900 10px/1.2 Manrope,Inter,"Sakira JP",sans-serif!important;
  letter-spacing:.18em!important;
}
#view-trash .trash-hero h2{
  margin:0!important;
  color:#fff8e6!important;
  font:900 clamp(26px,6vw,42px)/.98 Manrope,Inter,"Sakira JP",sans-serif!important;
  letter-spacing:-.06em!important;
}
#view-trash .trash-hero p:not(.eyebrow){
  max-width:600px;
  margin:9px 0 0!important;
  color:#bfc2c8!important;
  font-size:14px!important;
  line-height:1.55!important;
}
#view-trash .trash-refresh{
  position:relative;
  z-index:1;
  align-self:flex-start;
  flex:0 0 auto;
  width:46px!important;
  height:46px!important;
  display:inline-grid!important;
  place-items:center!important;
  border:1px solid rgba(216,168,78,.30)!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,rgba(216,168,78,.16),rgba(255,255,255,.045))!important;
  color:#f8df9b!important;
  box-shadow:0 14px 34px rgba(0,0,0,.28),0 0 0 1px rgba(255,255,255,.035) inset!important;
}
#view-trash .trash-refresh:hover,
#view-trash .trash-refresh:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(246,215,127,.58)!important;
  color:#fff1bf!important;
  outline:none;
  box-shadow:0 0 0 3px rgba(216,168,78,.16),0 18px 40px rgba(0,0,0,.32)!important;
}
#view-trash .trash-list{
  display:grid!important;
  gap:12px!important;
  min-width:0;
}
#view-trash .trash-group-title{
  display:flex;
  align-items:center;
  gap:10px;
  margin:20px 0 2px!important;
  color:#f3d78f!important;
  font:950 11px/1.2 Manrope,Inter,"Sakira JP",sans-serif!important;
  letter-spacing:.17em!important;
}
#view-trash .trash-group-title:after{
  content:"";
  height:1px;
  flex:1 1 auto;
  min-width:28px;
  background:linear-gradient(90deg,rgba(216,168,78,.32),transparent);
}
#view-trash .trash-row{
  position:relative;
  grid-template-columns:minmax(0,1.45fr) minmax(160px,.95fr) minmax(150px,auto) minmax(150px,auto)!important;
  align-items:center!important;
  gap:14px!important;
  min-width:0;
  padding:17px 18px!important;
  border:1px solid rgba(216,168,78,.18)!important;
  border-radius:24px!important;
  background:
    radial-gradient(circle at 0% 0%,rgba(216,168,78,.13),transparent 32%),
    linear-gradient(135deg,rgba(18,19,24,.98),rgba(10,11,14,.98) 58%,rgba(25,21,15,.96))!important;
  box-shadow:0 18px 54px rgba(0,0,0,.34),0 0 0 1px rgba(255,255,255,.03) inset!important;
  overflow:hidden;
}
#view-trash .trash-row:before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:linear-gradient(180deg,#f3d78f,#a86d24);
  opacity:.82;
}
#view-trash .trash-row-main,
#view-trash .trash-row-copy,
#view-trash .trash-row-meta,
#view-trash .trash-actions{
  position:relative;
  z-index:1;
  min-width:0;
}
#view-trash .trash-item-kicker{
  display:inline-flex;
  margin-bottom:7px;
  color:#d8a84e;
  font:900 9px/1 Manrope,Inter,"Sakira JP",sans-serif;
  letter-spacing:.15em;
  text-transform:uppercase;
}
#view-trash .trash-row strong{
  color:#fff7e4!important;
  font:900 15px/1.22 Manrope,Inter,"Sakira JP",sans-serif!important;
  letter-spacing:-.025em;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#view-trash .trash-row small{
  display:block;
  margin-top:5px!important;
  color:#aeb4bd!important;
  font-size:12px!important;
  line-height:1.35!important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#view-trash .trash-row-copy{
  margin:0!important;
  color:#9ca2ac!important;
  font-size:12px!important;
  line-height:1.45!important;
}
#view-trash .trash-row-meta{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
#view-trash .trash-count-badge,
#view-trash .trash-date-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  max-width:100%;
  min-height:32px;
  padding:7px 10px;
  border:1px solid rgba(216,168,78,.18);
  border-radius:999px;
  background:rgba(255,255,255,.045);
  color:#e7d9ba;
  font:850 11px/1 Manrope,Inter,"Sakira JP",sans-serif;
  white-space:nowrap;
}
#view-trash .trash-count-badge svg,
#view-trash .trash-date-badge svg,
#view-trash .trash-restore-button svg{
  width:14px;
  height:14px;
  flex:0 0 auto;
}
#view-trash .trash-date-badge time{
  margin:0!important;
  color:inherit!important;
  font:inherit!important;
}
#view-trash .trash-actions{
  justify-content:flex-end!important;
  gap:8px!important;
}
#view-trash .trash-actions button{
  min-height:40px;
  border-radius:999px!important;
  font:900 12px/1 Manrope,Inter,"Sakira JP",sans-serif!important;
}
#view-trash .trash-restore-button{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid rgba(246,215,127,.48)!important;
  background:linear-gradient(135deg,#e3bd61,#c89236 58%,#96611f)!important;
  color:#160f08!important;
  padding:11px 15px!important;
  box-shadow:0 12px 28px rgba(216,168,78,.20),0 1px 0 rgba(255,255,255,.28) inset!important;
}
#view-trash .trash-restore-button:hover,
#view-trash .trash-restore-button:focus-visible{
  transform:translateY(-1px);
  filter:saturate(1.05) brightness(1.04);
  outline:none;
}
#view-trash .trash-actions .danger{
  padding:10px 13px!important;
  border-color:rgba(248,113,113,.28)!important;
  background:rgba(255,255,255,.035)!important;
  color:#ffb4b4!important;
}
#view-trash .trash-empty-state{
  display:grid!important;
  place-items:center;
  gap:9px;
  margin-top:6px;
  padding:42px 22px!important;
  border:1px solid rgba(216,168,78,.20)!important;
  border-radius:26px!important;
  background:radial-gradient(circle at 50% 0%,rgba(216,168,78,.18),transparent 44%),linear-gradient(180deg,rgba(18,19,24,.96),rgba(10,11,14,.98))!important;
  color:#f4f1e8!important;
  text-align:center!important;
  box-shadow:0 18px 58px rgba(0,0,0,.32);
}
#view-trash .trash-empty-state svg{
  width:30px;
  height:30px;
  color:#f3d78f;
}
#view-trash .trash-empty-state strong{
  color:#fff7e4;
  font:900 18px/1.2 Manrope,Inter,"Sakira JP",sans-serif;
}
#view-trash .trash-empty-state span{
  max-width:460px;
  color:#aeb4bd;
  font-size:13px;
  line-height:1.5;
}
@media(max-width:820px){
  #view-trash .trash-row{
    grid-template-columns:minmax(0,1fr) minmax(126px,auto)!important;
    grid-template-areas:"main actions" "copy copy" "meta meta";
    align-items:start!important;
  }
  #view-trash .trash-row-main{grid-area:main;}
  #view-trash .trash-row-copy{grid-area:copy;}
  #view-trash .trash-row-meta{grid-area:meta;justify-content:flex-start;}
  #view-trash .trash-actions{grid-area:actions;align-self:start;}
}
@media(max-width:600px){
  #view-trash.trash-view{
    padding-inline:0;
  }
  #view-trash .trash-hero{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto;
    padding:19px 16px!important;
    border-radius:24px!important;
  }
  #view-trash .trash-hero h2{
    font-size:31px!important;
  }
  #view-trash .trash-hero p:not(.eyebrow){
    font-size:12.5px!important;
    line-height:1.45!important;
  }
  #view-trash .trash-refresh{
    width:42px!important;
    height:42px!important;
    border-radius:15px!important;
  }
  #view-trash .trash-list{
    gap:10px!important;
  }
  #view-trash .trash-row{
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-areas:"main" "copy" "meta" "actions";
    gap:11px!important;
    padding:16px 15px!important;
    border-radius:22px!important;
  }
  #view-trash .trash-row strong,
  #view-trash .trash-row small{
    white-space:normal;
  }
  #view-trash .trash-actions{
    justify-content:stretch!important;
    width:100%;
  }
  #view-trash .trash-actions button{
    flex:1 1 140px;
    min-width:0;
  }
  #view-trash .trash-restore-button{
    min-height:46px;
  }
}
@media(max-width:340px){
  #view-trash .trash-hero{
    padding:16px 13px!important;
  }
  #view-trash .trash-row{
    padding:14px 12px!important;
  }
  #view-trash .trash-actions button{
    flex-basis:100%;
  }
}

/* all-projects-premium-library-20260825: scoped black/gold project library polish */
#view-projects{
  max-width:1240px;
  margin:0 auto;
  padding-bottom:calc(96px + env(safe-area-inset-bottom,0px));
}
#view-projects .section-head{
  position:relative;
  align-items:flex-end!important;
  margin:0 0 18px!important;
  padding:24px 24px 22px!important;
  border:1px solid rgba(216,168,78,.22)!important;
  border-radius:30px!important;
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 4%,rgba(216,168,78,.20),transparent 34%),
    linear-gradient(135deg,rgba(20,18,14,.98),rgba(10,11,14,.98) 58%,rgba(18,15,10,.98))!important;
  box-shadow:0 28px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.055)!important;
}
#view-projects .section-head::before{
  content:"STUDIO LIBRARY";
  display:inline-flex;
  width:max-content;
  margin:0 0 9px;
  padding:5px 10px;
  border:1px solid rgba(216,168,78,.30);
  border-radius:999px;
  background:rgba(216,168,78,.09);
  color:#f1c86d;
  font:900 10px/1 Inter,"Sakira JP",sans-serif;
  letter-spacing:.16em;
}
#view-projects .section-head::after{
  content:"";
  position:absolute;
  inset:auto -70px -105px auto;
  width:240px;
  height:240px;
  border-radius:999px;
  background:radial-gradient(circle,rgba(216,168,78,.18),transparent 64%);
  pointer-events:none;
}
#view-projects .section-head>div{
  position:relative;
  z-index:1;
  max-width:720px;
}
#view-projects .section-head h2{
  margin:0!important;
  font:900 clamp(28px,5vw,46px)/.98 Manrope,Inter,"Sakira JP",sans-serif!important;
  letter-spacing:-.055em!important;
  color:#fff8ea!important;
}
#view-projects .section-head p{
  max-width:620px;
  margin:10px 0 0!important;
  color:#b9ad93!important;
  font:600 14px/1.55 Inter,"Sakira JP",sans-serif!important;
}
#view-projects .project-filter-bar{
  grid-template-columns:auto minmax(130px,.8fr) minmax(160px,.95fr) minmax(150px,.9fr) minmax(250px,1.35fr)!important;
  gap:10px!important;
  margin:0 0 14px!important;
  padding:10px!important;
  border-radius:22px!important;
  border-color:rgba(216,168,78,.24)!important;
  background:linear-gradient(180deg,rgba(18,19,23,.94),rgba(10,11,14,.94))!important;
  box-shadow:0 18px 48px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.045)!important;
}
#view-projects .project-filter-bar .filter-title{
  padding-left:3px;
  color:#f2e8d3!important;
}
#view-projects .project-filter-bar label{
  min-height:40px!important;
  padding:3px 5px 3px 10px!important;
  border:1px solid rgba(255,255,255,.07)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.025)!important;
}
#view-projects .project-filter-bar select,
#view-projects .project-filter-bar .filter-search input{
  height:34px!important;
  border-color:rgba(216,168,78,.14)!important;
  background:linear-gradient(180deg,#15171d,#101116)!important;
  color:#f7f1e5!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
#view-projects .project-filter-bar .filter-search{
  padding-left:12px!important;
}
#view-projects .project-filter-bar .filter-search svg{
  width:16px!important;
  height:16px!important;
  color:#d8a84e!important;
}
#view-projects .project-filter-bar .filter-search input{
  font-size:13px!important;
}
#view-projects .project-list{
  display:grid!important;
  gap:12px!important;
}
#view-projects .project-table-header{
  margin:0 0 4px!important;
  border-radius:16px!important;
  border:1px solid rgba(255,255,255,.065)!important;
  background:linear-gradient(180deg,rgba(13,15,18,.86),rgba(9,10,12,.82))!important;
  box-shadow:0 12px 26px rgba(0,0,0,.32)!important;
}
#view-projects .project-row{
  position:relative!important;
  min-height:92px!important;
  padding:18px 18px 18px 20px!important;
  border:1px solid rgba(216,168,78,.17)!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:
    linear-gradient(90deg,rgba(216,168,78,.18),rgba(216,168,78,0) 4px),
    radial-gradient(circle at 8% 0%,rgba(216,168,78,.10),transparent 32%),
    linear-gradient(135deg,rgba(22,23,28,.96),rgba(12,13,16,.98) 62%,rgba(17,14,10,.96))!important;
  box-shadow:0 18px 46px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.045)!important;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease!important;
}
#view-projects .project-row:hover,
#view-projects .project-row:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(216,168,78,.42)!important;
  box-shadow:0 24px 62px rgba(0,0,0,.38),0 0 0 1px rgba(216,168,78,.06),inset 0 1px 0 rgba(255,255,255,.06)!important;
  outline:none!important;
}
#view-projects .project-title-cell{
  display:grid!important;
  gap:7px!important;
  min-width:0!important;
}
#view-projects .project-row strong{
  display:block!important;
  color:#fff7e8!important;
  font:900 16px/1.18 Manrope,Inter,"Sakira JP",sans-serif!important;
  letter-spacing:-.026em!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#view-projects .project-row small{
  margin:0!important;
  color:#958f82!important;
  font:550 12px/1.42 Inter,"Sakira JP",sans-serif!important;
  letter-spacing:0!important;
}
#view-projects .project-row>p{
  color:#c5b58d!important;
  font:750 12px/1.35 Inter,"Sakira JP",sans-serif!important;
}
#view-projects .project-row .status{
  justify-self:start!important;
  min-height:25px!important;
  padding:6px 10px!important;
  border:1px solid rgba(216,168,78,.18)!important;
  border-radius:999px!important;
  background:rgba(216,168,78,.10)!important;
  color:#f0ca78!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
#view-projects .project-row .status.ready,
#view-projects .project-row .status.done,
#view-projects .project-row .status.completed,
#view-projects .project-row .status.published{
  border-color:rgba(111,213,143,.24)!important;
  background:rgba(43,105,67,.24)!important;
  color:#8fe0a8!important;
}
#view-projects .project-platform-statuses{
  gap:5px!important;
  margin-top:1px!important;
}
#view-projects .project-platform-status{
  min-height:21px!important;
  padding:4px 7px!important;
  border-radius:999px!important;
  border-color:rgba(216,168,78,.14)!important;
  background:rgba(255,255,255,.035)!important;
  color:#aaa394!important;
  font:850 9.5px/1 Inter,"Sakira JP",sans-serif!important;
  letter-spacing:.055em!important;
}
#view-projects .project-platform-status.published{
  border-color:rgba(216,168,78,.30)!important;
  background:linear-gradient(135deg,rgba(216,168,78,.18),rgba(69,139,87,.18))!important;
  color:#f1d08a!important;
}
#view-projects .project-platform-status.scheduled{
  border-color:rgba(255,202,100,.28)!important;
  background:rgba(92,65,25,.34)!important;
  color:#ffd684!important;
}
#view-projects .project-row time,
#view-projects .project-row .row-cost{
  color:#a69b84!important;
  font:700 12px/1.3 Inter,"Sakira JP",sans-serif!important;
}
#view-projects .project-row .row-cost:not(:empty){
  min-height:25px;
  padding:6px 9px;
  border-radius:999px;
  border:1px solid rgba(216,168,78,.18);
  background:rgba(216,168,78,.08);
  color:#f0ca78!important;
}
#view-projects .project-row-actions{
  align-self:center!important;
  gap:7px!important;
}
#view-projects .project-list-delete{
  width:38px!important;
  height:38px!important;
  border-color:rgba(255,255,255,.09)!important;
  background:rgba(255,255,255,.035)!important;
  color:#b8b0a2!important;
  box-shadow:none!important;
}
#view-projects .project-list-delete:hover,
#view-projects .project-list-delete:focus-visible{
  border-color:rgba(255,132,118,.42)!important;
  background:rgba(255,92,92,.10)!important;
  color:#ffad9f!important;
  outline:none!important;
}
#view-projects .project-row-actions>svg{
  width:34px!important;
  height:34px!important;
  padding:8px!important;
  border:1px solid rgba(216,168,78,.17)!important;
  border-radius:999px!important;
  background:rgba(216,168,78,.07)!important;
  color:#e7c275!important;
}
#view-projects .project-count-footer{
  justify-self:center;
  margin:8px 0 0;
  padding:8px 12px;
  border:1px solid rgba(216,168,78,.14);
  border-radius:999px;
  background:rgba(255,255,255,.025);
  color:#9d9481;
  font:750 11px/1.25 Inter,"Sakira JP",sans-serif;
}
@media(max-width:1100px){
  #view-projects .project-row{
    grid-template-columns:minmax(0,1fr) auto auto auto!important;
  }
}
@media(max-width:900px){
  #view-projects .section-head{
    align-items:flex-start!important;
    border-radius:26px!important;
    padding:21px 20px!important;
  }
  #view-projects .project-filter-bar{
    grid-template-columns:1fr!important;
    padding:10px!important;
  }
  #view-projects .project-filter-bar label{
    width:100%!important;
  }
  #view-projects .project-filter-bar select{
    width:100%!important;
  }
}
@media(max-width:600px){
  #view-projects{
    padding-inline:0;
  }
  #view-projects .section-head{
    margin-bottom:12px!important;
    padding:19px 16px 20px!important;
    border-radius:24px!important;
  }
  #view-projects .section-head::before{
    margin-bottom:8px;
    padding:4px 9px;
    font-size:9px;
  }
  #view-projects .section-head h2{
    font-size:32px!important;
    letter-spacing:-.06em!important;
  }
  #view-projects .section-head p{
    font-size:12.5px!important;
    line-height:1.45!important;
  }
  #view-projects .project-filter-bar{
    margin:0 0 12px!important;
    padding:7px!important;
    border-radius:18px!important;
    border-color:rgba(216,168,78,.22)!important;
    background:linear-gradient(180deg,rgba(20,21,25,.96),rgba(11,12,15,.96))!important;
    box-shadow:0 14px 32px rgba(0,0,0,.28)!important;
  }
  #view-projects .project-filter-bar .filter-search{
    min-height:46px!important;
    padding:4px 6px 4px 12px!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.035)!important;
  }
  #view-projects .project-filter-bar .filter-search input{
    height:38px!important;
    padding:8px 11px!important;
    font-size:16px!important;
  }
  #view-projects .project-list{
    gap:10px!important;
  }
  #view-projects .project-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:12px!important;
    min-height:0!important;
    padding:15px!important;
    border-radius:22px!important;
  }
  #view-projects .project-title-cell{
    gap:7px!important;
  }
  #view-projects .project-row strong{
    font-size:15px!important;
  }
  #view-projects .project-row small{
    -webkit-line-clamp:2!important;
    font-size:11.5px!important;
    line-height:1.38!important;
    color:#918a7d!important;
  }
  #view-projects .project-platform-statuses{
    max-width:100%;
    gap:4px!important;
  }
  #view-projects .project-platform-status{
    min-height:20px!important;
    max-width:100%!important;
    padding:4px 6px!important;
    font-size:8.8px!important;
  }
  #view-projects .project-mobile-generated-date{
    margin-top:1px!important;
    padding:5px 8px!important;
    border-color:rgba(216,168,78,.18)!important;
    background:rgba(216,168,78,.075)!important;
    color:#d6bd82!important;
    font-size:10.5px!important;
  }
  #view-projects .project-row .status{
    grid-column:1!important;
    grid-row:auto!important;
    width:max-content!important;
    max-width:100%!important;
    min-height:23px!important;
    padding:5px 8px!important;
    font-size:10px!important;
  }
  #view-projects .project-row-actions{
    grid-column:2!important;
    grid-row:1 / span 2!important;
    align-self:start!important;
    display:grid!important;
    grid-template-columns:38px!important;
    gap:7px!important;
  }
  #view-projects .project-list-delete,
  #view-projects .project-row-actions>svg{
    width:38px!important;
    height:38px!important;
  }
}
@media(max-width:340px){
  #view-projects .section-head{
    padding:17px 13px!important;
  }
  #view-projects .project-row{
    padding:13px!important;
    gap:10px!important;
  }
  #view-projects .project-list-delete,
  #view-projects .project-row-actions>svg{
    width:36px!important;
    height:36px!important;
  }
}
/* all-projects-premium-library-20260825b: keep desktop action targets full-size */
#view-projects .project-table-header,
#view-projects .project-row{
  grid-template-columns:minmax(250px,1.45fr) minmax(130px,.75fr) minmax(94px,.5fr) minmax(104px,.5fr) minmax(104px,.5fr) minmax(84px,.4fr) minmax(88px,auto)!important;
}
#view-projects .project-row-actions{
  min-width:86px!important;
}
@media(max-width:1100px){
  #view-projects .project-row{
    grid-template-columns:minmax(0,1fr) auto auto auto!important;
  }
  #view-projects .project-row-actions{
    min-width:83px!important;
  }
}
@media(max-width:600px){
  #view-projects .project-row{
    grid-template-columns:minmax(0,1fr) auto!important;
  }
  #view-projects .project-row-actions{
    min-width:38px!important;
  }
}
/* all-projects-premium-library-20260825c: iPad/tablet card containment */
@media(max-width:900px){
  #view-projects,
  #view-projects .project-list,
  #view-projects .project-filter-bar,
  #view-projects .project-row{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }
  #view-projects .project-table-header{
    display:none!important;
  }
  #view-projects .project-filter-bar label,
  #view-projects .project-filter-bar .filter-search{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }
  #view-projects .project-filter-bar .filter-search input{
    flex:1 1 auto!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  #view-projects .project-row{
    grid-template-columns:minmax(0,1fr) auto!important;
  }
  #view-projects .project-row .status{
    grid-column:1!important;
    width:max-content!important;
    max-width:100%!important;
  }
  #view-projects .project-row-actions{
    grid-column:2!important;
    grid-row:1 / span 2!important;
    align-self:start!important;
  }
}

/* playlist-premium-library-20260825: black/gold mobile music library polish */
#view-playlist{
  width:100%!important;
  max-width:980px!important;
  margin:0 auto!important;
  box-sizing:border-box!important;
}
#view-playlist .section-head{
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:end!important;
  gap:18px!important;
  margin:0 0 18px!important;
  padding:18px!important;
  overflow:hidden!important;
  border:1px solid rgba(216,168,78,.18)!important;
  border-radius:26px!important;
  background:
    radial-gradient(circle at 10% 0%,rgba(216,168,78,.16),transparent 34%),
    linear-gradient(135deg,rgba(255,255,255,.05),rgba(255,255,255,.014)),
    #0d0f13!important;
  box-shadow:0 22px 54px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.06)!important;
}
#view-playlist .section-head::after{
  content:""!important;
  position:absolute!important;
  inset:auto -10% -55% 42%!important;
  height:130px!important;
  pointer-events:none!important;
  background:radial-gradient(circle,rgba(216,168,78,.18),transparent 62%)!important;
}
#view-playlist .section-head h2{
  margin:0!important;
  font:900 clamp(24px,4vw,38px)/.98 Manrope,Inter,"Sakira JP",sans-serif!important;
  letter-spacing:-.055em!important;
  color:#fff8e8!important;
}
#view-playlist .section-head p{
  max-width:48rem!important;
  margin:8px 0 0!important;
  font:560 13px/1.55 Inter,"Sakira JP",sans-serif!important;
  color:#a69f92!important;
}
#view-playlist .playlist-play-all{
  position:relative!important;
  z-index:1!important;
  min-height:46px!important;
  padding:0 20px!important;
  border:1px solid rgba(255,224,153,.35)!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,#ffe19a,#d9a84b 54%,#b77924)!important;
  color:#130d06!important;
  box-shadow:0 16px 34px rgba(216,168,78,.22), inset 0 1px 0 rgba(255,255,255,.45)!important;
  font:900 13px/1 Inter,"Sakira JP",sans-serif!important;
}
#view-playlist .playlist-play-all:hover:not(:disabled){
  transform:translateY(-1px)!important;
  box-shadow:0 20px 42px rgba(216,168,78,.28), inset 0 1px 0 rgba(255,255,255,.52)!important;
}
#view-playlist .playlist-play-all:disabled{opacity:.5!important;filter:saturate(.55)!important;}
#view-playlist .playlist-toolbar{
  margin:0 0 14px!important;
  display:block!important;
}
#view-playlist .playlist-search{
  width:100%!important;
  min-height:48px!important;
  padding:0 16px!important;
  border:1px solid rgba(216,168,78,.16)!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.052),rgba(255,255,255,.016)),#0e1014!important;
  box-shadow:0 14px 38px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.05)!important;
}
#view-playlist .playlist-search:focus-within{
  border-color:rgba(216,168,78,.5)!important;
  box-shadow:0 18px 44px rgba(0,0,0,.3),0 0 0 3px rgba(216,168,78,.11),inset 0 1px 0 rgba(255,255,255,.07)!important;
}
#view-playlist .playlist-search input{
  min-height:46px!important;
  font:700 14px/1 Inter,"Sakira JP",sans-serif!important;
  color:#fff8e8!important;
}
#view-playlist .playlist-search input::placeholder{color:#756f65!important;}
#view-playlist .playlist-list{
  gap:10px!important;
  padding-bottom:24px!important;
}
#view-playlist .playlist-row{
  isolation:isolate!important;
  grid-template-columns:62px minmax(0,1fr) auto!important;
  min-height:88px!important;
  gap:14px!important;
  padding:12px!important;
  border-radius:22px!important;
  border:1px solid rgba(216,168,78,.13)!important;
  background:
    linear-gradient(90deg,rgba(216,168,78,.075),transparent 26%),
    linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.014)),
    #0d0f13!important;
  box-shadow:0 18px 40px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.045)!important;
}
#view-playlist .playlist-row:hover,
#view-playlist .playlist-row:focus-within{
  transform:translateY(-1px)!important;
  border-color:rgba(216,168,78,.32)!important;
  background:
    linear-gradient(90deg,rgba(216,168,78,.12),transparent 30%),
    linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.016)),
    #111318!important;
}
#view-playlist .playlist-cover{
  width:62px!important;
  height:62px!important;
  border-radius:17px!important;
  box-shadow:0 16px 28px rgba(0,0,0,.34),0 0 0 1px rgba(255,255,255,.10) inset!important;
}
#view-playlist .playlist-meta{gap:4px!important;}
#view-playlist .playlist-meta strong{
  font:900 15px/1.16 Manrope,Inter,"Sakira JP",sans-serif!important;
  letter-spacing:-.03em!important;
  color:#fff9ec!important;
}
#view-playlist .playlist-meta span,
#view-playlist .playlist-meta small{
  font:600 11.5px/1.34 Inter,"Sakira JP",sans-serif!important;
  color:#8f938e!important;
}
#view-playlist .playlist-meta small{color:#c3ad78!important;}
#view-playlist .playlist-actions{
  opacity:1!important;
  transform:none!important;
  gap:7px!important;
}
#view-playlist .playlist-actions .playlist-icon-action{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  min-height:38px!important;
  box-shadow:0 12px 26px rgba(0,0,0,.3)!important;
}
#view-playlist .playlist-actions .playlist-play-action{
  background:linear-gradient(135deg,#fff5db,#d8a84e)!important;
  border-color:rgba(255,226,158,.65)!important;
  color:#100b05!important;
}
#view-playlist .playlist-actions .playlist-remove-action{
  background:rgba(255,255,255,.045)!important;
  border-color:rgba(255,255,255,.12)!important;
  color:#c9c5bc!important;
}
@media(max-width:700px){
  #view-playlist{
    padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))!important;
  }
  #view-playlist .section-head{
    grid-template-columns:1fr!important;
    align-items:start!important;
    gap:14px!important;
    padding:17px!important;
    border-radius:24px!important;
  }
  #view-playlist .section-head p{
    font-size:12.5px!important;
    line-height:1.5!important;
  }
  #view-playlist .playlist-play-all{
    width:100%!important;
    min-height:48px!important;
    justify-content:center!important;
  }
  #view-playlist .playlist-search{
    min-height:46px!important;
    border-radius:17px!important;
  }
  #view-playlist .playlist-row{
    grid-template-columns:54px minmax(0,1fr) auto!important;
    gap:10px!important;
    min-height:78px!important;
    padding:10px!important;
    border-radius:19px!important;
  }
  #view-playlist .playlist-cover{
    width:54px!important;
    height:54px!important;
    border-radius:15px!important;
  }
  #view-playlist .playlist-meta strong{font-size:13.5px!important;}
  #view-playlist .playlist-meta span,
  #view-playlist .playlist-meta small{font-size:10.5px!important;}
  #view-playlist .playlist-actions{
    grid-column:auto!important;
    margin:0!important;
    justify-content:end!important;
    flex-wrap:nowrap!important;
    gap:5px!important;
  }
  #view-playlist .playlist-actions .playlist-icon-action{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
  }
}
@media(max-width:340px){
  #view-playlist .section-head{padding:15px!important;border-radius:21px!important;}
  #view-playlist .playlist-row{grid-template-columns:48px minmax(0,1fr) auto!important;gap:8px!important;padding:9px!important;border-radius:17px!important;}
  #view-playlist .playlist-cover{width:48px!important;height:48px!important;border-radius:13px!important;}
  #view-playlist .playlist-actions .playlist-icon-action{width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;}
}

/* Create page asset + publish polish — scoped to authenticated Create only. */
#view-create .create-library-fieldset,
#view-create .create-platform-fieldset{
  position:relative;
  display:grid;
  gap:8px;
  margin:12px 0;
  padding:14px 18px!important;
  border:1px solid rgba(216,168,78,.24)!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 0 0,rgba(216,168,78,.13),transparent 34%),
    linear-gradient(145deg,rgba(18,19,24,.96),rgba(7,8,11,.98))!important;
  box-shadow:0 20px 54px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.04);
}
#view-create .create-library-fieldset legend,
#view-create .create-platform-fieldset legend{
  padding:0 8px!important;
  color:#f6e8c5;
  font-family:Manrope,Inter,"Sakira JP",sans-serif;
  font-size:13px!important;
  font-weight:900;
  letter-spacing:.01em;
}
#view-create .create-library-fieldset legend small{
  color:#b88e47;
  font-weight:850;
}
#view-create .library-hint{
  max-width:78rem;
  margin:0!important;
  color:#aeb4bd!important;
  font-size:12px!important;
  line-height:1.38!important;
}
#view-create .library-empty{
  color:#777f8d!important;
}
#view-create .library-chosen{
  min-height:0;
  margin:0!important;
  gap:8px!important;
}
#view-create .create-library-fieldset .secondary{
  width:max-content;
  min-height:34px!important;
  padding:8px 13px!important;
  border-radius:12px!important;
  border:1px solid rgba(216,168,78,.30)!important;
  background:linear-gradient(145deg,rgba(216,168,78,.14),rgba(255,255,255,.035))!important;
  color:#f6e6bd!important;
  font-size:13px!important;
  font-weight:900!important;
  line-height:1!important;
  box-shadow:0 12px 28px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.04);
}
#view-create .create-library-fieldset .secondary:hover,
#view-create .create-library-fieldset .secondary:focus-visible{
  border-color:rgba(246,213,139,.62)!important;
  background:linear-gradient(145deg,rgba(216,168,78,.24),rgba(255,255,255,.06))!important;
  transform:translateY(-1px);
}
#view-create .library-exclusif{
  width:max-content;
  max-width:100%;
  margin:0!important;
  padding:6px 9px;
  gap:8px!important;
  border-radius:12px;
  color:#c7c1b4!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1.35;
}
#view-create .library-exclusif:has(input[type="checkbox"]){
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.08);
}
#view-create .library-exclusif input[type="checkbox"]{
  width:15px;
  height:15px;
  accent-color:var(--accent);
}
#view-create .library-exclusif:has(input[type="file"]){
  display:inline-grid;
  grid-template-columns:auto minmax(180px,320px);
  align-items:center;
  column-gap:12px!important;
  width:min(520px,100%);
  padding:8px 12px!important;
  border:1px solid rgba(216,168,78,.18);
  background:rgba(255,255,255,.035);
}
#view-create .library-exclusif:has(input[type="file"]) span{
  color:#cdbf9f;
  white-space:nowrap;
}
#view-create input[type="file"]#miniature-televersee{
  width:100%;
  min-width:0;
  padding:6px 8px!important;
  border-radius:11px!important;
  border-color:rgba(255,255,255,.10)!important;
  background:#0d0f13!important;
  color:#9da3ad!important;
  font-size:12px!important;
}
#view-create input[type="file"]#miniature-televersee::file-selector-button{
  margin-right:10px;
  border:1px solid rgba(216,168,78,.36);
  border-radius:999px;
  background:linear-gradient(135deg,#f0c76c,#b87929);
  color:#130d07;
  padding:6px 10px;
  font:900 12px/1 Inter,"Sakira JP",sans-serif;
  cursor:pointer;
}
#view-create .platform-choice{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
}
#view-create .platform-option{
  min-height:42px;
  display:grid!important;
  grid-template-columns:auto auto minmax(0,1fr)!important;
  align-items:center!important;
  gap:8px!important;
  padding:8px 11px!important;
  border-radius:14px!important;
  border:1px solid rgba(255,255,255,.09)!important;
  background:linear-gradient(145deg,rgba(18,20,25,.94),rgba(10,11,14,.94))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
#view-create .platform-option:has(input:checked){
  border-color:rgba(246,213,139,.62)!important;
  background:linear-gradient(145deg,rgba(216,168,78,.18),rgba(21,18,13,.96))!important;
  box-shadow:0 0 0 1px rgba(216,168,78,.18),0 16px 34px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.055);
}
#view-create .platform-option.needs-connection{
  border-color:rgba(216,168,78,.22)!important;
  background:linear-gradient(145deg,rgba(21,18,13,.92),rgba(9,10,13,.95))!important;
}
#view-create .platform-option input[type="checkbox"]{
  width:15px;
  height:15px;
  margin:0;
  accent-color:var(--accent);
}
#view-create .platform-option span:not(.platform-symbol){
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#efe5d0;
  font-size:12px;
  font-weight:900;
}
#view-create .platform-option small{
  grid-column:3;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#9ca2ac;
  font-size:9.5px;
  font-weight:850;
  letter-spacing:.015em;
}
body:has(#sakira-player:not([hidden])) #view-create{
  padding-bottom:150px!important;
}
body:has(#sakira-player:not([hidden])) #view-create .composer-actions{
  margin-bottom:92px!important;
}
@media(max-width:980px){
  #view-create .platform-choice{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media(max-width:700px){
  #view-create .create-library-fieldset,
  #view-create .create-platform-fieldset{
    padding:15px!important;
    border-radius:20px!important;
    gap:10px;
  }
  #view-create .create-library-fieldset .secondary,
  #view-create .library-exclusif,
  #view-create .library-exclusif:has(input[type="file"]){
    width:100%;
  }
  #view-create .library-exclusif:has(input[type="file"]){
    grid-template-columns:1fr;
    row-gap:8px!important;
  }
  #view-create .platform-choice{grid-template-columns:1fr!important;}
  #view-create .platform-option{min-height:46px;}
  body:has(#sakira-player:not([hidden])) #view-create{padding-bottom:210px!important;}
  body:has(#sakira-player:not([hidden])) #view-create .composer-actions{margin-bottom:132px!important;}
}

/* create-recent-premium-library-20260826: scoped compact black/gold Recent productions polish */
#view-create > .section:has(#recent-list){
  position:relative!important;
  max-width:1180px!important;
  margin:22px auto 0!important;
  padding:18px!important;
  overflow:hidden!important;
  border:1px solid rgba(216,168,78,.20)!important;
  border-radius:28px!important;
  background:
    radial-gradient(circle at 9% -10%,rgba(216,168,78,.18),transparent 34%),
    radial-gradient(circle at 94% 112%,rgba(216,168,78,.12),transparent 28%),
    linear-gradient(135deg,rgba(20,18,14,.98),rgba(9,10,13,.985) 58%,rgba(16,14,10,.98))!important;
  box-shadow:0 26px 72px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.05)!important;
}
#view-create > .section:has(#recent-list)::before{
  content:"RECENT LIBRARY";
  display:inline-flex;
  width:max-content;
  margin:0 0 9px;
  padding:5px 10px;
  border:1px solid rgba(216,168,78,.30);
  border-radius:999px;
  background:rgba(216,168,78,.09);
  color:#f1c86d;
  font:900 9.5px/1 Inter,"Sakira JP",sans-serif;
  letter-spacing:.16em;
}
#view-create > .section:has(#recent-list) .section-head{
  position:relative!important;
  z-index:1!important;
  align-items:flex-end!important;
  gap:16px!important;
  margin:0 0 13px!important;
  padding:0 0 14px!important;
  border-bottom:1px solid rgba(216,168,78,.13)!important;
}
#view-create > .section:has(#recent-list) .section-head h2{
  margin:0!important;
  font:900 clamp(23px,3.8vw,34px)/1 Manrope,Inter,"Sakira JP",sans-serif!important;
  letter-spacing:-.05em!important;
  color:#fff8e8!important;
}
#view-create > .section:has(#recent-list) .section-head p{
  max-width:46rem!important;
  margin:7px 0 0!important;
  color:#a99f8d!important;
  font:560 13px/1.5 Inter,"Sakira JP",sans-serif!important;
}
#view-create > .section:has(#recent-list) #refresh{
  width:42px!important;
  height:42px!important;
  flex:0 0 auto!important;
  border:1px solid rgba(216,168,78,.22)!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,rgba(216,168,78,.13),rgba(255,255,255,.035))!important;
  color:#f0ca78!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important;
}
#view-create > .section:has(#recent-list) #refresh:hover,
#view-create > .section:has(#recent-list) #refresh:focus-visible{
  transform:translateY(-1px)!important;
  border-color:rgba(216,168,78,.45)!important;
  background:linear-gradient(180deg,rgba(216,168,78,.20),rgba(255,255,255,.045))!important;
  outline:none!important;
}
#view-create #recent-list{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  gap:10px!important;
  padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))!important;
}
#view-create #recent-list .project-filter-bar{
  grid-template-columns:auto minmax(120px,.82fr) minmax(150px,.95fr) minmax(140px,.85fr) minmax(220px,1.3fr)!important;
  gap:9px!important;
  margin:0 0 9px!important;
  padding:8px!important;
  border-radius:20px!important;
  border-color:rgba(216,168,78,.24)!important;
  background:linear-gradient(180deg,rgba(18,19,23,.95),rgba(10,11,14,.96))!important;
  box-shadow:0 14px 38px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.045)!important;
}
#view-create #recent-list .project-filter-bar label{
  min-height:38px!important;
  padding:3px 5px 3px 10px!important;
  border:1px solid rgba(255,255,255,.07)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.025)!important;
}
#view-create #recent-list .project-filter-bar .filter-title{color:#f2e8d3!important;}
#view-create #recent-list .project-filter-bar .filter-title svg,
#view-create #recent-list .project-filter-bar .filter-search svg{color:#d8a84e!important;}
#view-create #recent-list .project-filter-bar select,
#view-create #recent-list .project-filter-bar .filter-search input{
  height:32px!important;
  border-color:rgba(216,168,78,.14)!important;
  background:linear-gradient(180deg,#15171d,#101116)!important;
  color:#f7f1e5!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
#view-create #recent-list .project-table-header{
  position:static!important;
  margin:0 0 2px!important;
  padding:8px 14px!important;
  min-height:34px!important;
  border:1px solid rgba(255,255,255,.06)!important;
  border-radius:15px!important;
  background:rgba(255,255,255,.025)!important;
  box-shadow:none!important;
}
#view-create #recent-list .project-row{
  position:relative!important;
  min-height:76px!important;
  padding:14px 14px 14px 16px!important;
  border:1px solid rgba(216,168,78,.16)!important;
  border-radius:21px!important;
  overflow:hidden!important;
  background:
    linear-gradient(90deg,rgba(216,168,78,.18),rgba(216,168,78,0) 4px),
    radial-gradient(circle at 7% 0%,rgba(216,168,78,.09),transparent 30%),
    linear-gradient(135deg,rgba(22,23,27,.95),rgba(11,12,15,.98) 64%,rgba(17,14,10,.95))!important;
  box-shadow:0 14px 36px rgba(0,0,0,.27),inset 0 1px 0 rgba(255,255,255,.04)!important;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease!important;
}
#view-create #recent-list .project-row:hover,
#view-create #recent-list .project-row:focus-visible{
  transform:translateY(-1px)!important;
  border-color:rgba(216,168,78,.40)!important;
  box-shadow:0 20px 50px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.055)!important;
  outline:none!important;
}
#view-create #recent-list .project-title-cell{display:grid!important;gap:6px!important;min-width:0!important;}
#view-create #recent-list .project-row strong{
  color:#fff7e8!important;
  font:900 15px/1.18 Manrope,Inter,"Sakira JP",sans-serif!important;
  letter-spacing:-.024em!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#view-create #recent-list .project-row small{color:#958f82!important;font:550 11.5px/1.38 Inter,"Sakira JP",sans-serif!important;}
#view-create #recent-list .project-row>p{color:#c7b88f!important;font:750 11.5px/1.32 Inter,"Sakira JP",sans-serif!important;}
#view-create #recent-list .project-row .status{
  justify-self:start!important;
  min-height:23px!important;
  padding:5px 9px!important;
  border:1px solid rgba(216,168,78,.18)!important;
  border-radius:999px!important;
  background:rgba(216,168,78,.10)!important;
  color:#f0ca78!important;
}
#view-create #recent-list .project-row .status.ready,
#view-create #recent-list .project-row .status.done,
#view-create #recent-list .project-row .status.completed,
#view-create #recent-list .project-row .status.published{
  border-color:rgba(111,213,143,.24)!important;
  background:rgba(43,105,67,.24)!important;
  color:#8fe0a8!important;
}
#view-create #recent-list .project-platform-statuses{gap:4px!important;margin-top:0!important;}
#view-create #recent-list .project-platform-status{
  min-height:20px!important;
  padding:4px 6px!important;
  border-color:rgba(216,168,78,.14)!important;
  background:rgba(255,255,255,.035)!important;
  color:#aaa394!important;
  font:850 9px/1 Inter,"Sakira JP",sans-serif!important;
}
#view-create #recent-list .project-platform-status.published{
  border-color:rgba(216,168,78,.30)!important;
  background:linear-gradient(135deg,rgba(216,168,78,.18),rgba(69,139,87,.18))!important;
  color:#f1d08a!important;
}
#view-create #recent-list .project-row time,
#view-create #recent-list .project-row .row-cost{color:#a69b84!important;font:700 11.5px/1.25 Inter,"Sakira JP",sans-serif!important;}
#view-create #recent-list .project-list-delete{
  width:36px!important;
  height:36px!important;
  border-color:rgba(255,255,255,.09)!important;
  background:rgba(255,255,255,.035)!important;
  color:#b8b0a2!important;
  box-shadow:none!important;
}
#view-create #recent-list .project-list-delete:hover,
#view-create #recent-list .project-list-delete:focus-visible{
  border-color:rgba(255,132,118,.42)!important;
  background:rgba(255,92,92,.10)!important;
  color:#ffad9f!important;
  outline:none!important;
}
#view-create #recent-list .project-row-actions>svg{
  width:32px!important;
  height:32px!important;
  padding:7px!important;
  border:1px solid rgba(216,168,78,.17)!important;
  border-radius:999px!important;
  background:rgba(216,168,78,.07)!important;
  color:#e7c275!important;
}
@media(max-width:900px){
  #view-create #recent-list .project-filter-bar{
    grid-template-columns:1fr!important;
    position:static!important;
  }
  #view-create #recent-list .project-filter-bar label,
  #view-create #recent-list .project-filter-bar .filter-search{width:100%!important;max-width:100%!important;}
  #view-create #recent-list .project-table-header{display:none!important;}
  #view-create #recent-list .project-row{grid-template-columns:minmax(0,1fr) auto!important;}
  #view-create #recent-list .project-row .status{grid-column:1!important;width:max-content!important;max-width:100%!important;}
  #view-create #recent-list .project-row-actions{grid-column:2!important;grid-row:1 / span 2!important;align-self:start!important;}
}
@media(max-width:600px){
  #view-create > .section:has(#recent-list){
    margin-top:18px!important;
    padding:14px!important;
    border-radius:24px!important;
  }
  #view-create > .section:has(#recent-list)::before{font-size:9px;padding:4px 9px;}
  #view-create > .section:has(#recent-list) .section-head{align-items:center!important;margin-bottom:10px!important;padding-bottom:12px!important;}
  #view-create > .section:has(#recent-list) .section-head h2{font-size:26px!important;}
  #view-create > .section:has(#recent-list) .section-head p{font-size:12.25px!important;line-height:1.42!important;}
  #view-create > .section:has(#recent-list) #refresh{width:40px!important;height:40px!important;}
  #view-create #recent-list .project-filter-bar{
    display:flex!important;
    margin:0 0 11px!important;
    padding:7px!important;
    border-radius:18px!important;
    box-shadow:0 12px 28px rgba(0,0,0,.25)!important;
  }
  #view-create #recent-list .project-filter-bar .filter-title,
  #view-create #recent-list .project-filter-bar label:not(.filter-search){display:none!important;}
  #view-create #recent-list .project-filter-bar .filter-search{
    display:flex!important;
    min-height:46px!important;
    padding:4px 6px 4px 12px!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.035)!important;
  }
  #view-create #recent-list .project-filter-bar .filter-search input{
    flex:1 1 auto!important;
    width:100%!important;
    min-width:0!important;
    height:38px!important;
    padding:8px 11px!important;
    font-size:16px!important;
  }
  #view-create #recent-list{gap:9px!important;padding-bottom:calc(112px + env(safe-area-inset-bottom,0px))!important;}
  #view-create #recent-list .project-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:10px!important;
    min-height:0!important;
    padding:13px!important;
    border-radius:20px!important;
  }
  #view-create #recent-list .project-row strong{font-size:14.5px!important;}
  #view-create #recent-list .project-row small{-webkit-line-clamp:2!important;font-size:11.25px!important;line-height:1.36!important;text-align:left!important;}
  #view-create #recent-list .project-platform-statuses{max-width:100%;gap:4px!important;}
  #view-create #recent-list .project-platform-status{max-width:100%!important;padding:4px 6px!important;font-size:8.6px!important;}
  #view-create #recent-list .project-mobile-generated-date{
    margin-top:0!important;
    padding:5px 8px!important;
    border-color:rgba(216,168,78,.18)!important;
    background:rgba(216,168,78,.075)!important;
    color:#d6bd82!important;
    font-size:10px!important;
  }
  #view-create #recent-list .project-row .status{min-height:22px!important;padding:5px 8px!important;font-size:9.8px!important;}
  #view-create #recent-list .project-row-actions{display:grid!important;grid-template-columns:36px!important;gap:7px!important;min-width:36px!important;}
  #view-create #recent-list .project-list-delete,
  #view-create #recent-list .project-row-actions>svg{width:36px!important;height:36px!important;}
  body:has(#sakira-player:not([hidden])) #view-create #recent-list{padding-bottom:230px!important;}
}
@media(max-width:340px){
  #view-create > .section:has(#recent-list){padding:12px!important;}
  #view-create #recent-list .project-row{padding:12px!important;gap:9px!important;}
  #view-create #recent-list .project-list-delete,
  #view-create #recent-list .project-row-actions>svg{width:35px!important;height:35px!important;}
}

/* App login language toggle — visible before account menu is available */
.login-language-switch{display:flex!important;width:max-content;margin:-6px auto 14px;box-shadow:0 12px 28px rgba(0,0,0,.24)}
.login-language-switch button{min-width:42px}
/* 20260828 projects scheduled date premium chip */
#view-projects .project-row .published-date.scheduled{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  width:max-content!important;
  max-width:100%!important;
  min-height:46px!important;
  padding:7px 10px 7px 8px!important;
  border:1px solid rgba(216,168,78,.48)!important;
  border-radius:16px!important;
  background:linear-gradient(135deg,rgba(8,9,11,.98),rgba(24,19,12,.96) 58%,rgba(69,48,18,.78))!important;
  color:#ffd879!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.32),0 0 0 1px rgba(255,214,130,.05)!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
#view-projects .project-row .published-date.scheduled>svg{
  width:18px!important;
  height:18px!important;
  flex:0 0 18px!important;
  padding:3px!important;
  border-radius:999px!important;
  color:#17110a!important;
  background:linear-gradient(135deg,#ffe8a9,#d8a84e)!important;
  box-shadow:0 6px 14px rgba(216,168,78,.25)!important;
}
#view-projects .project-row .published-date.scheduled .project-scheduled-mark{
  display:grid!important;
  gap:3px!important;
  min-width:0!important;
}
#view-projects .project-row .published-date.scheduled span{
  color:#ffe2a0!important;
  font:950 10.5px/1 Inter,"Sakira JP",sans-serif!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
}
#view-projects .project-row .published-date.scheduled small{
  color:#fff3d0!important;
  font:850 12px/1.18 Inter,"Sakira JP",sans-serif!important;
  letter-spacing:0!important;
  text-transform:none!important;
}
.project-mobile-scheduled-date{display:none!important;}
@media(max-width:1100px){
  #view-projects .project-mobile-scheduled-date{
    display:inline-flex!important;
    align-items:center!important;
    gap:6px!important;
    width:max-content!important;
    max-width:100%!important;
    margin-top:3px!important;
    padding:7px 10px!important;
    border:1px solid rgba(216,168,78,.44)!important;
    border-radius:999px!important;
    background:linear-gradient(135deg,rgba(8,9,11,.98),rgba(47,34,14,.9))!important;
    color:#ffe3a6!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 10px 22px rgba(0,0,0,.28)!important;
    font:900 11px/1.18 Inter,"Sakira JP",sans-serif!important;
    letter-spacing:.01em!important;
    white-space:normal!important;
  }
  #view-projects .project-mobile-scheduled-date:before{
    content:""!important;
    width:7px!important;
    height:7px!important;
    flex:0 0 7px!important;
    border-radius:999px!important;
    background:#d8a84e!important;
    box-shadow:0 0 0 3px rgba(216,168,78,.16)!important;
  }
}

.tiktok-draft-success{
  width:min(720px,calc(100vw - 28px))!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  overflow:visible!important;
}
.tiktok-draft-success::backdrop{
  background:rgba(2,4,8,.76);
  backdrop-filter:blur(14px) saturate(.92);
}
.tiktok-draft-success-card{
  position:relative;
  display:grid;
  gap:20px;
  padding:30px 30px 26px!important;
  text-align:left!important;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at 0% 0%,rgba(37,244,238,.13),transparent 34%),
    radial-gradient(circle at 100% 0%,rgba(254,44,85,.12),transparent 30%),
    linear-gradient(180deg,rgba(15,16,21,.98),rgba(8,9,12,.98));
  box-shadow:
    0 36px 100px rgba(0,0,0,.72),
    inset 0 0 0 1px rgba(255,255,255,.035);
}
.tiktok-draft-success .profile-close{
  top:16px!important;
  right:16px!important;
  width:38px!important;
  height:38px!important;
  border-radius:14px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:rgba(255,255,255,.04)!important;
  color:rgba(255,248,234,.86)!important;
}
.tiktok-draft-success-head{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:18px;
  align-items:start;
  padding-right:30px;
}
.tiktok-draft-success-mark{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border-radius:20px;
  background:
    radial-gradient(circle at 30% 25%,rgba(37,244,238,.26),transparent 42%),
    radial-gradient(circle at 72% 78%,rgba(254,44,85,.22),transparent 38%),
    #0b0d12;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 16px 42px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.03);
}
.tiktok-draft-success-mark .platform-symbol{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
}
.tiktok-draft-success-mark img{
  width:28px;
  height:28px;
}
.tiktok-draft-success-copy .eyebrow{
  margin:0 0 8px;
  color:#9feee8;
  letter-spacing:.18em;
}
.tiktok-draft-success-copy h2{
  margin:0 0 8px!important;
  color:#fff8ec;
  font:900 clamp(28px,4.6vw,40px) Manrope,Inter,"Sakira JP",sans-serif!important;
  line-height:.98;
  letter-spacing:-.055em;
  text-align:left!important;
}
.tiktok-draft-success-note{
  margin:0;
  color:rgba(235,237,242,.74)!important;
  font-size:15px;
  line-height:1.55;
}
.tiktok-draft-success-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.tiktok-draft-success-meta>div{
  min-width:0;
  padding:14px 15px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.02));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
.tiktok-draft-success-meta span{
  display:block;
  margin-bottom:5px;
  color:rgba(182,189,202,.74);
  font:800 10px Manrope,Inter,"Sakira JP",sans-serif;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.tiktok-draft-success-meta strong{
  display:block;
  color:#fff6df;
  font-size:14px;
  font-weight:800;
}
.tiktok-draft-success-field{
  gap:10px!important;
  color:#f3ead3!important;
  font:800 11px Manrope,Inter,"Sakira JP",sans-serif!important;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.tiktok-draft-success-field textarea{
  min-height:196px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.1);
  background:
    linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.025)),
    rgba(10,11,15,.98);
  color:#fff7e9;
  padding:18px 18px 16px;
  font-size:15px;
  line-height:1.55;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
.tiktok-draft-success-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.tiktok-draft-success-actions .secondary,
.tiktok-draft-success-actions .primary{
  min-height:50px;
  padding:0 18px;
  border-radius:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-weight:800;
}
.tiktok-draft-success-actions .secondary{
  border-color:rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  color:#fff3d8;
}
.tiktok-draft-success-actions .primary{
  min-width:124px;
  background:linear-gradient(135deg,#fe2c55,#f2ba58);
  color:#140b0a;
  box-shadow:0 16px 34px rgba(254,44,85,.18);
}
.tiktok-draft-success-actions .secondary svg,
.tiktok-draft-success-actions .primary svg{
  width:17px;
  height:17px;
}
.tiktok-draft-failed{
  width:min(560px,calc(100vw - 28px))!important;
}
.tiktok-draft-failed .tiktok-draft-success-card{
  gap:16px;
  padding:24px 24px 22px!important;
  border-radius:24px;
}
.tiktok-draft-failed .tiktok-draft-success-head{
  gap:14px;
  padding-right:30px;
}
.tiktok-draft-failed .tiktok-draft-success-mark{
  width:50px;
  height:50px;
  border-radius:18px;
}
.tiktok-draft-failed .tiktok-draft-success-copy h2{
  font-size:clamp(24px,3.2vw,30px)!important;
  line-height:1.05;
}
.tiktok-draft-failed .tiktok-draft-success-note{
  font-size:14px;
  line-height:1.48;
}
.tiktok-draft-failed .tiktok-draft-success-meta>div{
  padding:12px 13px;
  border-radius:14px;
}
.tiktok-draft-failed .tiktok-draft-success-field textarea{
  min-height:132px;
  max-height:30vh;
  font-size:14px;
  padding:14px;
}
.tiktok-draft-failed .tiktok-draft-success-actions .secondary,
.tiktok-draft-failed .tiktok-draft-success-actions .primary{
  min-height:46px;
  border-radius:14px;
}
@media(max-width:640px){
  .tiktok-draft-success{
    width:min(100vw - 14px,720px)!important;
  }
  .tiktok-draft-failed{
    width:min(100vw - 18px,560px)!important;
  }
  .tiktok-draft-success-card{
    gap:16px;
    padding:22px 16px 16px!important;
    border-radius:22px;
  }
  .tiktok-draft-success-head{
    grid-template-columns:1fr;
    gap:12px;
    padding-right:38px;
  }
  .tiktok-draft-success-mark{
    width:52px;
    height:52px;
    border-radius:18px;
  }
  .tiktok-draft-success-copy h2{
    font-size:30px!important;
  }
  .tiktok-draft-success-note{
    font-size:14px;
  }
  .tiktok-draft-success-meta{
    grid-template-columns:1fr;
  }
  .tiktok-draft-success-field textarea{
    min-height:170px;
    padding:15px 14px;
    font-size:14px;
  }
  .tiktok-draft-success-actions{
    flex-direction:column-reverse;
  }
  .tiktok-draft-success-actions .secondary,
  .tiktok-draft-success-actions .primary{
    width:100%;
  }
}


/* Private reviewer pricing page inside authenticated app */
.private-pricing-view{min-height:calc(100vh - 72px)}

/* 20260904 modal close buttons: keep X controls clear of dialog content */
.profile-dialog:not(.schedule-dialog):not(.distrokid-pack-dialog) .profile-card > .profile-close,
.artwork-preview-dialog .artwork-preview-close{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  min-height:38px!important;
  padding:0!important;
  border:1px solid rgba(216,168,78,.34)!important;
  border-radius:14px!important;
  background:rgba(10,11,13,.92)!important;
  color:#f5d58e!important;
  box-shadow:0 12px 32px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.06)!important;
  backdrop-filter:blur(10px);
  z-index:20!important;
}
.profile-dialog:not(.schedule-dialog):not(.distrokid-pack-dialog) .profile-card > .profile-close svg,
.artwork-preview-dialog .artwork-preview-close svg{
  width:17px!important;
  height:17px!important;
  stroke:currentColor!important;
  stroke-width:2.35!important;
}
.profile-dialog:not(.schedule-dialog):not(.distrokid-pack-dialog) .profile-card > .profile-close:hover,
.profile-dialog:not(.schedule-dialog):not(.distrokid-pack-dialog) .profile-card > .profile-close:focus-visible,
.artwork-preview-dialog .artwork-preview-close:hover,
.artwork-preview-dialog .artwork-preview-close:focus-visible{
  border-color:rgba(255,226,160,.72)!important;
  background:rgba(216,168,78,.16)!important;
  color:#ffe7a5!important;
  outline:none!important;
}
#credit-dialog.billing-dialog .billing-card{
  padding-top:26px!important;
}
#credit-dialog.billing-dialog .profile-close{
  position:sticky!important;
  top:18px!important;
  right:auto!important;
  display:flex!important;
  float:right!important;
  margin:0 0 14px 14px!important;
  clear:both;
}
#credit-dialog.billing-dialog .billing-summary{
  clear:both;
  margin:0 52px 22px 0!important;
}
.distrokid-pack-dialog-minimal .distrokid-pack-card{
  padding-top:42px!important;
}
.artwork-preview-dialog .artwork-preview-shell{
  padding-top:70px!important;
}
.about-dialog .about-close{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  min-height:38px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(216,168,78,.38)!important;
  background:rgba(9,10,12,.88)!important;
  color:#f5d58e!important;
  box-shadow:0 12px 32px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.06)!important;
  z-index:20!important;
}
.about-dialog .about-close:hover,
.about-dialog .about-close:focus-visible{
  border-color:rgba(255,226,160,.72)!important;
  background:rgba(216,168,78,.16)!important;
  color:#ffe7a5!important;
  outline:none!important;
}
@media(max-width:480px){
  #credit-dialog.billing-dialog .billing-card{padding-top:18px!important;}
  #credit-dialog.billing-dialog .profile-close{top:12px!important;}
  .profile-dialog:not(.schedule-dialog):not(.distrokid-pack-dialog) .profile-card > .profile-close,
  .about-dialog .about-close,
  .artwork-preview-dialog .artwork-preview-close{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
    border-radius:12px!important;
  }
}
.private-pricing-frame-shell{min-height:calc(100vh - 72px);border:1px solid rgba(216,168,78,.18);border-radius:28px;overflow:hidden;background:#090a0c;box-shadow:0 28px 90px rgba(0,0,0,.42)}
.private-pricing-frame-shell iframe{display:block;width:100%;height:calc(100vh - 74px);min-height:760px;border:0;background:#090a0c}
@media(max-width:700px){.private-pricing-view{padding-bottom:86px}.private-pricing-frame-shell{border-radius:0;border-left:0;border-right:0;margin:0 -18px}.private-pricing-frame-shell iframe{height:calc(100vh - 94px);min-height:680px}}

/* 20260907 Projects pagination: keep the top range out of search and on the Cost line. */
@media(max-width:900px){
  #view-projects .project-table-header.project-table-header-paginated{
    display:grid!important;
    grid-template-columns:1fr!important;
    position:static!important;
    width:100%!important;
    max-width:100%!important;
    min-height:34px!important;
    margin:0 0 8px!important;
    padding:7px 10px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }
  #view-projects .project-table-header.project-table-header-paginated > span{
    display:none!important;
  }
  #view-projects .project-table-header.project-table-header-paginated > span:nth-child(6){
    grid-column:1 / -1!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
  }
  #view-projects .project-table-header.project-table-header-paginated .project-pagination-top{
    min-width:0!important;
    margin-left:auto!important;
    transform:none!important;
  }
}


/* 20260905 admin registered users premium modal */
.registered-users-dialog{
  padding:0;
  border:0;
  background:transparent;
  max-width:min(980px,calc(100vw - 24px));
  width:min(980px,calc(100vw - 24px));
}
.registered-users-dialog::backdrop{background:rgba(0,0,0,.72);backdrop-filter:blur(14px)}
.registered-users-card{
  position:relative;
  width:100%!important;
  max-height:min(82vh,860px);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:30px!important;
  border:1px solid rgba(216,168,78,.28)!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 16% 0%,rgba(216,168,78,.18),transparent 34%),
    linear-gradient(145deg,#111215 0%,#08090b 58%,#161209 100%)!important;
  box-shadow:0 34px 100px rgba(0,0,0,.72),inset 0 1px 0 rgba(255,255,255,.07)!important;
  color:#f8f3e7;
}
.registered-users-card>.profile-close{
  position:absolute!important;
  top:18px!important;
  right:18px!important;
}
.registered-users-head{
  padding:2px 58px 2px 0;
}
.registered-users-head h2{
  margin:0 0 7px!important;
  color:#fff6df!important;
  font-family:"Playfair Display",serif!important;
  font-size:clamp(30px,4vw,46px)!important;
  line-height:.96!important;
  letter-spacing:-.03em;
  text-align:left!important;
}
.registered-users-summary{
  margin:0;
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:6px 11px;
  border:1px solid rgba(216,168,78,.28);
  border-radius:999px;
  background:rgba(216,168,78,.10);
  color:#f4d28c;
  font:800 12px/1 Manrope,Inter,"Sakira JP",sans-serif;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.registered-users-columns,
.registered-user-row{
  display:grid;
  grid-template-columns:minmax(150px,1.15fr) minmax(190px,1.35fr) minmax(96px,.72fr) minmax(96px,.72fr) minmax(74px,.46fr) minmax(70px,.42fr);
  gap:10px;
  align-items:center;
}
.registered-users-columns{
  padding:0 15px;
  color:#9b9488;
  font:900 10px/1.2 Manrope,Inter,"Sakira JP",sans-serif;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.registered-users-list{
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  display:grid;
  gap:10px;
  padding:2px 2px 3px;
  -webkit-overflow-scrolling:touch;
}
.registered-users-list .empty{
  margin:0;
  padding:26px;
  border:1px solid rgba(216,168,78,.20);
  border-radius:22px;
  background:rgba(255,255,255,.035);
  color:#d8d0c0;
  text-align:center;
}
.registered-user-row{
  padding:13px 14px;
  border:1px solid rgba(216,168,78,.17);
  border-radius:20px;
  background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  box-shadow:0 16px 42px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.05);
}
.registered-user-cell{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:5px;
}
.registered-user-label{display:none;color:#9f9688;font:900 10px/1 Manrope,Inter,"Sakira JP",sans-serif;letter-spacing:.12em;text-transform:uppercase}
.registered-user-cell strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#fff7e6;
  font:800 13px/1.25 Manrope,Inter,"Sakira JP",sans-serif;
}
.registered-user-email strong{
  color:#cec6b8;
  font-weight:700;
  font-size:12.5px;
  text-transform:none;
}
.registered-user-status strong,
.registered-user-plan strong{
  width:max-content;
  max-width:100%;
  padding:6px 9px;
  border-radius:999px;
  border:1px solid rgba(216,168,78,.24);
  background:rgba(216,168,78,.10);
  color:#f7d98f;
  font-size:11px;
  letter-spacing:.03em;
  text-transform:capitalize;
}
.registered-user-status.status-active strong{border-color:rgba(82,211,132,.34);background:rgba(82,211,132,.11);color:#b9f3ca}
.registered-user-status.status-disabled strong{border-color:rgba(248,113,113,.38);background:rgba(248,113,113,.12);color:#ffc0c0}
.registered-user-plan.plan-pro strong{border-color:rgba(255,218,138,.62);background:linear-gradient(135deg,#f1c56e,#8b5f19);color:#130f08;box-shadow:0 8px 22px rgba(216,168,78,.24)}
.registered-user-plan.plan-creator strong{border-color:rgba(216,168,78,.42);background:rgba(216,168,78,.16);color:#ffe2a2}
.registered-user-plan.plan-free strong{border-color:rgba(255,255,255,.13);background:rgba(255,255,255,.055);color:#d9d1c2}
.registered-user-count strong{
  color:#f8e1a7;
  font-size:16px;
  font-weight:900;
  font-variant-numeric:tabular-nums;
}
@media(max-width:860px){
  .registered-users-dialog{width:min(720px,calc(100vw - 18px));max-width:min(720px,calc(100vw - 18px))}
  .registered-users-card{max-height:min(86vh,820px);padding:24px!important;border-radius:26px!important}
  .registered-users-columns{display:none}
  .registered-user-row{grid-template-columns:1fr 1fr;gap:12px;padding:15px}
  .registered-user-name,.registered-user-email{grid-column:1 / -1}
  .registered-user-label{display:block}
  .registered-user-cell strong{white-space:normal;overflow-wrap:anywhere}
  .registered-user-status strong,.registered-user-plan strong{white-space:nowrap}
}
@media(max-width:480px){
  .registered-users-dialog{width:calc(100vw - 12px);max-width:calc(100vw - 12px)}
  .registered-users-card{max-height:88vh;padding:20px 14px 14px!important;border-radius:22px!important;gap:13px}
  .registered-users-card>.profile-close{top:12px!important;right:12px!important}
  .registered-users-head{padding-right:44px}
  .registered-users-head h2{font-size:30px!important;line-height:1!important}
  .registered-users-summary{font-size:10px;min-height:28px;padding:6px 9px}
  .registered-user-row{grid-template-columns:1fr 1fr;border-radius:17px;padding:13px 12px;gap:11px}
  .registered-user-cell strong{font-size:12.5px}
  .registered-user-count strong{font-size:15px}
}

/* n 1183 - « Images du clip » : une planche de vignettes numerotees. La fenetre
   s elargit pour la grille, la liste defile sans pousser le titre hors de
   l ecran ; a 390 px, trois colonnes puis deux sous 360 px. */
.clip-images-dialog{width:min(760px,calc(100vw - 28px));}
/* n 1975 - C EST LA BOITE QUI DEFILE, PLUS UNE ZONE CACHEE DEDANS.
   Mesure du 26/09, fenetre de 720 px : la boite fait 634 px et son contenu
   684 (photos de reference 213 + grille 232 + pied 149 + en-tete 90). Avec
   `overflow:hidden` sur la boite et le defilement confine a la grille, la
   seule chose qui pouvait ceder etait la grille -- elle tombait a 90 px et
   cachait le geste. On rend donc le defilement a la boite : on fait defiler
   comme sur n importe quelle page, et le pied colle en bas reste sous les
   yeux pendant qu on parcourt les 18 images. */
.clip-images-dialog .profile-card{max-height:88vh;display:flex;flex-direction:column;overflow-y:auto;text-align:left;}
.clip-images-dialog .clip-images-summary{color:var(--muted);font-size:12px;margin:0 0 14px;line-height:1.45;}
/* n 1975 - LA GRILLE NE DOIT PAS SE REPLIER SOUS SES PROPRES CARTES.
   Mesure du 26/09 sur l ecran reel, fenetre de 720 px : `min-height:0` plus
   `flex:1 1 auto` laissaient la grille tomber a 90 px pour 1 291 px de
   contenu. Une carte fait 207 px -- on ne voyait donc que le haut des images,
   et NI le bouton « Une autre video… » NI « Retirer » n etaient a l ecran
   sans defiler dans un conteneur dont rien ne disait qu il defilait.
   `min-height` garde au moins une carte entiere, borne par la hauteur de la
   fenetre pour ne pas pousser le pied hors de l ecran sur un telephone. */
.clip-images-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;flex:0 0 auto;}
.clip-image{position:relative;margin:0;display:flex;flex-direction:column;gap:6px;}
.clip-image img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:#16181d;}
.clip-image-number{position:absolute;left:6px;top:6px;min-width:22px;padding:2px 6px;border-radius:999px;background:rgba(0,0,0,.72);color:#fff;font-size:11px;font-weight:700;text-align:center;}
.clip-image-toggle{min-height:30px;padding:5px 8px;font-size:12px;}
.clip-image.is-removed img{opacity:.32;filter:grayscale(1);}
.clip-image.is-removed .clip-image-number{background:rgba(80,80,80,.8);}
/* n 1497 - Les videos nees d une image, sous elle. Une bande qui defile
   horizontalement plutot qu une grille : une image en a zero, une ou deux, et
   une bande garde la colonne a la largeur de l image. Le lecteur n affiche que
   son affiche tant qu on ne survole pas -- un clip pese 4 a 16 Mo. */
.clip-image-videos{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;scrollbar-width:thin;}
.clip-image-video{flex:0 0 auto;width:64px;aspect-ratio:16/9;object-fit:cover;border-radius:8px;border:1px solid var(--line);background:#16181d;cursor:pointer;transition:transform .12s ease,border-color .12s ease;}
.clip-image-video:hover,.clip-image-video:focus-visible{transform:scale(1.04);border-color:var(--accent,#6aa7ff);}
.clip-image.is-removed .clip-image-video{opacity:.32;filter:grayscale(1);}
/* n 1497 - Ce qui sera utilise : un lisere sur la vignette choisie, et la
   phrase qui le dit. Le lisere seul ne suffit pas a distinguer trois etats. */
.clip-image img.est-choisi,.clip-image-video.est-choisi{outline:2px solid var(--accent,#6aa7ff);outline-offset:1px;}
.clip-image img[title]{cursor:pointer;}
.clip-image-choix{margin:0;color:var(--muted);font-size:11px;line-height:1.35;}
.clip-image.is-removed .clip-image-choix{display:none;}
@media(max-width:600px){
  .clip-images-dialog .profile-card{padding:22px 14px;}
  .clip-images-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
}
@media(max-width:360px){
  .clip-images-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
/* n 1184 - Photos de reference en haut (une rangee de vignettes carrees qui
   passe a la ligne), « Refaire les images et la video » en pied, hors de la
   zone qui defile : l action reste visible quelle que soit la longueur de la
   planche. */
.clip-references{border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:12px;flex:0 0 auto;}
.clip-references-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.clip-references-head h3{margin:0;font:700 14px Manrope,Inter,"Sakira JP",sans-serif;}
.clip-references-add{display:inline-flex;align-items:center;gap:6px;min-height:34px;font-size:12px;}
.clip-references-add svg{width:16px;height:16px;}
.clip-references-add:disabled{opacity:.5;cursor:not-allowed;}
/* n 1196 - Les deux choix de « Ajouter des photos », et la fenetre de
   bibliotheque posee dans sa propre <dialog> par-dessus « Images du clip » :
   la <dialog> ne dessine rien, `.library-overlay` garde son fond et sa mise en page. */
.clip-references-choix{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;margin-top:8px;}
.clip-references-choix button{min-height:34px;font-size:12px;}
.library-dialog{background:transparent;border:0;padding:0;margin:0;width:100vw;height:100vh;max-width:none;max-height:none;overflow:hidden;box-shadow:none;}
.library-dialog::backdrop{background:transparent;}
.clip-references-hint{color:var(--muted);font-size:12px;margin:6px 0 8px;line-height:1.45;}
.clip-references-grid{display:flex;flex-wrap:wrap;gap:8px;}
.clip-reference{margin:0;width:96px;display:flex;flex-direction:column;gap:6px;}
.clip-reference img{width:96px;height:96px;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:#16181d;}
/* n 1975 - PAS DE PIED COLLANT, ET C EST UN RETOUR EN ARRIERE ASSUME.
   Essaye le 26/09 pour garder « Refaire » toujours sous les yeux : ce pied
   fait 149 px sur une boite de 634, il recouvrait les boutons « Une autre
   video… » et le clic lui arrivait A LUI (mesure par `elementFromPoint`).
   On aurait rendu visible un geste en en rendant un autre inatteignable.
   La demande etait la COULEUR du bouton, pas un pied flottant : la boite
   defile normalement, le pied est a sa fin, et le bouton se voit par sa
   couleur. */
.clip-images-redo{flex:0 0 auto;border-top:1px solid var(--line);margin-top:12px;padding-top:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.clip-images-redo p{margin:0;color:var(--muted);font-size:12px;line-height:1.45;flex:1 1 auto;}
/* n 1975 - « REFAIRE » DOIT SE VOIR. Saray, 26/09 : « la couleur du bouton
   doit etre plus marquant ». Il portait la classe `.primary` et rien d autre,
   donc le meme aplat or que n importe quel bouton principal de la page, au
   fond d un pied gris, a cote d un bouton secondaire de meme taille : c est le
   geste qui fait repartir toute la chaine, et rien ne le disait. On lui donne
   le degrade et le halo deja utilises pour l action finale de TikTok
   (`.tiktok-draft-success-actions .primary`), en gardant les couleurs de la
   maison -- l or `--accent` vers l ambre clair, et une ombre portee doree. */
.clip-images-redo-button{flex:0 0 auto;justify-content:center;background:linear-gradient(135deg,var(--accent),#f2ba58);color:#1b1206;font-weight:800;box-shadow:0 14px 30px rgba(216,168,78,.28);}
.clip-images-redo-button:hover:not(:disabled){filter:brightness(1.06);box-shadow:0 16px 36px rgba(216,168,78,.36);}
.clip-images-redo-button:disabled{box-shadow:none;}
/* n 1975 - « Une autre video… », a la fin de la bande des videos d une image.
   Discret : il ouvre un choix, il ne lance rien. Il garde la hauteur des
   lecteurs pour que la bande reste une ligne droite. */
/* n 1975 - Sa propre ligne, SOUS la bande qui defile : dedans, il partait hors
   de l ecran des qu une image avait plusieurs videos. Pleine largeur, pour
   qu il se lise sans chercher. */
.clip-image-autre-rang{display:flex;margin-top:6px;}
.clip-image-autre-video{flex:1 1 auto;justify-content:center;padding:6px 10px;font-size:12px;white-space:nowrap;}
/* n 1508 - « Refaire la video seulement » a cote de « Refaire les images et
   la video ». Secondaire parce qu il fait moins : il ne redessine rien. */
.clip-images-redo-video{flex:0 0 auto;justify-content:center;}
@media(max-width:600px){.clip-images-redo-video{width:100%;}}
/* n 1187 - « Style des images » : sa propre ligne en tete du pied, au-dessus du
   texte et du bouton qu il commande. Le pied passe a la ligne pour la loger. */
.clip-images-redo{flex-wrap:wrap;}
.clip-images-style{flex:1 1 100%;display:flex;align-items:center;gap:10px;margin:0;color:var(--muted);font-size:12px;font-weight:700;}
.clip-images-style select{flex:0 1 220px;min-width:0;padding:8px 10px;font-size:13px;}
.clip-images-style select:disabled{opacity:.6;}
@media(max-width:600px){
  .clip-images-redo{flex-direction:column;align-items:stretch;}
  .clip-images-style{justify-content:space-between;}
  .clip-images-style select{flex:1 1 auto;max-width:62%;}
  .clip-reference{width:80px;}
  .clip-reference img{width:80px;height:80px;}
}

/* n 1178 brique 2 - L effet d ambiance dans la boite de la video paysage : les
   memes champs que « Composition du reel ». La boite est alignee a gauche ; les
   champs verrouilles pendant un rendu vertical se lisent comme tels, comme la
   teinte juste au-dessus. */
.engagement-dialog .paysage-effet{text-align:left;margin:0 0 18px;}
.engagement-dialog .paysage-effet .reel-effet-field:has(:disabled){opacity:.45;}

/* n 1197 - Le toast est un popover (voir toast() dans app.js) pour passer
   au-dessus des dialogues modaux. On annule ce que le navigateur donne a tout
   popover (ancre au centre, marge auto, bordure) : il reste en bas a droite. */
.toast[popover]{top:auto;left:auto;margin:0;border:0;overflow:visible;}

/* n 1252 - la boite « Deplacer la version » : une ligne par projet d accueil. */
.move-version-list{display:flex;flex-direction:column;gap:8px;max-height:min(52vh,420px);overflow:auto;padding:2px 4px 2px 0;scrollbar-gutter:stable;}
.move-version-row{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;text-align:left;padding:10px 14px;}
.move-version-row-title{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1 1 auto;}
.move-version-row-title strong{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.move-version-row-title small{font-size:12px;opacity:.68;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.move-version-row-action{flex:0 0 auto;font-size:12px;font-weight:600;letter-spacing:.02em;opacity:.85;white-space:nowrap;}
.move-version-row:hover .move-version-row-action,.move-version-row:focus-visible .move-version-row-action{opacity:1;}
.move-version-search{width:100%;margin:4px 0 10px;padding:9px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:inherit;font:inherit;}
.move-version-search:focus{outline:none;border-color:rgba(214,178,94,.7);}

/* n 1599 : l aide de Songs */
.aide-dialog{width:min(560px,calc(100vw - 28px))}
.aide-card{text-align:left}
.aide-liste{display:grid;gap:10px;margin-top:14px}
.aide-question{border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:#16181d}
.aide-question summary{cursor:pointer;font-weight:700}
.aide-question p{margin:10px 0 0;color:var(--muted);line-height:1.5;font-size:14px}
.tiktok-envois-aide{background:none;border:0;padding:0;color:var(--accent);text-decoration:underline;cursor:pointer;font:inherit}

/* n 1601 : la cloche des envois */
.cloche-envois,.chat-a-cote-de-la-cloche{position:fixed;top:14px;right:16px;z-index:40;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#16181d;color:var(--ink);display:grid;place-items:center;cursor:pointer}
.cloche-envois svg,.chat-a-cote-de-la-cloche svg{width:19px;height:19px}
.cloche-pastille{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--accent,#d8a84e);color:#111;font-size:11px;font-weight:700;line-height:18px;text-align:center}
.cloche-pastille[hidden]{display:none}
.cloche-pastille.cloche-pastille-grave{background:#dc2626;color:#fff}
.cloche-dialog{width:min(560px,calc(100vw - 28px))}
.cloche-card{text-align:left}
.cloche-liste{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px;max-height:60vh;overflow:auto}
.cloche-envoi{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#16181d}
.cloche-envoi.cloche-grave{border-color:#dc2626}
.cloche-envoi-tete{display:flex;justify-content:space-between;gap:10px;font-size:13px}
.cloche-envoi-tete time{color:var(--muted);font-size:12px}
.cloche-envoi-etat{margin-top:4px;font-weight:600;font-size:14px}
.cloche-grave .cloche-envoi-etat{color:#f87171}
/* n 2061 : deux etats (D-T-80). Termine en vert, le detail technique en petit et en gris, « Nouveau » sur le non vu. */
.cloche-envoi.cloche-termine{border-color:#166534}
.cloche-termine .cloche-envoi-etat{color:#4ade80}
.cloche-envoi-technique{margin-top:3px;color:var(--muted);font-size:11px;opacity:.8;overflow-wrap:anywhere;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.cloche-envoi-tete strong{flex:1}
.cloche-nouveau-marque{align-self:center;padding:1px 7px;border-radius:9px;background:var(--accent,#d8a84e);color:#111;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.cloche-envoi-detail,.cloche-envoi-erreur{margin-top:3px;color:var(--muted);font-size:12px;overflow-wrap:anywhere}
.cloche-envoi-erreur{color:#fca5a5}
@media(max-width:600px){.cloche-envois,.chat-a-cote-de-la-cloche{top:10px;right:10px;width:36px;height:36px}.chat-a-cote-de-la-cloche{right:54px}}

/* n 2017 - « Mes images de reference » : les jeux nommes du compte.
   Reprend les conventions des autres boites de profil (profile-dialog /
   profile-card) et la grille des photos de reference du dialogue « Images du
   clip » (clip-references-grid / clip-reference) : rien de neuf hormis la carte
   d un jeu et le rappel visuel du jeu par defaut. */
.jeux-reference-dialog{width:min(760px,calc(100vw - 28px));}
.jeux-reference-dialog .profile-card{max-width:760px;width:min(760px,94vw);text-align:left;gap:12px;}
.jeux-intro{margin:0;color:var(--muted);font-size:12px;line-height:1.45;}
.jeux-vide{margin:0;color:var(--muted);font-size:13px;}
/* n 2093 - LA BANDE DES CATEGORIES LIVREES, le chemin standard : elle passe
   AVANT la ligne « nommer un jeu », parce qu un clic y suffit. */
.jeux-rapide{display:flex;flex-direction:column;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.03);}
.jeux-rapide-titre{margin:0;font-size:13px;font-weight:600;}
.jeux-rapide-groupes{display:flex;flex-direction:column;gap:6px;}
.jeux-rapide-groupe{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.jeux-rapide-groupe-nom{min-width:88px;color:var(--muted);font-size:12px;}
.jeux-rapide-bouton{min-height:32px;font-size:12px;padding:0 12px;}
.jeux-rapide-aide{margin:0;color:var(--muted);font-size:12px;line-height:1.45;}
.jeux-groupe-titre{margin:6px 0 0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.jeu-champ-categorie select{width:100%;min-height:38px;}
.jeu-categorie-libre{width:100%;min-height:38px;}
.jeu-categorie-aide{margin:0;color:var(--muted);font-size:12px;line-height:1.45;}
.jeux-nouveau{display:flex;gap:8px;flex-wrap:wrap;}
.jeux-nouveau input{flex:1 1 220px;min-height:38px;}
.jeux-liste{display:flex;flex-direction:column;gap:14px;}
.jeu-carte{border:1px solid var(--line);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px;background:rgba(255,255,255,.02);}
.jeu-carte-defaut{border-color:var(--gold,#d4af37);}
.jeu-champ{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);}
.jeu-champ input,.jeu-champ textarea{width:100%;}
.jeu-description-aide,.jeu-photos-aide{margin:0;color:var(--muted);font-size:12px;line-height:1.45;}
.jeu-defaut{display:flex;align-items:center;gap:8px;font-size:13px;}
.jeu-defaut input{width:auto;}
.jeu-actions{display:flex;gap:8px;flex-wrap:wrap;}
.jeu-actions button{min-height:34px;font-size:12px;}
.jeux-choix-liste{display:flex;flex-direction:column;gap:8px;margin:10px 0;}
.jeux-choix-bouton{min-height:38px;text-align:left;}

/* n 2013 (27/09) - LE BOUTON DE REMISE, DANS LA CLOCHE.
   Il portait `btn small`, une classe qui n'existe pas ici : il restait un bouton
   nu du navigateur, contraste mesuré 1,02 -- blanc sur blanc. Il prend la classe
   `secondary` de l'application ; ce bloc ne fait que le détacher de la ligne. */
.cloche-incident-action{margin-top:10px;display:inline-flex;align-items:center;gap:7px;min-height:38px}
.cloche-incident-action:disabled{opacity:.55}

/* n 2017 (27/09) - LA BOITE ETAIT DEUX FOIS TROP ETROITE POUR SA CARTE.
   Mesure dans un navigateur a 1280x720 : le <dialog> faisait 430 px et la carte
   760 px -- 331 px sortaient A GAUCHE. Le titre se lisait « …nce », le bouton
   « …pprimer le jeu », les libelles des champs etaient coupes, la vignette
   tranchee. La cause : `.profile-dialog` fixe `width:min(430px,…)` sur le
   DIALOGUE, et la regle des jeux n elargissait que la CARTE. Les autres boites
   larges elargissent le dialogue (voir `.cloche-dialog`), et c est ce que fait
   maintenant `.jeux-reference-dialog` ci-dessus. Trouve en regardant l ecran,
   jamais par un test vert. */

/* n 2049 — choix brouillons / publication directe TikTok, et ecran de
   publication directe (consignes TikTok). Meme matiere que la fenetre des
   comptes, dont il reprend la carte. */
.tiktok-mode-field,
.tiktok-direct-dialog .tiktok-direct-field{
  margin:0;
  padding:12px;
  border:1px solid rgba(216,168,78,.14);
  border-radius:18px;
  background:rgba(0,0,0,.22);
  display:grid;
  gap:8px;
  min-width:0;
}
.tiktok-mode-field legend,
.tiktok-direct-dialog .tiktok-direct-label{
  padding:0;
  color:#d6c49c;
  font-size:10px;
  font-weight:950;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.tiktok-mode-option,
.tiktok-direct-disclose label,
.tiktok-direct-toggle{
  display:grid;
  grid-template-columns:20px minmax(0,1fr);
  align-items:start;
  gap:10px;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:15px;
  background:rgba(255,255,255,.03);
  color:#f5ecd9;
  cursor:pointer;
}
.tiktok-mode-option:has(input:checked){border-color:rgba(232,188,99,.72);background:rgba(216,168,78,.12);}
.tiktok-mode-option:has(input:disabled),
.tiktok-direct-toggle.is-disabled{opacity:.5;cursor:not-allowed;}
.tiktok-mode-option span,
.tiktok-direct-disclose label>span{display:grid;gap:2px;min-width:0;}
.tiktok-mode-option small,
.tiktok-direct-disclose small,
.tiktok-direct-toggle small{grid-column:2;color:#bfb29a;font-size:12px;line-height:1.35;}
.tiktok-mode-notice{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;color:#ffd38a;font-size:13px;}
.tiktok-mode-notice[hidden]{display:none;}
/* n 2052 : l avertissement « avant l audit TikTok », lu avant le clic. */
.tiktok-mode-option small.tiktok-mode-audit,.tiktok-direct-audit{color:#ffd38a;}
.tiktok-direct-audit[hidden]{display:none;}
.tiktok-reconnect{display:inline-flex;padding:7px 12px;border-radius:999px;text-decoration:none;}
.tiktok-direct-dialog .tiktok-direct-body{display:grid;gap:12px;min-width:0;}
.tiktok-direct-creator{display:flex;align-items:center;gap:10px;color:#fff6e4;}
.tiktok-direct-creator div{display:grid;}
.tiktok-direct-creator small{color:#bfb29a;font-size:12px;}
.tiktok-direct-avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;}
.tiktok-direct-video{width:100%;max-height:280px;border-radius:14px;background:#000;}
.tiktok-direct-dialog textarea,
.tiktok-direct-dialog select{width:100%;box-sizing:border-box;}
.tiktok-direct-hint,
.tiktok-direct-dialog .muted{font-size:12px;line-height:1.4;margin:0;}
.tiktok-direct-hint{color:#ffd38a;}
.tiktok-direct-too-long,
.tiktok-direct-stop{margin:0;color:#ff9b8a;}
.tiktok-direct-consent{margin:0;color:#f5ecd9;font-size:13px;}
.tiktok-direct-consent a{color:#e8bc63;}
.tiktok-direct-disclose-options{display:grid;gap:8px;}
.tiktok-direct-disclose-options[hidden],
.tiktok-direct-dialog [hidden]{display:none!important;}
.tiktok-direct-submit-wrap{display:inline-flex;}
.tiktok-mode-option span small,
.tiktok-direct-disclose label>span small{grid-column:auto;}
.tiktok-mode-option,
.tiktok-direct-disclose label,
.tiktok-direct-toggle,
.tiktok-direct-dialog .tiktok-direct-body,
.tiktok-direct-dialog .immediate-publication-head p{text-align:left;}
.tiktok-direct-toggle small{grid-column:2;}

/* n 2147, D-T-142 - L'EDITION (editions/*.json). Rien ici ne vise Songs : chaque
   regle porte sur un element que seule une autre edition pose ou retire. */
.chat-a-cote-de-la-cloche{right:64px;padding:0;gap:0}
.chat-a-cote-de-la-cloche span{display:none}
.chat-a-cote-de-la-cloche[hidden]{display:none!important}
[data-filtre-retire]{display:none!important}
.magic-layout:not(:has(.magic-social)){grid-template-columns:minmax(0,1fr)}
.edition-onglets-recents{display:flex;gap:8px;margin:0 0 18px}
.edition-onglets-recents button{border:1px solid var(--line);background:var(--panel);color:var(--muted);padding:8px 18px;border-radius:999px;font-weight:700}
.edition-onglets-recents button.active{border-color:var(--accent);color:var(--ink)}
@media(max-width:600px){.chat-a-cote-de-la-cloche{right:54px}}
/* n 2132 - LE LECTEUR NE RECOUVRE PLUS LA BARRE D'ONGLETS DU BAS. Sur telephone, la
   barre mesure 72px + env(safe-area-inset-bottom) (regle « Mobile navigation » plus
   haut), mais le lecteur se posait a 78px fixes : sur un iPhone a barre d'accueil
   (34px), il recouvrait 28px du haut des onglets. Mesure le 04/10 en simulant
   l'encart par Emulation.setSafeAreaInsetsOverride, avec document.elementFromPoint
   au haut de chaque bouton (piege n 1975) : bas du lecteur 766, haut de la barre
   738 avant ; le lecteur s'arrete au-dessus de la barre apres. */
@media(max-width:600px){
  .sakira-player{bottom:calc(78px + env(safe-area-inset-bottom,0px))!important}
  body:has(#sakira-player:not([hidden])) .main{padding-bottom:calc(230px + env(safe-area-inset-bottom,0px))!important}
}