body.app .dashboard-view-tabs { display:flex; width:max-content; max-width:100%; gap:4px; padding:4px; margin:0 0 24px; background:var(--surface); border:1px solid var(--border2); border-radius:12px; }
body.app .dashboard-view-tabs button { min-height:42px; padding:8px 18px; border:0; border-radius:8px; background:transparent; color:var(--text); font-family:inherit; font-size:14px; font-weight:600; line-height:1.5; cursor:pointer; user-select:none; }
body.app .dashboard-view-tabs button[aria-selected=true] { background:var(--accent-subtle,rgba(99,102,241,.16)); color:var(--heading,var(--text)); box-shadow:0 1px 3px #0002; }
body.app #dashboardOverview .row.g-6 { --bs-gutter-x:20px; --bs-gutter-y:20px; }
body.app #dashboardOverview .card { margin-bottom:0; border-radius:12px; overflow:hidden; }
body.app #dashboardOverview .card-body { padding:20px; }
body.app #dashboardOverview .card-header { padding:16px 20px; min-height:58px; gap:12px; flex-wrap:wrap; }
body.app #dashboardOverview .card-title { display:flex; align-items:center; flex-wrap:wrap; gap:8px; font-size:16px; }
body.app #dashboardOverview .dashboard-speed { width:100%; padding:24px 0; color:var(--text); }
body.app #dashboardOverview .dashboard-speed>strong { display:block; margin-bottom:24px; font-size:36px; line-height:1.3; color:var(--heading); font-variant-numeric:tabular-nums; }
body.app #dashboardOverview .dashboard-speed>strong>span { font-size:16px; font-weight:500; }
body.app #dashboardOverview .dashboard-speed progress { display:block; width:100%; height:8px; border:0; border-radius:8px; overflow:hidden; appearance:none; accent-color:var(--success); background:var(--surface2); }
body.app #dashboardOverview .dashboard-speed progress::-webkit-progress-bar { background:var(--surface2); }
body.app #dashboardOverview .dashboard-speed progress::-webkit-progress-value { background:var(--success); border-radius:8px; }
body.app #dashboardOverview .dashboard-speed progress::-moz-progress-bar { background:var(--success); border-radius:8px; }
body.app #dashboardOverview .dashboard-speed dl { display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; margin:20px 0 0; }
body.app #dashboardOverview .dashboard-speed :is(dt,dd) { font-size:14px; margin:0; line-height:1.7; }
body.app #dashboardOverview .dashboard-speed dt { color:var(--text2); font-weight:400; }
body.app #dashboardOverview h5[id^=stat] { font-size:23px; font-variant-numeric:tabular-nums; cursor:default!important; }
body.app #dashboardAccounts .admin-accounts-header { align-items:flex-start!important; }
body.app #dashboardAccounts .admin-account-actions { flex:1; justify-content:flex-end; }
body.app #dashboardAccounts .account-filter-bar { padding:16px; margin:0 0 16px!important; border:1px solid var(--border2); border-radius:10px; background:var(--surface2); gap:12px!important; }
body.app .publishing-workspace { --pub-green:#80d8a5; --pub-red:#ff9aa3; --pub-amber:#f2d38b; }
body.app .publishing-workspace { max-width:1600px; margin-inline:auto; }
body.app .publishing-workspace>.admin-page-header,body.app #tabAccounts>.admin-page-header { flex-direction:row!important; align-items:center!important; justify-content:space-between!important; gap:16px; }
body.app.light-mode .publishing-workspace { --pub-green:#176b43; --pub-red:#ad2437; --pub-amber:#79570d; }
body.app .publishing-workspace :is(h1,h2,h3,p,dl) { margin:0; }
body.app .publishing-workspace h2 { font-size:17px; font-weight:650; color:var(--heading); }
body.app .publishing-workspace :is(button,input,summary,p,span,td,th,dt,dd) { font-size:14px; }
body.app .publishing-workspace .page-subtitle { margin-top:6px; }
body.app .publishing-workspace .admin-actions { align-items:center; }
body.app .publishing-workspace #ytAdminActions { display:flex; flex-wrap:wrap; gap:10px; }
body.app .publishing-workspace :is(.publishing-surface,.publishing-job,.publishing-empty) { background:var(--surface); border:1px solid var(--border2); border-radius:14px; }
body.app .publishing-workspace .publishing-surface { padding:20px; margin-bottom:24px; }
body.app .publishing-workspace .publishing-create label { display:block; font-size:14px; font-weight:600; margin-bottom:10px; }
body.app .publishing-workspace #vodAddRow { display:flex; flex-wrap:nowrap; align-items:stretch; gap:12px; margin:0; }
body.app .publishing-workspace #vodUrlInput { flex:1 1 auto; min-width:0; width:auto; }
body.app .publishing-workspace #vodAddBtn { flex:0 0 auto; }
body.app .publishing-workspace input { min-height:44px; padding:10px 14px; background:var(--bg); color:var(--text); border:1px solid var(--border2); border-radius:8px; box-sizing:border-box; }
body.app .publishing-workspace #vodAddMsg:not(:empty) { margin-top:12px; color:var(--pub-green); }
body.app .publishing-workspace #vodAddMsg[data-error=true] { color:var(--pub-red); }
body.app .publishing-workspace :is(#vodQuota,#ytAdminStatus) { display:grid!important; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:16px!important; margin-bottom:24px; }
body.app .publishing-workspace .publishing-metric { padding:18px 20px; border:1px solid var(--border2); border-radius:12px; background:var(--surface); min-width:0; }
body.app .publishing-workspace .publishing-metric span { display:block; color:var(--text2); margin-bottom:8px; }
body.app .publishing-workspace .publishing-metric strong { display:block; color:var(--heading); font-size:23px; line-height:1.35; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
body.app .publishing-workspace .publishing-toolbar { display:flex; flex-wrap:wrap; gap:16px; align-items:center; margin:28px 0 12px; }
body.app .publishing-workspace .publishing-search { display:flex; gap:10px; align-items:center; margin:0 0 0 auto; }
body.app .publishing-workspace .publishing-search input { width:260px; max-width:100%; }
body.app .publishing-workspace .publishing-filters { display:flex; flex-wrap:wrap; padding:3px; gap:3px; border:1px solid var(--border2); border-radius:10px; background:var(--surface); }
body.app .publishing-workspace .publishing-filters button { padding:8px 12px; min-height:38px; border:0; border-radius:7px; background:transparent; color:var(--text); cursor:pointer; user-select:none; }
body.app .publishing-workspace .publishing-filters button[aria-pressed=true] { background:var(--surface2); color:var(--heading); box-shadow:0 0 0 1px var(--border2); }
body.app .publishing-workspace .publishing-count { color:var(--text2); margin-bottom:16px; line-height:1.7; }
body.app .publishing-workspace :is(#vodJobs,#ytAdminBody) { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; }
body.app .publishing-workspace #ytAdminBody { grid-template-columns:repeat(auto-fit,minmax(min(100%,480px),1fr)); align-items:start; }
body.app .publishing-workspace .publishing-job { min-width:0; padding:22px; }
body.app .publishing-workspace .publishing-job>header { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:18px; }
body.app .publishing-workspace .publishing-job>header>div { min-width:0; }
body.app .publishing-workspace .publishing-job h3 { font-size:16px; line-height:1.5; color:var(--heading); overflow-wrap:anywhere; }
body.app .publishing-workspace .publishing-job header p { margin-top:5px; color:var(--text2); overflow-wrap:anywhere; }
body.app .publishing-workspace .publishing-badge { display:inline-flex; flex-shrink:0; padding:4px 10px; border:1px solid var(--border2); border-radius:7px; font-weight:600; color:var(--text); background:var(--surface2); }
body.app .publishing-workspace .publishing-badge[data-status=done] { color:var(--pub-green); }
body.app .publishing-workspace .publishing-badge[data-status=failed] { color:var(--pub-red); }
body.app .publishing-workspace .publishing-badge:is([data-status=waiting_quota],[data-status=queued]) { color:var(--pub-amber); }
body.app .publishing-workspace .publishing-progress { margin:12px 0; min-width:120px; }
body.app .publishing-workspace .publishing-progress>div { display:flex; justify-content:space-between; gap:12px; margin-bottom:8px; color:var(--text2); }
body.app .publishing-workspace progress { display:block; width:100%; height:7px; appearance:none; border:0; border-radius:8px; overflow:hidden; background:var(--surface2); accent-color:var(--pub-green); }
body.app .publishing-workspace progress::-webkit-progress-bar { background:var(--surface2); border-radius:8px; }
body.app .publishing-workspace progress::-webkit-progress-value { background:var(--pub-green); border-radius:8px; }
body.app .publishing-workspace progress::-moz-progress-bar { background:var(--pub-green); border-radius:8px; }
body.app .publishing-workspace .publishing-job-meta { display:flex; flex-wrap:wrap; gap:10px 24px; margin:14px 0; color:var(--text2); }
body.app .publishing-workspace .publishing-metadata { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:12px; }
body.app .publishing-workspace dt { color:var(--text2); font-weight:400; margin-bottom:6px; }
body.app .publishing-workspace dd { color:var(--text); margin:0; overflow-wrap:anywhere; }
body.app .publishing-workspace details { margin:16px 0 0; border-top:1px solid var(--border2); }
body.app .publishing-workspace #ytProjectQuota details { margin:0; border:0; }
body.app .publishing-workspace summary { position:relative; padding:14px 32px 14px 0; list-style:none; cursor:pointer; font-weight:600; color:var(--text); user-select:none; }
body.app .publishing-workspace summary::-webkit-details-marker { display:none; }
body.app .publishing-workspace summary::after { content:""; position:absolute; right:16px; top:19px; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); }
body.app .publishing-workspace details[open]>summary::after { transform:rotate(225deg); }
body.app .publishing-workspace .publishing-table-scroll { overflow:auto; max-width:100%; max-height:520px; border:1px solid var(--border2); border-radius:9px; }
body.app .publishing-workspace table { width:100%; min-width:800px; border-collapse:collapse; }
body.app .publishing-workspace :is(th,td) { padding:12px 14px; border-bottom:1px solid var(--border2); text-align:left; overflow-wrap:anywhere; max-width:380px; }
body.app .publishing-workspace th { color:var(--text2); font-weight:600; background:var(--surface2); }
body.app .publishing-workspace .publishing-job>footer { display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center; gap:10px; border-top:1px solid var(--border2); margin-top:18px; padding-top:16px; }
body.app .publishing-workspace .publishing-job>footer>button:first-child:not(:last-child) { margin-right:auto; }
body.app .publishing-workspace .publishing-button,body.app .publishing-workspace .publishing-link { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:40px; padding:8px 12px; background:var(--surface2); color:var(--text)!important; border:1px solid var(--border2)!important; border-radius:8px; font-family:inherit; font-size:14px; font-weight:500; line-height:1.5; text-decoration:none; cursor:pointer; user-select:none; }
body.app .publishing-workspace .publishing-button svg,body.app .publishing-workspace .publishing-link svg { height:17px; width:17px; flex:0 0 17px; }
body.app .publishing-workspace .publishing-button.is-danger { color:var(--pub-red)!important; }
body.app .publishing-workspace .publishing-button:disabled { opacity:.55; cursor:wait; }
body.app .publishing-workspace .publishing-button:hover:not(:disabled),body.app .publishing-workspace .publishing-link:hover { background:var(--surface3,var(--surface)); }
body.app .publishing-workspace :is(button,a,input,summary):focus-visible,body.app .dashboard-view-tabs button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
body.app .publishing-workspace :is(.publishing-error,.publishing-notice) { display:block; padding:14px; border:1px solid var(--border2); border-radius:9px; line-height:1.65; overflow-wrap:anywhere; color:var(--pub-red); background:var(--surface2); }
body.app .publishing-workspace .publishing-notice { margin-bottom:20px; color:var(--text); }
body.app .publishing-workspace .publishing-notice[data-tone=error] { color:var(--pub-red); }
body.app .publishing-workspace .publishing-error-details p { white-space:pre-wrap; overflow-wrap:anywhere; padding:12px; color:var(--pub-red); background:var(--surface2); border-radius:8px; }
body.app .publishing-workspace .publishing-empty { padding:36px 20px; text-align:center; color:var(--text2); }
body.app .publishing-workspace .publishing-quota { display:grid; grid-template-columns:minmax(120px,1fr) minmax(150px,3fr); gap:20px; align-items:center; padding:12px 0; border-bottom:1px solid var(--border2); }
body.app .publishing-workspace .publishing-console { margin-top:24px; }
body.app .publishing-workspace .publishing-console header { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:16px; }
body.app .publishing-workspace #vodLogFor { overflow-wrap:anywhere; color:var(--text2); }
body.app .publishing-workspace #vodConsole { max-height:300px; overflow:auto; margin:0; padding:14px; border:1px solid var(--border2); border-radius:8px; background:var(--bg)!important; color:var(--text)!important; font:14px/1.8 ui-monospace,monospace; white-space:pre-wrap; overflow-wrap:anywhere; }
body.app .publishing-confirm { position:fixed; inset:0; margin:auto; width:min(520px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); box-sizing:border-box; overflow:auto; padding:24px; border:1px solid var(--border2); border-radius:14px; background:var(--surface); color:var(--text); }
body.app .publishing-confirm::backdrop { background:#0009; }
body.app .publishing-confirm h2 { font-size:20px; margin:0 0 16px; }
body.app .publishing-confirm p { font-size:14px; line-height:1.7; overflow-wrap:anywhere; }
body.app .publishing-confirm form>div { display:flex; justify-content:flex-end; gap:12px; margin-top:24px; }
body.app .publishing-confirm button { min-height:42px; padding:9px 14px; border:1px solid var(--border2); border-radius:8px; background:var(--surface2); color:var(--text); font-size:14px; cursor:pointer; }
body.app .publishing-confirm .is-danger { color:var(--danger); }
@media(prefers-reduced-motion:no-preference) { body.app .publishing-workspace :is(summary::after,button),body.app .dashboard-view-tabs button { transition:background-color .16s ease,color .16s ease,transform .16s ease; } body.app .publishing-workspace progress::-webkit-progress-value { transition:width .3s ease; } body.app .publishing-confirm[open] { animation:publishing-enter .16s ease-out; } @keyframes publishing-enter { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:translateY(0); } } }
@media(max-width:700px) { body.app .publishing-workspace .publishing-job { padding:16px; } body.app .publishing-workspace .publishing-job>header { flex-direction:column; gap:10px; } body.app .publishing-workspace .publishing-metadata { grid-template-columns:1fr; gap:12px; } body.app .publishing-workspace .publishing-search { margin:0; width:100%; } body.app .publishing-workspace .publishing-search input { flex:1; min-width:0; width:100%; } body.app .publishing-workspace #vodAddRow { flex-direction:column; } body.app .publishing-workspace .publishing-quota { grid-template-columns:1fr; gap:0; } body.app #dashboardAccounts .admin-account-actions { justify-content:flex-start; } body.app #dashboardAccounts .account-filter-bar { padding:10px; } }
@media(max-width:700px) { body.app .publishing-workspace :is(#vodQuota,#ytAdminStatus) { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px!important; } body.app .publishing-workspace .publishing-metric { padding:14px; } body.app .publishing-workspace .publishing-metric strong { font-size:20px; } body.app .publishing-workspace>.admin-page-header,body.app #tabAccounts>.admin-page-header { align-items:flex-start!important; } }
