:root{color-scheme:light;color:#29222e;background:#fff}
body,.summary-phase{background:#fff;color:#29222e;font-family:Arial,Helvetica,sans-serif}
.summary-phase #shell>header{background:#fff;border-color:#e4dce8;box-shadow:0 2px 8px #35203e08}
.summary-phase #signedInName{color:#332039}
.summary-phase #rangePicker>summary,.summary-phase .revenue-header #channelPicker>summary,.summary-phase #revenueHeader #export{background:#f8f3fa;color:#713d80;border-color:#d8c9df;font-size:14px}
.summary-phase #rangePicker[open]>summary,.summary-phase #channelPicker[open]>summary{background:#f0e4f5;color:#592768}
.summary-phase .metrics article{background:#fff;border-color:#e4dce8;box-shadow:0 3px 12px #43204e08;min-height:196px;padding:24px;gap:14px;transition:none}
.summary-phase .metrics strong{font-size:36px;line-height:1.15;color:#302336;font-weight:800;overflow-wrap:normal}
.summary-phase .metrics #total{color:#80366e}
.summary-phase .metrics article:nth-child(2) strong{color:#923754}
.summary-phase .metrics article:nth-child(3) strong{color:#754396}
.summary-phase .metrics article>span:not(.metric-icon),.summary-phase .revenue-split div>span{font-size:14px;color:#64596a;line-height:1.45}
.summary-phase .revenue-split:has(#sponsorMetric:not([hidden])):has(#adMetric:not([hidden])) strong{font-size:29px}
.summary-phase .metrics article:nth-child(1){--tile:#f6e2f1;--accent:#9c387d}.summary-phase .metrics article:nth-child(2){--tile:#f7e5ea;--accent:#a1395c}.summary-phase .metrics article:nth-child(3){--tile:#eee4f8;--accent:#81419f}.summary-phase .metrics article:nth-child(4){--tile:#eee7f8;--accent:#79469e}
#revenueShare,#viewsTreeButton{background:#fff;color:#302336;border-color:#e0d6e5}
.share-title,.daily-revenue h2,#viewsDistribution h2{color:#302336;font-size:17px}
.compact-share-row strong,.share-centre>span,#dailyRevenueNote,#viewsDistributionEmpty{color:#665a6c;font-size:13px}
.share-channel{font-size:14px}.share-centre strong{color:#302336}
.daily-revenue,#revenueShareExpanded,.summary-phase #dashboard>#viewsDistribution,.summary-phase #dashboard>#channelMetrics{border-color:#e6dfe9}
.distribution-track{background:#f0ebf3}
.full-share-row strong{font-size:15px;color:#3e3047}
.metrics-toggle,.distribution-collapse,.share-dialog-heading .distribution-collapse{background:#f7f1fa;color:#713d80;border-color:#d9c7e2}
#channelMetrics thead th{background:#f1eaf5;color:#493450}
#channelMetrics tbody th{color:#493450;background:#fff}
#channelMetrics .metric-heat-0{background:#faf7fc}#channelMetrics .metric-heat-1{background:#f2e9f7}#channelMetrics .metric-heat-2{background:#e6d6ee}#channelMetrics .metric-heat-3{background:#d4b7e0}#channelMetrics .metric-heat-4{background:#bb91cb}
#channelMetrics td{color:#38253e;font-size:14px}
.summary-phase .channel-menu,.summary-phase .range-panel,#accountMenu .account-panel,dialog,nav{background:#fff;color:#35293d;border-color:#dbcfe1}
button,input,select{background:#fff;color:#3e3047;border-color:#d5c8dd}
.summary-phase .picker-actions button,.summary-phase .calendar-nav button,.summary-phase .calendar-choices button{background:#f6eff9;color:#673374;border-color:#d8c9df}
.summary-phase #channelOptions label{color:#403447;font-size:14px}
.summary-phase #channelOptions label:hover{background:#f3eaf8}
.flatpickr-calendar.inline,.flatpickr-weekdays{background:#fff;color:#493450}
.summary-phase .flatpickr-weekdays .flatpickr-weekday{background:#fff;color:#695d72}
.flatpickr-day{color:#713582;background:#f3e8f8;border-color:#fff}
.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover{color:#a7a0ac;background:#fff}
.flatpickr-day:hover{background:#e5ceee;color:#582668}
.flatpickr-day.selected,.flatpickr-day.selected:hover{background:#864396;color:white}
.account-panel nav button.active{background:#f2e6f7;color:#75388a}
table,thead,th,td,.table-wrap{color:#403447;border-color:#e1d7e6}
thead th{background:#f5eff8}
.views-tree-tile{border-color:#fff}
#viewsTree .views-tree-tile{padding:10px;gap:10px}
#viewsTree .views-tree-tile>span{font-size:16px;line-height:1.4;font-weight:700}
#viewsTree .views-tree-tile>strong{font-size:16px;line-height:1.4;font-weight:800}
#viewsDistributionRows .share-channel,#viewsDistributionRows .full-share-row strong{font-size:16px;line-height:1.5;font-weight:700}
#reportLoading,#notice{background:#f6eff9;color:#63366e;border-color:#d9c3e3}
.muted,small,.identity{color:#716476}
@media(max-width:1100px){.summary-phase .metrics strong{font-size:32px}}
@media(max-width:600px){.summary-phase .metrics article{padding:16px;min-height:176px}.summary-phase .metrics strong{font-size:25px}.summary-phase .revenue-split:has(#sponsorMetric:not([hidden])):has(#adMetric:not([hidden])) strong{font-size:23px}}
/* Seashell / garnet palette: white surfaces, muted borders, saturated data accents. */
.summary-phase #shell>header{border-color:#dce4ea}
.summary-phase #signedInName,.summary-phase .metrics strong{color:#30525c}
.brand-icon{background:#5484a4}
.summary-phase #rangePicker>summary,.summary-phase .revenue-header #channelPicker>summary,.summary-phase #revenueHeader #export,.metrics-toggle,.distribution-collapse,.share-dialog-heading .distribution-collapse{background:#f1f6f8;color:#30525c;border-color:#acc0d3}
.summary-phase #rangePicker[open]>summary,.summary-phase #channelPicker[open]>summary{background:#e1eef0;border-color:#5484a4;color:#30525c}
.summary-phase .metrics article{border-color:#dae3e9;box-shadow:0 3px 12px #30525c08}
.summary-phase .metrics #total{color:#30525c}
.summary-phase .metrics article:nth-child(2) strong{color:#99475c}
.summary-phase .metrics article:nth-child(3) strong{color:#416d88}
.summary-phase .metrics article:nth-child(1){--tile:#e0f3f2;--accent:#087c7c}.summary-phase .metrics article:nth-child(2){--tile:#fae7ec;--accent:#99475c}.summary-phase .metrics article:nth-child(3){--tile:#e5edf4;--accent:#416d88}.summary-phase .metrics article:nth-child(4){--tile:#fff0dc;--accent:#86551e}
.summary-phase button:not(:disabled):hover,.summary-phase summary:hover{border-color:#5484a4;box-shadow:0 0 0 1px #5484a433,0 0 14px #09a1a118}
.summary-phase #channelPicker>summary:focus-visible,.summary-phase #rangePicker>summary:focus-visible,input:focus,select:focus,button:focus-visible{outline-color:#5484a4}
.summary-phase .picker-actions button,.summary-phase .calendar-nav button,.summary-phase .calendar-choices button{background:#edf4f7;color:#30525c;border-color:#acc0d3}
.summary-phase #channelOptions input{accent-color:#087c7c}
.summary-phase #channelOptions label:hover{background:#e7f3f3;box-shadow:inset 0 0 0 1px #acc0d3}
.flatpickr-day{background:#e5f4f3;color:#096f70;border-color:white}.flatpickr-day:hover{background:#cae9e7;color:#30525c}.flatpickr-day.selected,.flatpickr-day.selected:hover{background:#5484a4;border-color:#5484a4;color:white}
.primary{background:#46738f;border-color:#46738f;color:white}.primary:hover{background:#30525c}
.account-panel nav button.active{background:#e5f2f3;color:#30525c;border-left-color:#09a1a1}
#revenueShare,#viewsTreeButton{border-color:#dce4ea}
#channelMetrics thead th{background:#eaf0f5;color:#30525c}
#channelMetrics .metric-heat-0{background:#f7fafc}#channelMetrics .metric-heat-1{background:#e6eef5}#channelMetrics .metric-heat-2{background:#cedeea}#channelMetrics .metric-heat-3{background:#acc0d3}#channelMetrics .metric-heat-4{background:#5484a4;color:white}
.distribution-track{background:#eaf0f5}
.loading-spinner{border-color:#d5e5eb;border-top-color:#5484a4}
#reportLoading,#notice{background:#edf5f7;color:#30525c;border-color:#acc0d3}
.summary-phase #accountMenu .account-panel button{background:#fff;color:#30525c;border-color:#cbdbe5}
.summary-phase #accountMenu .account-panel button:hover{background:#edf5f7;color:#234653;border-color:#8eafc3;box-shadow:none}
.summary-phase #accountMenu .account-panel nav button{background:transparent;color:#30525c}
.summary-phase #accountMenu .account-panel nav button:hover{background:#edf5f7;color:#234653;box-shadow:inset 3px 0 #acc0d3}
.summary-phase #accountMenu .account-panel nav button.active{background:#e2f1f2;color:#235360;border-left-color:#09a1a1}
.summary-phase #accountMenu .account-panel nav button.active:hover{background:#d6ebed;color:#235360;box-shadow:none}
.summary-phase #accountMenu>summary:hover{background:#f1f6f8;box-shadow:none;border-radius:8px}
.summary-phase #accountMenu>summary:focus:not(:focus-visible){outline:none}
.summary-phase #accountMenu>summary:focus-visible{outline:2px solid #5484a4;outline-offset:4px;border-radius:8px}
#channelMetrics th,#channelMetrics td{font-size:15px;font-weight:600;line-height:1.5;padding:13px 10px}
#channelMetrics tbody th{font-weight:700;color:#30525c}
#channelMetrics thead th{font-size:14px;font-weight:700}
.summary-phase .metrics-toggle{background:#fff;color:#302336;border:1px solid #dce4ea;border-radius:8px;padding:16px;font-size:17px;font-weight:700;min-height:52px}
.summary-phase .metrics-toggle:hover{background:#fff;color:#302336;border-color:#5484a4;box-shadow:0 0 0 1px #5484a433,0 0 14px #09a1a118}
.metrics-toggle svg{width:18px;height:18px;flex-shrink:0}
@media(max-width:650px){#channelMetrics td{font-size:16px}#channelMetrics td:before{font-size:12px;color:#30525c;font-weight:600}}
.summary-phase .metrics article{position:relative}
.summary-phase .metrics article>.metric-change{position:absolute;top:24px;right:16px;max-width:calc(100% - 86px);border-radius:6px;padding:4px 7px;font-size:12px;font-weight:700;line-height:1.4;overflow-wrap:anywhere;pointer-events:none}
.summary-phase .metrics article>.metric-change.up{color:#17643c;background:#e3f3e9}
.summary-phase .metrics article>.metric-change.down{color:#a72e3c;background:#fce8ec}
.summary-phase .metrics article>.metric-change.steady{color:#885600;background:#fff1ce}
.summary-phase .metrics article>.metric-change.neutral{color:#59616d;background:#eef1f5}
.summary-phase .metrics article:has(#change-ad:not([hidden]))>#change-other{top:53px}
@media(max-width:600px){.summary-phase .metrics article>.metric-change{top:16px;right:10px;font-size:10px;max-width:calc(100% - 66px);padding:3px 5px}.summary-phase .metrics article:has(#change-ad:not([hidden]))>#change-other{top:40px}}
.summary-phase .metrics{gap:16px}
.summary-phase .metrics article{padding:18px;min-height:0;gap:9px}
.summary-phase .metrics .revenue-split{gap:10px}
.metric-topline{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:36px;margin-bottom:5px}
.summary-phase .metrics .revenue-split>.metric-topline{flex-direction:row;align-items:center;justify-content:space-between;gap:8px}
.summary-phase .metrics .metric-topline>.metric-changes{flex-direction:row;flex-wrap:nowrap}
.metric-topline .metric-icon{width:34px;height:34px;margin:0}
.metric-changes{display:flex;align-items:center;justify-content:flex-end;gap:5px;flex-wrap:wrap;min-width:0}
.summary-phase .metrics .metric-changes .metric-change{position:static;max-width:none;font-size:12px;font-weight:700;line-height:1.4;padding:4px 6px;border-radius:5px;white-space:nowrap}
.metric-changes .up{color:#17643c;background:#e3f3e9}.metric-changes .down{color:#a72e3c;background:#fce8ec}.metric-changes .steady{color:#885600;background:#fff1ce}.metric-changes .neutral{color:#59616d;background:#eef1f5}
.summary-phase .metrics .revenue-split>div:not(.metric-topline){gap:4px}
.summary-phase .metrics strong{font-size:36px}
.summary-phase .revenue-split:has(#sponsorMetric:not([hidden])):has(#adMetric:not([hidden])) strong{font-size:30px}
@media(max-width:1250px){.summary-phase .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.summary-phase .metrics{grid-template-columns:minmax(0,1fr)}.summary-phase .metrics article{padding:16px}.summary-phase .metrics strong{font-size:34px}.summary-phase .revenue-split:has(#sponsorMetric:not([hidden])):has(#adMetric:not([hidden])) strong{font-size:30px}}
/* Keep the summary on one row at laptop widths; compact spacing before reducing type. */
@media(min-width:900px){
 .summary-phase .metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
 .summary-phase .metrics article{padding:14px;gap:7px}
 .metric-topline{gap:5px;margin-bottom:3px}
 .metric-topline .metric-icon{width:30px;height:30px}
 .summary-phase .metrics .metric-changes .metric-change{padding:3px 4px;font-size:11px}
 .summary-phase .metrics .revenue-split{gap:9px}
 .summary-phase .metrics article>span:not(.metric-icon),.summary-phase .revenue-split div>span{font-size:13px}
}
.summary-phase .metrics-toggle{padding:8px 10px;min-height:36px;font-size:15px;margin-bottom:6px}
.summary-phase #dashboard>#channelMetrics{margin-top:16px;padding-top:12px}
#channelMetrics table{border-spacing:2px;table-layout:fixed}
#channelMetrics th,#channelMetrics td{padding:7px 8px;font-size:14px;line-height:1.3}
#channelMetrics thead th{font-size:12px;padding:8px}
#channelMetrics th:first-child{width:34%}
#channelMetrics thead th:nth-child(2),#channelMetrics thead th:nth-child(3){width:14%}
#channelMetrics thead th:nth-child(4),#channelMetrics thead th:nth-child(5),#channelMetrics thead th:nth-child(6){width:12.666%}
#channelMetrics td{padding-left:5px;padding-right:5px}
.summary-phase #shell>header{padding-left:max(24px,calc((100% - 1280px)/2 + 24px));padding-right:max(24px,calc((100% - 1280px)/2 + 24px))}
@media(max-width:600px){.summary-phase #shell>header{padding-left:16px;padding-right:16px}}
@media(max-width:650px){#channelMetrics th:first-child{width:auto}#channelMetrics td{font-size:15px}}
/* Shared work views and dialogs use the same light controls as the dashboard. */
/* Keep operational views readable over the fixed dashboard gradient. */
.summary-phase .workspace:has(>.view:not(#dashboard):not([hidden])){background:#fff;min-height:calc(100vh - 120px)}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView){color:#243e57}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) :is(h1,h2,h3,label,summary){color:#243e57}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) :is(.muted,.eyebrow,.empty){color:#52677c}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) :is(input,select,textarea){background-color:#fff;color:#243e57;border-color:#a5bbcf;accent-color:#155bb3}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) :is(input,select,textarea)::placeholder{color:#63758a;opacity:1}
.summary-phase :is(.workspace,.account-panel) :is(button,input,select,textarea,summary):focus-visible{outline:2px solid #155bb3;outline-offset:2px}
.summary-phase #notice{background:#fff4db;color:#694700;border-color:#d8ad51}
#tabular,#uploads,#admin{color:#30525c}
#tabular h2,#uploads h1,#uploads h2,#admin h1,#admin h2,dialog h2{color:#30525c}
#uploads .eyebrow,#admin .eyebrow{color:#647b88}
#tabular .section-title,#uploads .section-title,#admin .section-title{margin-bottom:16px}
#tabular .table-wrap,#uploads .table-wrap,#admin .table-wrap{border:1px solid #dce4ea;border-radius:6px;background:#fff;overflow:auto}
#tabular table,#uploads table,#admin table{width:100%;border-collapse:collapse}
#tabular th,#uploads th,#admin th{background:#eaf0f5;color:#30525c;font-size:13px;font-weight:700}
#tabular td,#uploads td,#admin td{background:#fff;color:#344f5b;border-bottom:1px solid #e5edf1;padding:10px 12px;font-size:14px}
#tabular tbody tr:hover td,#uploads tbody tr:hover td,#admin tbody tr:hover td{background:#f1f7f9}
#tabular button,#uploads button,#admin button,dialog button{background:#f3f7fa;color:#30525c;border-color:#b6cbd9}
#tabular button:hover,#uploads button:hover,#admin button:hover,dialog button:hover{background:#e5f0f3;color:#234653;border-color:#5484a4}
#uploads button.primary,#admin button.primary,dialog button.primary{background:#46738f;color:#fff;border-color:#46738f}
#uploads button.primary:hover,#admin button.primary:hover,dialog button.primary:hover{background:#30525c;color:white}
#uploads input,#admin input,dialog input,dialog select,#tabular select{background:#fff;color:#30525c;border-color:#b6cbd9;accent-color:#5484a4}
input::file-selector-button{background:#eaf0f5;color:#30525c;border:1px solid #b6cbd9;border-radius:4px;padding:7px 10px;margin-right:12px;cursor:pointer}
#uploadForm{border-bottom:1px solid #dce4ea;padding:0 0 20px;margin-bottom:24px}
#preview{padding:16px 0;border-bottom:1px solid #dce4ea;margin-bottom:24px}
#preview .actions{margin-top:16px}
#uploads .badge,#admin .badge{color:#416d88}
#channelDirectory{gap:0 20px}
#channelDirectory>div{border-bottom:1px solid #dce4ea;padding:12px 0;display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
#channelDirectory button{flex-shrink:0}
dialog{background:#fff;color:#30525c;border:1px solid #b6cbd9;box-shadow:0 16px 56px #30525c26}
dialog::backdrop{background:#203c4a66}
dialog fieldset{border-color:#cbdbe5}
dialog label,dialog legend{color:#30525c}
.form-error,#loginError{color:#a72e3c}
.assignment-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
#assignments .check{padding:7px;border-radius:4px}
#assignments .check:hover{background:#edf5f7}
.pagination{border-top:1px solid #dce4ea;margin-top:16px;color:#536d7b}
@media(max-width:650px){#channelDirectory{grid-template-columns:minmax(0,1fr)}#uploadForm,.actions{flex-wrap:wrap}#tabular .pagination{gap:8px}.section-title{gap:12px}}
.diy-controls,.diy-presets{display:flex;align-items:end;flex-wrap:wrap;gap:12px;padding:14px 0;border-bottom:1px solid #dce4ea}
.diy-controls label,.diy-presets label{flex:1;min-width:160px}
.diy-frame{height:420px;position:relative;margin-top:20px;min-width:0}
#diyGraphs{color:#30525c}#diyGraphs button{background:#edf5f7;color:#30525c;border-color:#acc0d3}
@media(max-width:600px){.diy-frame{height:340px}.diy-controls label,.diy-presets label{min-width:130px}}

#login{box-sizing:border-box;width:calc(100% - 40px);max-width:400px;margin:clamp(48px,14vh,140px) auto;padding:0;color:#30525c}
#login h1{margin:0 0 36px;font-size:36px;line-height:1.2;font-weight:800;letter-spacing:0;color:#30525c}
#loginForm{display:grid;gap:20px}
#loginForm label{display:grid;gap:8px;font-size:14px;font-weight:700;color:#30525c}
#loginForm input{box-sizing:border-box;width:100%;min-width:0;height:48px;padding:12px 14px;border:1px solid #acc0d3;border-radius:6px;background:#fff;color:#243e47;font:inherit;font-size:16px}
#loginForm input:focus{outline:2px solid #5484a4;outline-offset:2px}
#loginForm button.primary{height:48px;border-radius:6px;background:#30525c;border:1px solid #30525c;color:#fff;font-size:16px;font-weight:700;transform:none;box-shadow:none}
#loginForm button.primary:hover{background:#46738f;border-color:#46738f;transform:none}
#loginForm .forgot-password{justify-self:center;width:auto;min-height:40px;padding:8px 12px;border:0;border-radius:4px;background:transparent;color:#46738f;font-size:14px;font-weight:600;box-shadow:none;transform:none}
#loginForm .forgot-password:hover{background:#edf5f7;color:#30525c;text-decoration:underline;transform:none}
#loginForm button:focus-visible{outline:2px solid #5484a4;outline-offset:3px}
#loginError{margin:0;padding:12px 14px;border:1px solid #edbdc4;border-radius:6px;background:#fff2f4;color:#a72e3c;font-size:14px;line-height:1.5;overflow-wrap:anywhere}
#loginError:empty{display:none}
/* Authentication styling is isolated from the signed-in dashboard. */
body:has(#login:not([hidden])){min-height:100dvh;background:linear-gradient(135deg,#07182d,#142e56 48%,#241a48);background-attachment:fixed;isolation:isolate}
body:has(#login:not([hidden]))::before,body:has(#login:not([hidden]))::after{content:"";position:fixed;inset:-30%;pointer-events:none;z-index:0;will-change:transform;filter:blur(36px)}
body:has(#login:not([hidden]))::before{background:linear-gradient(116deg,transparent 19%,#1bc5ad12 26%,#49e0bb8c 31%,#26c4d85c 35%,transparent 42%,transparent 51%,#4879ec8a 58%,#8767d77a 63%,transparent 71%);animation:login-aurora-flow 18s ease-in-out infinite alternate;opacity:.8}
body:has(#login:not([hidden]))::after{background:linear-gradient(74deg,transparent 30%,#177dbe33 38%,#73efd55c 42%,transparent 48%,transparent 60%,#9775e36b 67%,#3865c54d 72%,transparent 79%);animation:login-aurora-drift 24s ease-in-out infinite alternate;opacity:.65}
@keyframes login-aurora-flow{from{transform:translate3d(-5%,-4%,0) skewX(-12deg) rotate(-8deg)}to{transform:translate3d(6%,5%,0) skewX(13deg) rotate(8deg)}}
@keyframes login-aurora-drift{from{transform:translate3d(6%,-3%,0) skewY(9deg) rotate(6deg)}to{transform:translate3d(-6%,4%,0) skewY(-8deg) rotate(-5deg)}}
@media(prefers-reduced-motion:reduce){body:has(#login:not([hidden]))::before,body:has(#login:not([hidden]))::after{animation:none;will-change:auto}}
#login{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;max-width:none;min-height:100dvh;margin:0;padding:32px 20px;color:#172d50;font-family:Arial,Helvetica,sans-serif}
#login .login-brand{display:flex;align-items:center;gap:14px;margin:0 0 28px;color:#fff}
#login .login-brand strong{display:block;font-size:28px;font-weight:800;line-height:1.2}
#login .login-brand div>span{display:block;margin-top:4px;font-size:13px;color:#e2eaff}
#login .login-mark,#login .login-emblem{display:grid;place-items:center;flex-shrink:0;background:linear-gradient(145deg,#3d99ff,#2546c4);border:1px solid #ffffff55;box-shadow:inset 0 1px 1px #ffffff65,0 8px 20px #05193530;color:#fff}
#login .login-mark{width:50px;height:50px;border-radius:12px}
#login .login-mark svg{width:29px;height:29px}
#login .login-panel{width:100%;max-width:440px;padding:32px 36px 22px;border:1px solid #fff;border-radius:20px;background:linear-gradient(150deg,#fff 45%,#f0f5ff);box-shadow:0 24px 70px #061d5140,inset 0 1px 0 #fff}
#login .login-emblem{width:58px;height:58px;border-radius:16px;margin:0 auto 20px}
#login .login-emblem svg{width:32px;height:32px}
#login .login-logo{display:block;width:220px;max-width:85%;height:auto;object-fit:contain;margin:0 auto 32px}
#login .login-panel{position:relative;isolation:isolate;border:2px solid #f77918b8;background:linear-gradient(140deg,#fffaf2eb 0%,#ffffffe0 28%,#f5f8ffd1 70%,#e4edffbf 100%);-webkit-backdrop-filter:blur(24px) saturate(135%);backdrop-filter:blur(24px) saturate(135%);box-shadow:0 16px 40px -12px #04152f55,inset 0 1px 0 #fffffff0,inset 1px 0 0 #ffffff80;transition:box-shadow .25s,border-color .25s}
#login .login-panel::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;background:linear-gradient(125deg,#ffffff70,transparent 35%,transparent 65%,#ffffff18);box-shadow:inset 0 -1px 0 #ffffff70}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){#login .login-panel{background:linear-gradient(140deg,#fffaf5,#f0f5ff)}}
#login .login-panel.login-failed{border-color:#df849a;box-shadow:0 3px 0 #dcaabb,0 20px 55px #10295655,0 0 0 3px #ffe2e950}
#login .login-panel.login-success{border-color:#57b79c;box-shadow:0 3px 0 #8fcbbb,0 20px 55px #10295655,0 0 0 3px #c5f5e550}
#loginForm[aria-busy="true"] button.primary{opacity:1;cursor:progress}
#login .login-success button.primary{background:linear-gradient(110deg,#18725d,#206878);border-color:#247e69}
@media(prefers-reduced-motion:reduce){#login .login-panel{transition:none}}
#login h1{text-align:center;font-size:26px;line-height:1.2;font-weight:700;color:#172d50;margin:0 0 32px}
#login .login-subtitle{text-align:center;margin:0 0 28px;color:#536781;font-size:15px;line-height:1.5}
#loginForm{gap:19px}
#loginForm label{color:#203858;font-family:"Segoe UI",Arial,sans-serif;font-size:16px;font-weight:600;line-height:1.4;letter-spacing:0;gap:9px}
#loginForm label[for="loginUsername"],#loginForm label[for="loginPassword"]{color:#b84c0a}
#loginForm input{height:50px;border-radius:10px;border-color:#b4c5de;background:#fffffff2;color:#142d50;box-shadow:inset 0 2px 3px #162e5105}
#loginForm input:focus{outline:3px solid #f7791829;outline-offset:1px;border-color:#d96715}
#loginForm .login-password-field{display:block;position:relative}
#loginForm .login-password-field input{padding-right:52px}
#loginForm #toggleLoginPassword{position:absolute;right:4px;top:4px;display:grid;place-items:center;width:42px;height:42px;min-height:42px;padding:0;border:0;border-radius:8px;background:transparent;color:#536781;box-shadow:none;transform:none}
#loginForm #toggleLoginPassword:hover{background:#fff1e6;color:#a94b0d}
#toggleLoginPassword svg{width:20px;height:20px}
#loginForm button.primary{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:4px;height:50px;border-radius:10px;background:linear-gradient(110deg,#05244f,#073b95);border:1px solid #173f79;box-shadow:0 5px 14px #05244f30,inset 0 1px 0 #ffffff35,inset 0 -2px 0 #f77918;color:#fff}
#loginForm button.primary{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,color .2s ease}
#loginForm button.primary:not(:disabled):hover{background:linear-gradient(110deg,#0b3060,#124893);border-color:#f79b52;color:#ffe2c5;transform:translateY(-1px);box-shadow:0 7px 16px #05244f35,inset 0 1px 0 #ffffff45,inset 0 -2px 0 #ff9c4a}
#loginForm button.primary:focus-visible{outline:3px solid #b84c0a;outline-offset:3px}
#loginForm button.primary:not(:disabled):active{transform:translateY(0);box-shadow:0 2px 6px #05244f25,inset 0 1px 3px #04152f40}
#loginForm[aria-busy="true"] button.primary{transform:none;pointer-events:none}
@media(prefers-reduced-motion:reduce){#loginForm button.primary{transition:none}#loginForm button.primary:not(:disabled):hover{transform:none}}
#loginForm .forgot-password{color:#3155a4;border-radius:8px;font-size:14px;min-height:40px;padding:8px 12px}
#login .login-footer{margin:24px 0 0;text-align:center;color:#e6edff;font-size:12px;line-height:1.5}
@media(max-width:480px){#login{padding:28px 16px 20px}#login .login-brand{margin-bottom:24px;gap:10px}#login .login-brand strong{font-size:25px}#login .login-brand div>span{font-size:12px}#login .login-panel{padding:26px 22px 18px}#login h1{font-size:28px}}
.diy-controls input,.diy-controls select,.diy-presets input,.diy-presets select{width:100%;min-width:0;box-sizing:border-box}
#diyChannels{position:relative;min-width:180px}
#diyChannels summary{padding:10px 14px;border:1px solid #acc0d3;border-radius:6px;cursor:pointer;background:#edf5f7}
.diy-channel-menu{position:absolute;z-index:20;right:0;width:280px;max-width:calc(100vw - 64px);padding:12px;background:#fff;border:1px solid #acc0d3;border-radius:6px;box-shadow:0 8px 24px #30525c20}
#diyChannelOptions{max-height:260px;overflow:auto;margin-top:8px}
#diyChannelOptions label{display:flex;align-items:center;gap:8px;padding:7px 0;font-size:14px}
#diyChannelOptions label[hidden]{display:none}
#diyChannelOptions input{width:16px;height:16px;flex:none}
#diyGraphs .diy-controls{align-items:end}
#diyGraphs .diy-controls input:not([type=checkbox]),#diyGraphs .diy-controls select,#diyGraphs .diy-controls>button,#diyChannels summary{height:42px;box-sizing:border-box}
#diyChannels summary{display:flex;align-items:center;justify-content:space-between;list-style:none}
#diyChannels summary::-webkit-details-marker{display:none}
#diyChannels summary::after{content:'\2304';font-size:18px;line-height:1}
#diyChannels[open] summary::after{transform:rotate(180deg)}
#diyChannels .diy-channel-menu{box-sizing:border-box;width:300px;top:calc(100% + 6px);padding:12px}
#diyChannelOptions label{display:grid;grid-template-columns:18px minmax(0,1fr);align-items:center;min-width:0;line-height:1.4;text-align:left}
#diyChannelOptions input{margin:0;accent-color:#5484a4}
.diy-calendar.flatpickr-calendar{background:#fff;border:1px solid #acc0d3;box-shadow:0 8px 24px #30525c20;color:#30525c}
.diy-calendar .flatpickr-day{background:#fff;color:#8796a0;border-color:#fff}
.diy-calendar .flatpickr-day.diy-date-data{background:#dcefee;color:#086e70;font-weight:700}
.diy-calendar .flatpickr-day:hover{border-color:#5484a4;background:#edf5f7}
.diy-calendar .flatpickr-day.selected{background:#5484a4;color:#fff;border-color:#5484a4}
.diy-calendar .flatpickr-current-month,.diy-calendar .flatpickr-month,.diy-calendar .flatpickr-weekday{color:#30525c;background:#fff}
.diy-calendar .flatpickr-current-month input.cur-year{color:#30525c;background:#fff}
.diy-calendar.flatpickr-calendar.open{animation:none;opacity:1}
.summary-phase .diy-calendar .flatpickr-current-month .cur-month,.summary-phase .diy-calendar .flatpickr-weekdays .flatpickr-weekday{color:#30525c}
.diy-calendar .flatpickr-months .flatpickr-prev-month,.diy-calendar .flatpickr-months .flatpickr-next-month{color:#30525c;fill:#30525c}
.diy-calendar .numInputWrapper span.arrowUp:after{border-bottom-color:#30525c}
.diy-calendar .numInputWrapper span.arrowDown:after{border-top-color:#30525c}
.diy-data{margin-top:24px;max-width:100%;overflow-x:auto}
.diy-data table{width:100%;border-collapse:collapse;font-size:14px;color:#30525c;table-layout:auto}
.diy-data th,.diy-data td{padding:10px 12px;border-bottom:1px solid #dce4ea;text-align:right;font-variant-numeric:tabular-nums}
.diy-data thead th{background:#edf5f7;color:#30525c;font-size:13px;font-weight:700}
.diy-data th:first-child,.diy-data td:first-child{text-align:left;white-space:nowrap}
.diy-data td{min-width:85px}.diy-data td:nth-child(2){max-width:340px;overflow-wrap:anywhere}
@media(max-width:600px){.diy-presets label{flex-basis:100%}}
#quickInsights{margin:0;padding:8px 0 18px;border-bottom:1px solid #dce4ea;color:#30525c}
.insights-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
#quickInsights h2{margin:0;font-size:24px;line-height:1.3;font-weight:800;color:#243e47}
#insightScope{margin:8px 0 0;font-size:14px;line-height:1.5;font-weight:600;color:#536d7b;overflow-wrap:anywhere}
#insightNote{margin:10px 0;font-size:13px;color:#536d7b}
#insightNote:empty{display:none}
#insightList{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:22px}
#quickInsights .insight-item{min-width:0;border:1px solid #d6e2e9;border-top:3px solid #5484a4;border-radius:8px;padding:18px;background:#f7fafc;box-shadow:none;transform:none;display:flex;flex-direction:column;gap:12px}
#quickInsights .insight-item.warning{border-color:#ecd8de;border-top-color:#b5607a;background:#fff8fa}
#quickInsights h3{font-size:16px;font-weight:800;line-height:1.4;margin:0;color:#30525c}
#quickInsights .insight-item p{font-size:16px;line-height:1.55;margin:0;overflow-wrap:anywhere;color:#243e47}
#quickInsights .insight-item .insight-evidence{font-weight:600;font-size:14px;font-variant-numeric:tabular-nums}
#quickInsights .insight-rank{font-size:12px;font-weight:700;color:#536d7b}
#quickInsights .insight-value{display:block;font-size:32px;line-height:1.15;font-weight:800;color:#30525c;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
#quickInsights .warning .insight-value{color:#984461}
#quickInsights .insight-value-label{font-size:13px;font-weight:600;color:#536d7b;margin-top:-6px}
.insight-bar{height:8px;background:#dce7ed;border-radius:4px;overflow:hidden}
.insight-bar span{display:block;height:100%;background:#5484a4}.warning .insight-bar span{background:#b5607a}
#quickInsights .insight-item .insight-action{margin-top:auto;padding-top:12px;border-top:1px solid #dce4ea;color:#536d7b;font-size:14px;font-weight:500}
#quickInsights .insight-item{--kpi-accent:#386d91;--kpi-tint:#edf4f9;background:#fff;border-color:#d8e3e9;border-top-color:var(--kpi-accent);padding:20px}
#quickInsights .kpi-down,#quickInsights .kpi-caution{--kpi-accent:#ac3048;--kpi-tint:#fff0f3}
#quickInsights .kpi-up{--kpi-accent:#14734f;--kpi-tint:#edf8f2}
#quickInsights .kpi-peak{--kpi-accent:#936009;--kpi-tint:#fff6e6}
.kpi-heading{display:flex;align-items:center;gap:10px;min-height:36px}
.kpi-icon{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:6px;background:var(--kpi-tint);color:var(--kpi-accent)}
.kpi-icon svg{width:19px;height:19px}
#quickInsights .insight-value{font-size:34px;color:#243e47}
#quickInsights [data-insight=gainer] .insight-value,#quickInsights [data-insight=decliner] .insight-value,#quickInsights .kpi-caution .insight-value{color:var(--kpi-accent)}
#quickInsights .kpi-channel{font-size:16px;font-weight:700;overflow-wrap:anywhere}
.kpi-change{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:#586e7a}
.kpi-badge{padding:5px 8px;border-radius:4px;color:var(--kpi-accent);background:var(--kpi-tint);font-size:14px}
.kpi-comparison{display:grid;gap:10px;margin-top:auto;border-top:1px solid #d8e3e9;padding-top:14px}
.kpi-pair{display:grid;grid-template-columns:55px minmax(0,1fr) auto;gap:8px;align-items:center;font-size:12px;color:#586e7a}
.kpi-pair strong{font-size:13px;color:#243e47;font-variant-numeric:tabular-nums}
.kpi-track{height:8px;background:#eef2f5;border-radius:3px;overflow:hidden}.kpi-track span{display:block;height:100%;background:var(--kpi-accent)}.baseline .kpi-track span{background:#a9bcc9}
.kpi-daily{height:64px;display:flex;align-items:end;gap:3px;margin-top:auto}.kpi-daily span{flex:1;min-width:0;background:#d5e1e9;border-radius:2px 2px 0 0}.kpi-daily .peak{background:#cf902a}
.kpi-dates{display:flex;justify-content:space-between;font-size:12px;color:#586e7a;gap:8px}
#quickInsights .insight-item .insight-evidence{font-size:13px;font-weight:500;line-height:1.5}
#quickInsights .insight-item .insight-action{font-size:13px;margin-top:0}
@media(max-width:1100px){#insightList{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){#insightList{grid-template-columns:minmax(0,1fr)}.insights-heading{align-items:flex-start;flex-direction:column}}
.diy-share{display:grid;grid-template-columns:300px minmax(0,1fr);align-items:start;gap:28px;margin-top:20px}
.diy-share[hidden]{display:none}
.diy-frame.diy-share-frame{width:300px;height:300px;margin:0;max-width:100%}
.diy-share-centre{position:absolute;inset:30%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none;gap:6px}
.diy-share-centre[hidden]{display:none}
.diy-share-centre strong{font-size:20px;line-height:1.2;overflow-wrap:anywhere;color:#30525c}
.diy-share-centre span{font-size:12px;color:#536d7b}
.diy-share-breakdown>button{display:block;margin:0 0 16px auto}
.diy-share-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px}
.diy-share-row{min-width:0;border-left:3px solid var(--share-color);padding-left:10px;display:grid;gap:5px}
.diy-share-row strong{font-size:14px;overflow-wrap:anywhere}
.diy-share-row>span{font-size:14px;font-variant-numeric:tabular-nums}
.diy-share-track{height:5px;background:#edf2f5}.diy-share-track span{display:block;height:100%;background:var(--share-color)}
/* Soft dashboard surfaces; data colours and comparison states retain their meaning. */
body.summary-phase{background:#fff;color:#17243a}
body.summary-phase:has(#shell:not([hidden])){background:linear-gradient(180deg,transparent 0,transparent 72px,#edf5ff70 210px,#f3f7ffdc 420px,#f5f8fff2 760px),linear-gradient(100deg,#041a3b 0%,#104b96 42%,#303b91 72%,#4b2788 100%);background-attachment:fixed;background-repeat:no-repeat;background-color:#f3f6fd}
.summary-phase #shell>header{background:linear-gradient(110deg,#06152f 0%,#103773 38%,#155bb3 72%,#083557 100%);border-bottom:1px solid #81c7ff80;box-shadow:inset 0 1px 0 #ffffff12,0 5px 18px #06152f40}
.summary-phase #signedInName{color:#fff;font-weight:800}
.summary-phase #signedInName{display:flex;flex-direction:column;min-width:0;max-width:360px;white-space:normal;overflow-wrap:anywhere;text-transform:none;line-height:1.2}
.summary-phase #signedInName strong{font-size:22px}
.summary-phase #signedInName small{font-size:13px;font-weight:500;color:#e1ebff;margin-top:3px}
.summary-phase #signedInName small[hidden]{display:none}
.user-company{display:block;font-size:13px;margin-top:4px}
.calendar-actions{display:flex;gap:8px;justify-content:space-between;padding:12px 0 0}
.calendar-actions button{min-height:36px;font-size:13px;padding:6px 10px}
.calendar-status{font-size:13px;color:#243d60;white-space:normal;margin:8px 0}
#revenueFinalization{color:#15345a;background:#eef6fff2;border:1px solid #b9d2ed;border-radius:8px;padding:10px 14px;font-size:13px;line-height:1.5;margin:12px 0}
.timeline-content #revenueFinalization{display:block;margin:10px 0 0;background:transparent;border:0;border-top:1px solid #c9d9ec;border-radius:0;padding:10px 0 0;color:#344f70}
.summary-phase .metrics .metric-changes .metric-change{white-space:normal;text-align:right}
.summary-phase .metrics .metric-comparison-period{display:block;max-width:130px;white-space:normal;font-size:11px;font-weight:500;line-height:1.35;margin-top:2px}
.summary-phase #rangePicker .calendar-actions button{background:#edf4ff;color:#174879;border:1px solid #b8cdeb;font-weight:700}
.summary-phase #rangePicker .calendar-actions button.primary{background:#155bb3;color:#fff;border-color:#155bb3}
.summary-phase #rangePicker .calendar-actions button:not(:disabled):hover{background:#dceaff;color:#103d75}
.summary-phase #rangePicker .calendar-actions button:disabled{opacity:.5;cursor:not-allowed}
.summary-phase #channelMetrics h2{display:inline-block;margin:0 0 10px;padding:4px 8px;border-radius:6px;background:#edf5fff2;color:#12345b;font-size:18px;font-weight:800;line-height:24px}
#channelMetrics .metrics-others{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:8px;min-height:40px;border:1px solid #afc8e7;border-radius:8px;color:#12345b;background:#edf5ff;font-weight:700}
#channelMetrics .metrics-others[hidden]{display:none}
#channelMetrics .metrics-others svg{width:18px;height:18px}
.user-status-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.user-status-tabs button{min-height:38px;padding:8px 16px;border-radius:8px;border:1px solid #b6cce6;background:#f6faff;color:#234064}
.user-status-tabs button[aria-pressed="true"]{background:#124a8d;color:#fff;border-color:#124a8d}
#identity{overflow-wrap:anywhere}
@media(max-width:600px){.summary-phase #signedInName{max-width:190px}.summary-phase #signedInName strong{font-size:18px}}
.summary-phase #accountMenu>summary:hover{background:#ffffff12}
.summary-phase .brand-icon{background:linear-gradient(145deg,#187bd1,#124a92);box-shadow:inset 0 1px 0 #a6ddff70,0 2px 8px #020e2540;color:#fff;border-radius:8px}
.summary-phase #accountMenu>summary:focus-visible{outline-color:#c4e9ff}
.summary-phase #rangePicker>summary,.summary-phase .revenue-header #channelPicker>summary,.summary-phase #revenueHeader #export{background:#fff;border-color:#d5e2f0;color:#324a6b;box-shadow:0 3px 10px #416d8808}
.summary-phase .metrics article{background:linear-gradient(145deg,#fff,#fcfdff);border-color:#1a375a14;border-radius:8px;box-shadow:0 1px 2px #172b4d05,0 7px 24px #172b4d0b;overflow:hidden;gap:4px;padding:12px 14px 40px;min-height:158px;transition:none}
.summary-phase .metrics article:has(.metric-spark[hidden]){min-height:116px;padding-bottom:12px}
.summary-phase .metrics .metric-topline .metric-heading{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif;font-size:17px;line-height:18px;font-weight:800;color:#102956;min-width:0;overflow-wrap:anywhere;text-transform:uppercase}
.summary-phase .metrics .revenue-split .metric-topline .metric-heading{color:#4c3085}
.summary-phase .metrics article:nth-child(3) .metric-topline .metric-heading{color:#1e3a8a}
.summary-phase .metrics article:nth-child(4) .metric-topline .metric-heading{color:#85400b}
.summary-phase .metrics .metric-value-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:8px;width:100%;min-width:0}
.summary-phase .metrics .metric-value-row>strong{min-width:0;flex:1;text-align:left}
.summary-phase .metrics .metric-value-row>.metric-changes{flex:none;justify-content:flex-end;margin:0}
.summary-phase .metrics .metric-value-row .metric-change{white-space:nowrap}
.summary-phase .metrics .metric-topline{min-height:32px;margin:0 0 6px;justify-content:flex-start;gap:10px}
.summary-phase .metrics .metric-topline .metric-icon{width:32px;height:32px;flex:none;border-radius:8px;color:var(--accent)}
.summary-phase .metrics .metric-icon svg{width:20px;height:20px;stroke-width:1.8}
.summary-phase .metrics strong{font-size:34px;line-height:1.1;letter-spacing:0;color:#0a2343}
.summary-phase .metrics .revenue-split:has(#sponsorMetric:not([hidden])):has(#adMetric:not([hidden])) strong{font-size:28px}
.summary-phase .metrics .revenue-split #sponsorMetric strong{font-size:24px}
.summary-phase .metrics .revenue-split #sponsorMetric{margin-top:5px}
.summary-phase .metrics article> :not(.metric-spark){position:relative;z-index:1}
.summary-phase .metrics article>span:not(.metric-icon),.summary-phase .metrics .revenue-split div>span{font-size:12px;line-height:1.35;font-weight:600}
.summary-phase .metrics #adMetric>span,.summary-phase .metrics #sponsorMetric>span{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif;font-size:15px;line-height:18px;font-weight:700;color:#4c3085;text-transform:uppercase;max-width:100%;width:fit-content;overflow-wrap:anywhere}
@supports (background-clip:text){
  .summary-phase .metrics #adMetric>span{background:linear-gradient(100deg,#493082,#7650b2);background-clip:text;-webkit-background-clip:text;color:transparent}
  .summary-phase .metrics #sponsorMetric>span{background:linear-gradient(100deg,#683291,#4f46a0);background-clip:text;-webkit-background-clip:text;color:transparent}
}
@media(forced-colors:active){
  .summary-phase .metrics #adMetric>span,.summary-phase .metrics #sponsorMetric>span{background:none;color:CanvasText}
}
.summary-phase .metrics .revenue-split{gap:4px}
.summary-phase .metrics .revenue-split>div:not(.metric-topline){gap:2px;width:100%}
.summary-phase .metrics .metric-topline>.metric-changes{justify-content:flex-start;gap:8px;margin:0;flex-wrap:nowrap;align-items:center}
.summary-phase .metrics .metric-changes:not(:has(.metric-change:not([hidden]))){display:none}
.summary-phase .metrics .metric-changes .metric-change{background:transparent;padding:0;font-size:15px;font-weight:800;border-radius:0}
.summary-phase .metrics .metric-change.up::before{content:"\2191 ";font-weight:800}
.summary-phase .metrics .metric-change.down::before{content:"\2193 ";font-weight:800}
.summary-phase .metrics .metric-changes{align-items:center;flex-wrap:nowrap}
.summary-phase .metrics .revenue-split>.metric-topline{justify-content:flex-start;gap:8px}
.summary-phase .metrics .revenue-split .metric-topline>.metric-changes{flex-wrap:wrap;column-gap:8px;row-gap:2px}
.summary-phase .metrics .metric-changes .metric-change.up{color:#16845d}
.summary-phase .metrics .metric-changes .metric-change.down{color:#ba395c}
.summary-phase .metrics strong,.summary-phase .metrics #total{color:#0a2343}
.summary-phase .metrics article:nth-child(2) strong{color:#6342a6}
.summary-phase .metrics article:nth-child(3) strong{color:#0a2343}
.summary-phase .metrics #views{color:#1d4ed8}
.summary-phase .metric-icon{border-radius:50%;width:40px;height:40px}
.summary-phase .metrics article:nth-child(1){--tile:#e0f5f0;--accent:#079c88}
.summary-phase .metrics article:nth-child(2){--tile:#eee8fa;--accent:#7050b0}
.summary-phase .metrics article:nth-child(3){--tile:#e5efff;--accent:#3b82f6}
.summary-phase .metrics article:nth-child(4){--tile:#ffead5;--accent:#bd570b}
.summary-phase .metrics #impressions{color:#b45309}
.metric-spark{height:36px;width:100%;min-width:0;margin:0;position:absolute;right:0;bottom:0;pointer-events:none;opacity:.95}
.metric-spark[hidden]{display:none}
.metric-spark canvas{display:block;width:100%!important;height:36px!important}
#revenueShare{background:#fff;border-color:#e0e9f3;box-shadow:0 5px 16px #416d8808;border-radius:8px}
.daily-revenue{background:#fff;border:1px solid #e0e9f3;border-radius:8px;padding:16px;min-width:0}
.share-title,.daily-revenue h2,#viewsDistribution h2{color:#17243a;font-weight:800}
.compact-share-row{position:relative;grid-template-columns:minmax(0,1fr) max-content;align-items:baseline;border-left:0;border-bottom:1px solid #e5edf7;padding:9px 0 9px 20px;border-radius:0;gap:8px}
.compact-share-row:last-child{border-bottom:0}
.compact-share-row::before{content:"";position:absolute;left:0;top:14px;width:12px;height:12px;border-radius:50%;background:var(--share-color)}
.compact-share-row .share-channel{font-size:14px;font-weight:700;color:#263e62;line-height:1.35}
.compact-share-row strong{font-size:13px;font-weight:700;color:#344f70;line-height:1.35;white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums}
.compact-share-row strong{display:flex;align-items:baseline;gap:8px;color:#102956}
.share-percent{display:inline-block;min-width:42px;padding:4px 6px;border-radius:6px;text-align:center;background:#eaf2ff;color:#1458bd;font-weight:800}
.summary-phase #dashboard>#channelMetrics,.summary-phase #dashboard>#viewsDistribution{background:transparent;padding:0;border:0;margin-top:16px}
.summary-phase #channelMetrics .metrics-table-scroll{background:#fff}
.summary-phase #channelMetrics .metrics-toggle{margin-bottom:8px}
.summary-phase #viewsTreeButton,.summary-phase #viewsTreeButton:hover,.summary-phase #revenueShare,.summary-phase #revenueShare:hover{background:#fff;color:#17243a}
.summary-phase #viewsTreeButton:hover,.summary-phase #revenueShare:hover,.summary-phase .metrics-toggle:hover{border-color:#a9bfd8;box-shadow:0 0 0 1px #a9bfd830}
.share-title>span,.distribution-collapse{display:inline-flex;align-items:center;justify-content:center;min-width:30px;min-height:30px;border:1px solid #dbe5f0;border-radius:6px;background:#f6f9fc;color:#344f70}
.share-title>span svg,.distribution-collapse svg{width:16px;height:16px}
.summary-phase .distribution-collapse:hover{background:#eaf1f9;color:#263e62}
#revenueOverview #revenueShare{padding:12px;align-self:stretch;min-height:0;display:flex;flex-direction:column}
#revenueOverview #revenueShare[hidden],.distribution-collapse[hidden]{display:none}
#revenueShare .share-content{flex:1;width:100%;align-content:stretch}
#revenueShare #summaryShareLegend{align-self:stretch;align-content:space-evenly}
#revenueShare.few-channels .share-content{grid-template-columns:minmax(0,1fr);align-content:space-evenly;gap:14px}
#revenueShare.few-channels #summaryShareLegend{width:100%;gap:12px;align-self:center}
.summary-phase #dashboard>#viewsDistribution:has(#viewsTreeButton[hidden]){background:#fff;border:1px solid #e0e9f3;border-radius:8px;padding:14px}
#viewsDistribution>h2:not([hidden]){position:static;margin:0 48px 20px 0;min-height:36px;display:flex;align-items:center;max-width:none}
#viewsDistribution>.distribution-collapse:not([hidden]){position:absolute;top:14px;right:14px;margin:0}
#viewsDistributionRows:not([hidden]){display:grid}
#viewsDistributionRows[hidden]{display:none}
#revenueShare .share-title{margin-bottom:10px;align-items:center;font-size:18px}
.summary-phase .metrics-toggle{border-color:transparent;background:#fff;color:#17243a;font-size:18px;font-weight:800;line-height:22px;padding:10px;min-height:42px}
#channelMetrics thead th{background:#f0f5fa;color:#405b78}
#channelMetrics tbody th{color:#203b5c}
.channel-glyph{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;width:26px;height:26px;border-radius:5px;background:#e8f1fc;color:#4b78b1;margin-right:8px}
.channel-glyph svg{width:16px;height:16px}
.channel-glyph.channel-brand,#viewsTree .tile-channel-icon.channel-brand{display:inline-flex;align-items:center;justify-content:center;width:48px;height:36px;flex:none;border:1px solid #dce6f0;border-radius:6px;background:#fff;color:#344f70;font-size:12px;font-weight:800;overflow:hidden}
.channel-brand img{display:block;max-width:100%;max-height:100%;width:44px;height:32px;object-fit:contain}
#viewsTreeButton{background:#fff;border-color:#e0e9f3}
#viewsTree .views-tree-tile{color:#142b43;border-radius:8px;background-image:linear-gradient(125deg,#ffffff70 0%,#ffffff24 48%,#ffffff00 100%),linear-gradient(155deg,transparent 58%,#ffffff20 58%,#ffffff08 80%,transparent 80%)!important;box-shadow:inset 0 1px 0 #ffffff90,inset 0 0 0 1px #ffffff55}
.tile-channel-icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;flex:none;border-radius:50%;background:#ffffff55}
.tile-channel-icon svg{width:20px;height:20px}
.tile-share{display:block;font-size:14px;font-weight:800;margin-top:7px;color:#29465d}
.summary-phase{font-family:"Segoe UI",Arial,sans-serif}
.summary-phase button,.summary-phase input,.summary-phase select{font-family:inherit}
.summary-phase .metrics article>span:not(.metric-icon),.summary-phase .revenue-split div>span{color:#526889}
.summary-phase .metrics strong{font-weight:800;font-variant-numeric:tabular-nums}
.summary-phase .metrics .metric-top{min-height:40px}
.share-content{grid-template-columns:170px minmax(0,1fr);gap:16px;align-items:center}
.share-ring{width:170px;height:170px;justify-self:center;filter:drop-shadow(0 7px 6px #173c7028)}
.share-centre{padding:24px}
#revenueShare .share-centre{gap:3px;overflow:hidden}
#revenueShare .share-centre>strong,#revenueShare .share-centre>span{display:block;max-width:100%;width:100%;white-space:nowrap;line-height:1.15;flex-shrink:0}
#summaryShareLegend{gap:0}
.summary-phase #dashboard>#revenueOverview{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:16px;margin-top:16px}
#revenueShare,.daily-revenue{min-height:300px;box-shadow:0 1px 2px #0f233c05,0 8px 30px #1e3c5a0d}
.daily-revenue-canvas{height:230px}
.share-title,.daily-revenue h2,#viewsDistribution h2{font-size:18px;line-height:22px;font-weight:800}
.daily-revenue h2{margin-bottom:14px}
@media(max-width:800px){.summary-phase #dashboard>#revenueOverview{grid-template-columns:minmax(0,1fr)}}
@media(min-width:801px) and (max-width:1200px){.share-content{grid-template-columns:minmax(0,1fr)}.share-ring{width:170px;height:170px}}
#viewsTree{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;height:auto;overflow:visible}
#viewsTree .views-tree-tile{position:relative;inset:auto!important;width:auto!important;height:auto!important;min-height:146px;padding:12px 14px;gap:8px;border:0;overflow:visible}
#viewsTree .views-tree-tile:nth-child(-n+5){min-height:0}
#viewsTree .views-tree-tile .tile-channel-icon{display:inline-flex;width:30px;height:30px;background:#ffffff55;border:1px solid #ffffff60;box-shadow:0 2px 5px #233c5410;color:#284860}
#viewsTree .views-tree-tile>strong{font-size:18px;line-height:1.3}
#viewsTree .views-tree-tile>span{overflow-wrap:anywhere}
#viewsTree .views-tree-tile>strong{margin-top:auto}
@media(max-width:1100px){#viewsTree{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:800px){#viewsTree{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){#viewsTree{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:360px){#viewsTree{grid-template-columns:minmax(0,1fr)}}
#channelMetrics td{box-shadow:inset 0 1px 0 #ffffff80,inset 0 -2px 0 #173c7012,inset 0 0 0 100px #ffffff55;font-variant-numeric:tabular-nums}
#channelMetrics tbody td:last-child{font-weight:800}
#channelMetrics tbody th{font-weight:700}
.summary-phase #rangePicker>summary:hover,.summary-phase .revenue-header #channelPicker>summary:hover,.summary-phase #revenueHeader #export:hover{background:#f3f7ff;border-color:#9fbce4;box-shadow:0 2px 10px #648ed11a}
@media(max-width:440px){.share-content{grid-template-columns:minmax(0,1fr);gap:12px}.share-ring{width:160px;height:160px}.share-centre{padding:20px}.compact-share-row{padding-left:16px;gap:6px}.compact-share-row .share-channel{font-size:13px}.compact-share-row strong{font-size:12px;gap:5px}.share-percent{min-width:36px;padding:3px 4px}}
@media(max-width:650px){.daily-revenue{padding:12px}.channel-glyph:not(.channel-brand){display:none}}
@media(max-width:700px){.diy-share{grid-template-columns:minmax(0,1fr);gap:20px}.diy-frame.diy-share-frame{justify-self:center;width:280px;height:280px}.diy-share-list{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}}

/* Raised surfaces use light and depth, not transforms that move the data. */
.summary-phase .metrics article{border-color:#c9dbee;background:linear-gradient(145deg,#fff 35%,#f0f6fd);box-shadow:inset 0 1px 0 #fff,inset 0 -3px 0 #d9e6f480,0 3px 0 #bdcee170,0 9px 18px #173c7017}
.summary-phase .metrics .metric-topline .metric-icon{box-shadow:inset 0 1px 0 #ffffffd0,inset 0 -2px 0 #173c7010,0 3px 6px #173c7014}
.summary-phase #channelMetrics .metrics-table-scroll{box-shadow:0 3px 0 #bdcee160,0 8px 16px #173c7012}
.summary-phase #channelMetrics .metrics-toggle{background:linear-gradient(180deg,#fff,#edf4fc);border-color:#d3e1ef;box-shadow:inset 0 1px 0 #fff,0 2px 0 #c7d8e780}
#channelMetrics thead th{background:linear-gradient(180deg,#f7fbff,#e4edf8);box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #c9d9eb}
.channel-glyph.channel-brand,#viewsTree .tile-channel-icon.channel-brand{box-shadow:inset 0 1px 0 #ffffff90,0 2px 0 #9db1c430,0 4px 8px #173c7014}
#viewsTree{gap:12px}
#viewsTree .views-tree-tile{box-shadow:inset 0 1px 0 #ffffffd0,inset 0 -3px 0 #173c7012,0 3px 0 #93a9bf40,0 7px 12px #173c701a}
.summary-phase #viewsTreeButton,.summary-phase #viewsTreeButton:hover{box-shadow:inset 0 1px 0 #fff,0 3px 0 #bdcee160,0 9px 18px #173c7012}
.summary-phase #dashboard>#viewsDistribution:has(#viewsTreeButton[hidden]){box-shadow:inset 0 1px 0 #fff,0 3px 0 #bdcee160,0 9px 18px #173c7012}
#viewsDistributionRows .distribution-track{box-shadow:inset 0 1px 3px #173c701c}
#viewsDistributionRows .distribution-track>span{box-shadow:inset 0 1px 0 #ffffff90,inset 0 -1px 0 #173c7020}
.summary-phase #viewsTreeButton:hover,.summary-phase #channelMetrics .metrics-toggle:hover{border-color:#86afd7}
/* Stakeholder overview: restrained colour, stronger hierarchy and quantitative bars. */
.summary-phase #shell>header{background:linear-gradient(115deg,#ffffff08,transparent 45%),linear-gradient(100deg,#041a3b 0%,#104b96 42%,#303b91 72%,#4b2788 100%);box-shadow:inset 0 1px 0 #ffffff12,0 10px 28px #04183647;border-bottom-color:#8daee33d}
.summary-phase .brand-icon{background:linear-gradient(145deg,#177cff,#235bd5);border:1px solid #ffffff2e;box-shadow:0 5px 16px #1464ff45,inset 0 1px 0 #ffffff38}
.summary-phase #rangePicker>summary,.summary-phase .revenue-header #channelPicker>summary,.summary-phase #revenueHeader #export{background:#0b234e8a;color:#fff;border-color:#9fc0ff57;box-shadow:inset 0 1px 0 #ffffff0d,0 4px 12px #0000000d;backdrop-filter:blur(8px);font-weight:600}
.summary-phase #rangePicker>summary:hover,.summary-phase .revenue-header #channelPicker>summary:hover,.summary-phase #revenueHeader #export:hover,
.summary-phase #rangePicker[open]>summary,.summary-phase .revenue-header #channelPicker[open]>summary{background:#204980bf;color:#fff;border-color:#b9d3ff99;box-shadow:inset 0 1px 0 #ffffff1a}
.summary-phase #rangePicker>summary:focus-visible,.summary-phase .revenue-header #channelPicker>summary:focus-visible,.summary-phase #revenueHeader #export:focus-visible{outline:2px solid #b8ddff;outline-offset:3px}
.summary-phase .metrics article:first-child{background:linear-gradient(125deg,#0b57c2,#3f3bbe);border-color:#3567c8;box-shadow:0 3px 0 #153f8a40,0 9px 18px #173c7026;color:#fff}
.summary-phase .metrics article:first-child :is(strong,.metric-heading),.summary-phase .metrics #total{color:#fff}
.summary-phase .metrics .metric-changes .metric-change{padding:3px 6px;border-radius:5px;background:#fff1ce}
.summary-phase .metrics .metric-changes .metric-change.up{background:#e3f3e9;color:#17643c}
.summary-phase .metrics .metric-changes .metric-change.down{background:#fce8ec;color:#a72e3c}
.summary-phase .metrics article:nth-child(2){background:linear-gradient(130deg,#fff,#f2edfb)}
.summary-phase .metrics article:nth-child(3){background:linear-gradient(130deg,#fff,#eff6ff)}
.summary-phase .metrics article:nth-child(4){background:linear-gradient(130deg,#fffdfb,#fff0df)}
.summary-phase .metrics article:first-child .metric-icon{background:#ffffff24;color:#fff}
/* Static, clipped trails stay behind the real metrics and sparklines. */
.summary-phase .metrics article{isolation:isolate;--trail-color:#527db51a}
.summary-phase .metrics article:first-child{--trail-color:#a8dcff38}
.summary-phase .metrics article:nth-child(2){--trail-color:#8769bd1a}
.summary-phase .metrics article:nth-child(4){--trail-color:#be8e471a}
.summary-phase .metrics article::before{content:"";position:absolute;right:-45px;bottom:26px;width:180px;height:110px;border-radius:50%;border-top:1px solid var(--trail-color);box-shadow:0 -9px 0 -8px var(--trail-color),0 -19px 0 -18px var(--trail-color);transform:rotate(-32deg);pointer-events:none;z-index:-1}
.summary-phase .metrics article::after{content:"";position:absolute;top:0;right:0;width:38%;height:70px;background:linear-gradient(132deg,transparent 40%,var(--trail-color) 40.5%,transparent 42%,transparent 58%,var(--trail-color) 58.5%,transparent 60%);pointer-events:none;z-index:-1}
.summary-phase .metrics article:first-child::after{background:linear-gradient(90deg,transparent,#a8dcff24,transparent);height:1px;top:16px;width:35%}
.summary-phase .metrics article:nth-child(2)::before{display:none}
.summary-phase .metrics article:nth-child(2)::after{top:auto;bottom:43px;right:12px;width:30%;height:34px;background:repeating-linear-gradient(180deg,transparent 0 10px,#8769bd1a 10px 11px);mask-image:linear-gradient(90deg,transparent,#000)}
.summary-phase .metrics article:nth-child(3)::before{display:none}
.summary-phase .metrics article:nth-child(3)::after{top:12px;right:12px;width:30%;height:48px;background:linear-gradient(#527db51a 1px,transparent 1px),linear-gradient(90deg,#527db51a 1px,transparent 1px);background-size:14px 14px;mask-image:linear-gradient(135deg,transparent,#000)}
.summary-phase .metrics article:nth-child(4)::before{display:none}
.summary-phase .metrics article:nth-child(4)::after{top:14px;right:12px;width:30px;height:54px;background:none;border-right:1px solid #be8e4733;border-top:1px solid #be8e4733;border-radius:0 8px 0 0;box-shadow:5px -5px 0 -4px #be8e4726}
.summary-phase .metrics strong{font-size:36px;line-height:1.12}
.summary-phase .metrics .revenue-split strong{font-size:28px}
#performanceInsight{display:flex;align-items:center;gap:24px;margin:18px 0;padding:18px 22px;background:linear-gradient(180deg,#ffffff12,transparent 55%),linear-gradient(100deg,#0758b9 0%,#244bb3 38%,#4936b9 72%,#6832b8 100%);border:1px solid #7299ee85;box-shadow:0 10px 24px #2d3f9d30,inset 0 1px 0 #ffffff14;color:#fff;border-radius:8px}
.summary-phase #dashboard>#performanceInsight:not([hidden]){display:flex!important}
#performanceInsight h2{margin:0;flex:0 0 auto;font-size:18px;color:#fff;display:flex;align-items:center;gap:12px;font-weight:800}
#performanceInsight h2 svg{width:28px;height:28px;color:#b7ddff;flex:none;filter:drop-shadow(0 2px 5px #10275d50)}
#performanceInsight p strong{font-weight:800}
#performanceInsight p .insight-highlight{font-weight:800;color:#fff;font-variant-numeric:tabular-nums}
.header-wave-art{position:absolute;left:24%;top:0;width:430px;height:72px;pointer-events:none;overflow:hidden;opacity:.9}
.header-wave-art::before{content:"";position:absolute;left:0;top:-38px;width:430px;height:125px;border-radius:50%;border-top:1px solid #4c87ff57;transform:rotate(-7deg);box-shadow:0 -10px 0 -9px #4683ff3d,0 -20px 0 -19px #4683ff2e,0 -30px 0 -29px #4683ff21}
.summary-phase #shell>header>#accountMenu,.summary-phase #shell>header>#revenueHeader{position:relative;z-index:1}
#performanceInsight{position:relative;padding-right:130px}
.insight-growth-art{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:104px;height:64px;pointer-events:none}
.insight-growth-bars{position:absolute;left:0;bottom:0;height:50px;display:flex;align-items:flex-end;gap:5px;opacity:.92}
.insight-growth-bars i{width:10px;border-radius:2px 2px 0 0;background:linear-gradient(180deg,#6ecdffcc,#5b5df07a);box-shadow:0 0 10px #479cff2e}
.insight-growth-arrow{position:absolute;right:0;top:0;width:75px;height:48px;filter:drop-shadow(0 4px 8px #3e2db359)}
@media(max-width:1100px){.header-wave-art{display:none}}
@media(max-width:800px){.insight-growth-art{display:none}}
#performanceInsight p{margin:0;padding-left:24px;border-left:1px solid #ffffff60;font-size:16px;line-height:1.55;color:#fff}
.summary-phase #dashboard>#revenueOverview{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
#revenueOverview .daily-revenue{order:-1;display:flex;flex-direction:column}
.daily-revenue-canvas{height:280px;min-height:280px;flex:1;position:relative}
.daily-revenue-canvas>canvas{position:absolute;inset:0;width:100%!important;height:100%!important}
.trend-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.trend-header h2{margin:0!important}
.trend-header .overview-metric-selector{margin-left:auto}
.timeline-expand,.timeline-dialog-heading button{width:36px;height:36px;min-height:36px;padding:7px;display:grid;place-items:center;flex:none}
.timeline-expand svg,.timeline-dialog-heading svg{width:20px;height:20px}
#timelineDetailDialog{width:calc(100vw - 40px);max-width:1500px;height:min(800px,90dvh);max-height:90dvh;padding:20px;box-sizing:border-box;background:#fff;color:#183452}
#timelineDetailDialog[open]{display:flex;flex-direction:column;gap:16px}
.timeline-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.timeline-dialog-heading h2{margin:0;font-size:22px;font-weight:800}
#timelineDetailDialog .daily-revenue-canvas{min-height:160px;height:auto;flex:1}
.timeline-content{display:flex;flex-direction:column;gap:10px;flex:1;min-width:0;min-height:0}
.timeline-controls{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;min-width:0}
.timeline-intervals{display:inline-flex;flex:none;gap:2px;padding:3px;border:1px solid #cbdcf0;background:#edf4fe;border-radius:8px}
.timeline-intervals button{border:0;background:transparent;box-shadow:none;color:#345270;font-size:12px;font-weight:700;height:30px;min-height:30px;padding:4px 10px;border-radius:5px}
.timeline-intervals button[aria-pressed="true"]{background:#1269d5;color:white;box-shadow:0 2px 5px #1269d530}
#timelinePeriod{width:auto;max-width:100%;min-width:0;margin-left:auto;height:36px;font-size:12px;color:#244462;border:1px solid #cbdcf0;background:#f7fbff}
#timelineBack{display:inline-flex;align-items:center;gap:6px;height:36px;min-height:36px;font-size:12px;white-space:nowrap}
#timelineBack svg{width:16px;height:16px}
#timelineScope{flex-basis:100%;color:#345270;font-size:12px;font-weight:700;overflow-wrap:anywhere}
#dailyRevenueNote{margin:0;color:#526b85;font-size:12px;line-height:1.5}
@media(max-width:600px){.timeline-intervals button{padding:4px 8px}#timelinePeriod{margin-left:0;flex:1}.timeline-controls{gap:8px}.timeline-content .daily-revenue-canvas{min-height:260px}.trend-header{gap:8px}}
@media(max-width:600px){#timelineDetailDialog{width:calc(100vw - 16px);padding:12px}.timeline-dialog-heading h2{font-size:18px}}
.summary-phase #dashboard>#channelComparison{display:block!important;margin-top:20px;padding:16px 0;color:#203a59;min-width:0}
#channelComparison h2{font-size:20px;font-weight:800;margin:0 0 14px;background:#edf5ff;padding:6px 8px;border-radius:4px;width:fit-content}
.comparison-controls{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap;background:#edf3fc;padding:12px;border-radius:8px}
.comparison-controls details{position:relative;min-width:220px;max-width:100%;background:#f3f7ff;border:1px solid #c9daed;border-radius:8px}
.comparison-controls summary{padding:10px 14px;cursor:pointer;font-weight:700}
.comparison-channel-options{max-height:260px;overflow:auto;padding:8px 12px}
.comparison-controls label{display:flex;flex-direction:row;align-items:center;gap:8px;font-size:15px;font-weight:600;padding:5px 0;overflow-wrap:anywhere}
.comparison-controls input{width:16px;height:16px;min-height:16px;padding:0;flex:none;accent-color:#1769d5}
.comparison-controls fieldset{flex:1;min-width:0;border:0;padding:0;margin:0}
.comparison-controls legend{font-weight:700;font-size:14px}
.comparison-parameters{display:flex;flex-wrap:wrap;gap:6px 18px}
.comparison-status{font-size:14px;margin:10px 0;color:#405873}
.comparison-status:empty{display:none}
.comparison-canvas{position:relative;height:420px;margin-top:14px;background:linear-gradient(135deg,#fafdff,#eef1fb);border-radius:8px;padding:12px;box-sizing:border-box}
@media(max-width:600px){.comparison-controls{display:block}.comparison-controls fieldset{margin-top:12px}.comparison-canvas{height:460px}}
#viewsTreeButton>.share-title{width:100%;box-sizing:border-box;border:0;text-align:left;cursor:default;margin:0 0 12px}
#viewsTree .views-tree-tile{cursor:pointer;text-align:left}
#viewsTree .views-tree-tile:focus-visible{outline:3px solid #1266dc;outline-offset:3px}
#viewsTree .views-tree-tile{--distribution-tint:#edf3fa;background:linear-gradient(145deg,#fafcff,var(--distribution-tint))!important;border:1px solid #d9e3ef;box-shadow:0 2px 7px #173c700a;color:#233a54;transition:border-color .15s,box-shadow .15s}
#viewsTree .views-tree-tile:nth-child(3n+2){--distribution-tint:#f1eef8}
#viewsTree .views-tree-tile:nth-child(3n){--distribution-tint:#eef5f3}
#viewsTree .views-tree-tile:hover{border-color:#8daecc;box-shadow:0 3px 10px #173c7014}
#viewsTree .views-tree-tile{
  cursor:pointer;position:relative;transform-origin:center;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
@media(hover:hover) and (pointer:fine){
  #viewsTree .views-tree-tile:hover{
    transform:scale(1.018);border-color:#78a9e6;z-index:1;
    box-shadow:0 0 18px #579af038,0 5px 14px #173c701c,inset 0 0 0 1px #a3c6f0;
  }
}
#viewsTree .views-tree-tile:focus-visible{
  outline:3px solid #1769d5;outline-offset:3px;border-color:#4f8edb;
  box-shadow:0 6px 16px #173c7026;
}
#viewsTree .views-tree-tile:active{transform:scale(1);box-shadow:inset 0 1px 5px #173c7026}
@media(prefers-reduced-motion:reduce){
  #viewsTree .views-tree-tile{transition:none}
  #viewsTree .views-tree-tile:hover{transform:none}
}
#viewsTree .views-tree-tile>.tile-channel-icon.channel-brand{width:40px;height:34px;border:1px solid #dfe6ef;background:#fff;box-shadow:none;border-radius:6px}
#viewsTree .tile-share{color:#405873;font-size:16px;font-weight:700;margin-top:4px}
#viewsTree .views-tree-tile{display:grid;grid-template-columns:minmax(0,1fr) 40px;align-content:start;align-items:start;min-height:0;padding:12px;gap:6px 10px}
#viewsTree .views-tree-tile>span:first-child{grid-column:1;grid-row:1;min-width:0;font-size:16px;line-height:1.35}
#viewsTree .views-tree-tile>.tile-channel-icon{grid-column:2;grid-row:1;justify-self:end}
#viewsTree .views-tree-tile>strong{grid-column:1/-1;min-width:0;margin-top:0;font-size:22px;line-height:1.3;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
#viewsTree .views-tree-tile>.channel-comparison{grid-column:1/-1}
/* Expanded share rows own their spacing instead of inheriting compact legend geometry. */
#revenueOverview #revenueShareExpanded{box-sizing:border-box;min-width:0;padding:16px;color:#233a54;border:1px solid #d9e3ef;border-radius:8px}
#revenueShareExpanded .share-dialog-heading{gap:12px}
#revenueShareExpanded .share-dialog-heading h2{min-width:0;overflow-wrap:anywhere;color:#172f50}
#revenueShareExpanded .distribution-collapse{flex:none}
#revenueShareExpanded #fullShareRows{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:16px 24px}
#fullShareRows .full-share-row{min-width:0;padding:8px 0;box-sizing:border-box}
#fullShareRows .share-channel,#fullShareRows .full-share-row strong{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere;line-height:1.4;color:#233a54;font-size:16px;font-weight:700}
#viewsTree .channel-comparison{background:transparent;font-size:12px;padding:2px 0;font-weight:700}
#channelDetailDialog{width:min(1000px,calc(100vw - 32px));max-width:calc(100vw - 32px);max-height:85vh;padding:20px;box-sizing:border-box;border-radius:8px;color:#183452}
.channel-detail-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.channel-detail-heading h2{margin:0;font-size:22px;font-weight:800;overflow-wrap:anywhere}
.channel-detail-heading p{margin:6px 0 0;color:#52677c;font-size:14px}
.channel-detail-heading button{flex:none;width:36px;height:36px;display:grid;place-items:center;padding:6px}
.channel-detail-heading svg{width:20px;height:20px}
.channel-detail-actions{display:flex;gap:8px;flex:none}
.channel-detail-heading>div:first-child{min-width:0}
.channel-detail-totals{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;padding:18px 0;margin:16px 0;border-block:1px solid #dce7f2}
.channel-detail-totals dt{font-size:13px;color:#52677c;font-weight:600}
.channel-detail-totals dd{font-size:22px;font-weight:800;margin:6px 0 0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.channel-detail-table{overflow:auto}
/* Modal content scrolls independently; keep the page position and width stable. */
html{scrollbar-gutter:stable}
html:has(dialog:modal),body:has(dialog:modal){overflow:hidden;overscroll-behavior:none}
dialog:modal{overscroll-behavior:contain}
.channel-detail-table table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.channel-detail-table :is(th,td){background:#fff;color:#183452;padding:10px;border-bottom:1px solid #e3edf7;text-align:right;white-space:nowrap;font-size:14px}
.channel-detail-table thead th{background:#edf5ff;font-size:12px}
.channel-detail-table th:first-child{text-align:left}
#channelDetailCoverage{color:#80521c;font-size:13px}
#channelDetailCoverage:empty{display:none}
@media(max-width:650px){.channel-detail-totals{grid-template-columns:repeat(2,minmax(0,1fr))}#channelDetailDialog{padding:14px}}
.overview-metric-selector{display:flex;gap:3px;padding:3px;border:1px solid #d5e4f5;border-radius:6px;background:#eff5fc;max-width:100%;box-sizing:border-box}
.summary-phase .overview-metric-selector button{padding:7px 10px;border:0;border-radius:4px;background:transparent;color:#405b78;font-size:12px;font-weight:700;white-space:nowrap;box-shadow:none;min-width:0}
.summary-phase .overview-metric-selector button:hover{background:#deebfc;color:#123d77}
.summary-phase .overview-metric-selector button[aria-pressed=true]{background:#1266dc;color:#fff;box-shadow:0 2px 4px #1266dc26}
@media(max-width:400px){.summary-phase .overview-metric-selector button{padding:7px;font-size:11px}}
.compact-share-row .distribution-track{grid-column:1/-1;height:4px;margin-top:3px;background:#edf3fa}
#channelMetrics table{table-layout:auto}
#channelMetrics tbody td{background:#fff;box-shadow:none;border-bottom:1px solid #edf2f8;color:#183452;padding:10px 8px}
#channelMetrics tbody th{border-bottom:1px solid #edf2f8}
#channelMetrics tbody td:last-child{font-weight:800}
.channel-rank{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:24px;margin-right:10px;vertical-align:middle;border-radius:4px;background:#eaf2fc;color:#20599c;font-weight:800}
.channel-value-track{display:block;height:5px;margin-top:6px;background:#edf3fa;border-radius:3px;overflow:hidden}
.channel-value-track>span{display:block;height:100%;background:#518fee;border-radius:3px}
.channel-comparison{display:block;font-size:12px;font-weight:700;margin-top:4px;color:#146943}
.channel-comparison.down{color:#a72e3c}
.summary-phase #viewsTreeButton,.summary-phase #viewsTreeButton:hover,
.summary-phase #channelMetrics .metrics-toggle,.summary-phase #channelMetrics .metrics-toggle:hover,
.summary-phase #dashboard>#viewsDistribution:has(#viewsTreeButton[hidden]){background:transparent;border-color:transparent;box-shadow:none}
.summary-phase #channelMetrics .metrics-table-scroll{background:transparent;box-shadow:none}
#viewsTree .channel-comparison{position:absolute;right:10px;bottom:18px;padding:2px 4px;background:#ffffffd9;border-radius:4px}
td:nth-child(3) .channel-value-track>span{background:#32b59d}
td:nth-child(4) .channel-value-track>span{background:#eea75a}
td:nth-child(5) .channel-value-track>span{background:#a881db}
/* An unframed channel leaderboard, with revenue as the reading anchor. */
/* Light tints retain opaque, readable surfaces over the fixed page gradient. */
.summary-phase #revenueOverview .daily-revenue{background:linear-gradient(145deg,#fbfdff 30%,#eef5ff 100%)}
.summary-phase #revenueOverview #revenueShare,.summary-phase #revenueOverview #revenueShare:hover,
.summary-phase #revenueShareExpanded{background:linear-gradient(135deg,#fcfdff 25%,#f1effb 100%)}
.summary-phase .workspace:has(>.view:not(#dashboard):not([hidden])){background:#fff linear-gradient(145deg,#fcfdff 20%,#edf5fb 70%,#f3effa)}
.summary-phase :is(.range-panel,.channel-menu,#accountMenu .account-panel,.diy-channel-menu){background:linear-gradient(150deg,#fcfdff 40%,#eef3fb)}
.summary-phase :is(#channelDetailDialog,#timelineDetailDialog){background:linear-gradient(145deg,#fcfdff 35%,#eef5ff 80%,#f4effb)}
.summary-phase #quickInsights .insight-item{background:linear-gradient(145deg,#fcfdff 35%,var(--kpi-tint))}
.summary-phase #channelMetrics tbody :is(th,td){background:linear-gradient(135deg,#fafcff,#f0f5fc)}
.summary-phase #channelMetrics tbody td:last-child{background:linear-gradient(120deg,#eaf4ff,#eeecfb)}
.summary-phase .channel-detail-table :is(th,td){background:linear-gradient(135deg,#fbfdff,#f1f5fc)}
.summary-phase .channel-detail-table thead th{background:linear-gradient(110deg,#e8f1fd,#eeedf8)}
.summary-phase :is(button,input:not([type=checkbox]):not([type=radio]),select,textarea,dialog,.table-wrap,.range-panel,.channel-menu,.account-panel,.overview-metric-selector){border-radius:8px}
.summary-phase :is(.channel-rank,.channel-glyph,.share-percent,.metric-icon,.distribution-collapse){border-radius:8px}
.summary-phase :is(.distribution-track,.channel-value-track,.diy-share-track),
.summary-phase :is(.distribution-track,.channel-value-track,.diy-share-track)>span{border-radius:8px;overflow:hidden}
.summary-phase .compact-share-row{border-radius:8px}
.summary-phase #viewsTreeButton>.share-title,.summary-phase #viewsDistribution>h2,
.summary-phase #channelMetrics .metrics-toggle>span,.summary-phase #channelMetrics .metrics-toggle>svg{border-radius:8px}
.summary-phase #channelMetrics :is(thead,tbody) tr>:first-child{border-radius:8px 0 0 8px}
.summary-phase #channelMetrics :is(thead,tbody) tr>:last-child{border-radius:0 8px 8px 0}
.summary-phase .overview-metric-selector button{border-radius:6px}
.summary-phase #viewsTreeButton{padding:0;border:0}
.summary-phase #dashboard>#viewsDistribution:has(#viewsTreeButton[hidden]){padding-left:0;padding-right:0;border-left:0;border-right:0}
.summary-phase #viewsDistribution>h2:not([hidden]){margin-right:72px}
@media(min-width:801px){
  .summary-phase{--dashboard-gutter:max(12px,calc(25% - 308px))}
  .summary-phase .workspace{max-width:none;padding-left:var(--dashboard-gutter);padding-right:var(--dashboard-gutter)}
  .summary-phase #shell>header{padding-left:var(--dashboard-gutter);padding-right:var(--dashboard-gutter)}
}
.summary-phase #channelMetrics .metrics-toggle>span,
#viewsTreeButton>.share-title,#viewsDistribution>h2{background:#edf5ff;color:#172f50;border-radius:4px;padding:5px 8px}
.summary-phase #channelMetrics .metrics-toggle>span,#viewsTreeButton>.share-title{font-size:18px;font-weight:800;line-height:24px;letter-spacing:0;border-radius:8px}
#viewsTreeButton>.share-title{width:fit-content;max-width:100%;margin-bottom:8px}
.summary-phase #channelMetrics .metrics-toggle>svg{background:#edf5ff;color:#172f50;border-radius:4px;padding:3px;box-sizing:content-box}
#viewsDistributionRows .full-share-row{background:#edf5ff;color:#172f50;padding:10px;border-radius:4px}
#channelMetrics table{border-collapse:separate;border-spacing:0 6px;font-family:'Segoe UI',Arial,sans-serif;font-variant-numeric:tabular-nums}
#channelMetrics thead th{background:#edf5ff;box-shadow:none;border:0;padding:8px 10px;color:#304c6c;font-size:14px;font-weight:700}
#channelMetrics tbody :is(th,td){padding:12px 10px;border-top:1px solid #e3edf7;border-bottom:1px solid #e3edf7;background:#ffffffeb;vertical-align:middle}
#channelMetrics tbody th{border-left:1px solid #e3edf7;border-radius:6px 0 0 6px;font-size:16px;font-weight:700}
#channelMetrics tbody td{font-size:18px;font-weight:700;line-height:1.35;white-space:nowrap}
#channelMetrics tbody td:last-child{border-right:1px solid #dbe8f7;border-radius:0 6px 6px 0;background:#edf5ff;color:#123b72;font-size:20px;font-weight:800}
#channelMetrics tbody tr,#channelMetrics tbody tr:hover{background:transparent;cursor:default}
#channelMetrics .channel-rank{min-width:24px;height:28px;background:#edf3fa;color:#486382;font-size:13px}
#channelMetrics tr:nth-child(1) .channel-rank{background:#ffedbb;color:#81500e}
#channelMetrics tr:nth-child(2) .channel-rank{background:#dfeaf8;color:#355d8f}
#channelMetrics tr:nth-child(3) .channel-rank{background:#f8e2d5;color:#8b4c31}
#channelMetrics .channel-glyph.channel-brand{box-shadow:0 2px 5px #173c7010;border-color:#e4ebf3}
#channelMetrics .channel-value-track{height:4px;margin-top:7px;background:#e9f0f8}
#channelMetrics .channel-value-track>span{background:linear-gradient(90deg,#8ebcff,#367fe5)}
#channelMetrics td:nth-child(3) .channel-value-track>span{background:linear-gradient(90deg,#8bdbcc,#269d88)}
#channelMetrics td:nth-child(4) .channel-value-track>span{background:linear-gradient(90deg,#f8d3a4,#df9742)}
#channelMetrics td:nth-child(5) .channel-value-track>span{background:linear-gradient(90deg,#d2bbf1,#9870cc)}
#channelMetrics .channel-comparison{font-size:14px;line-height:1.4;margin-top:6px}
@media(max-width:650px){#channelMetrics tbody :is(th,td){padding:10px 8px}}
@media(max-width:800px){.summary-phase #dashboard>#revenueOverview{grid-template-columns:minmax(0,1fr)}.summary-phase #dashboard>#performanceInsight:not([hidden]){display:block!important;padding:16px}#performanceInsight p{padding:8px 0 0;border:0}.summary-phase .metrics strong{font-size:32px}}

/* Operational views: distinct accents, with the same restrained depth as the overview. */
.summary-phase #tabular{--view-accent:#2769ba;--view-soft:#eaf3ff;--view-strong:#174a87}
.summary-phase #uploads{--view-accent:#078777;--view-soft:#e6f7f3;--view-strong:#086557}
.summary-phase #admin{--view-accent:#9557a8;--view-soft:#f5ecf8;--view-strong:#713483}
.summary-phase #diyGraphs{--view-accent:#5966bd;--view-soft:#eef0fc;--view-strong:#394799}
.summary-phase #insightsView{--view-accent:#bf557b;--view-soft:#fff0f5;--view-strong:#8d3156}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView){min-width:0;color:#173552}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView)>:is(.section-title,h2:first-child){border-bottom:1px solid #cfdff0;padding-bottom:13px;margin-bottom:20px}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) .eyebrow{color:var(--view-strong);font-size:12px;font-weight:800}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) :is(h1,h2,h3){color:#102b4e;font-weight:800}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) h1{font-size:28px;line-height:1.2}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView)>h2{font-size:19px}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) :is(input:not([type=checkbox]):not([type=radio]),select,textarea){background:#fff;border:1px solid #b7cadf;color:#173552;box-shadow:inset 0 1px 2px #172f5010,0 1px 0 #fff;accent-color:var(--view-accent)}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) :is(input,select,textarea,summary):focus-visible{outline:2px solid var(--view-accent);outline-offset:2px}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) :is(button:not(.primary),#diyChannels summary){background:linear-gradient(180deg,#fff,#f0f5fb);color:#234563;border-color:#b6cbe0;box-shadow:inset 0 1px 0 #fff,0 2px 5px #17375813}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) button.primary{background:linear-gradient(180deg,var(--view-accent),var(--view-strong));border-color:var(--view-strong);color:#fff;font-weight:700;box-shadow:inset 0 1px 0 #ffffff40,0 4px 10px #19385c26}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) button:not(:disabled):hover{filter:brightness(.97);box-shadow:inset 0 1px 0 #fff8,0 4px 11px #17375824}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) button.primary:not(:disabled):hover{box-shadow:inset 0 1px 0 #ffffff42,0 5px 13px #17375838}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) .table-wrap,
.summary-phase #diyGraphs .diy-data{border:1px solid #cdddec;border-radius:8px;background:#fff;box-shadow:inset 0 1px 0 #fff,0 5px 16px #1a3c6314,0 1px 3px #1a3c6310;overflow:auto}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs) :is(thead th,.diy-data thead th){background:linear-gradient(180deg,var(--view-soft),#f5f9ff);color:#234769;font-size:13px;font-weight:800;border-bottom:1px solid #cadced}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs) :is(tbody td,.diy-data tbody td){background:#ffffffed;color:#1b3b58;font-size:14px;border-bottom:1px solid #e1ebf4}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs) tbody tr:nth-child(even) td{background:#f7faff}
.summary-phase :is(#tabular,#uploads,#admin,#diyGraphs) tbody tr:hover td{background:var(--view-soft)}
.summary-phase #tabular .number,.summary-phase #uploads .number{font-weight:700;font-variant-numeric:tabular-nums}
.summary-phase #uploads #uploadForm,.summary-phase #admin #channelForm{border:1px solid #cbddeb;border-left:3px solid var(--view-accent);border-radius:8px;padding:15px 17px;margin:0 0 24px;background:linear-gradient(125deg,#fff 55%,var(--view-soft));box-shadow:inset 0 1px 0 #fff,0 5px 15px #17375812}
.summary-phase #uploads #uploadForm label,.summary-phase #admin #channelForm label{font-size:13px;font-weight:800;color:#254563}
.summary-phase #uploads #preview{border:1px solid #bddbd2;border-left:3px solid #078777;border-radius:8px;padding:16px;margin-bottom:25px;background:linear-gradient(145deg,#fff,#f0faf7);box-shadow:0 5px 15px #17375812}
.summary-phase #uploads #preview .section-title{margin-bottom:12px}
.summary-phase #uploads #previewCount{font-weight:800;color:#086557}
.summary-phase #uploads #replaceLabel{font-size:13px;font-weight:700;color:#4c3943}
.summary-phase #admin #channelDirectory{gap:8px}
.summary-phase #admin #channelDirectory>div{border:1px solid #d5e2ee;border-left:3px solid #b48aca;border-radius:8px;padding:9px 11px;background:linear-gradient(130deg,#fff,#f7f9ff);box-shadow:inset 0 1px 0 #fff,0 2px 7px #17375810;color:#173552;font-weight:700}
.summary-phase #admin #channelDirectory>div:has(button[data-archived="false"]){border-left-color:#8d9cae;opacity:.78}
.summary-phase #admin #channelDirectory button[data-archived="true"]{color:#963951;border-color:#e4b7c4;background:#fff5f7}
.summary-phase #admin #channelDirectory button[data-archived="false"]{color:#08745e;border-color:#acd8c7;background:#effaf4}
.summary-phase :is(#uploads,#admin) .status-pill,.summary-phase #admin .role-pill{display:inline-flex;align-items:center;min-height:27px;max-width:100%;padding:4px 9px;border:1px solid transparent;border-radius:6px;font-size:12px;line-height:1.35;font-weight:800;white-space:normal}
.summary-phase :is(#uploads,#admin) :is(.status-committed,.status-enabled){color:#08634b;background:#e4f6ed;border-color:#b5dfca}
.summary-phase :is(#uploads,#admin) .status-pending{color:#805309;background:#fff1d4;border-color:#eed299}
.summary-phase :is(#uploads,#admin) :is(.status-restored,.status-disabled){color:#95405a;background:#fff0f3;border-color:#efc7d1}
.summary-phase #uploads .status-rejected{color:#7f4e41;background:#fff1e8;border-color:#e9c9b8}
.summary-phase :is(#uploads,#admin) .status-unknown{color:#465d78;background:#edf2f8;border-color:#d1dce8}
.summary-phase #uploads .upload-history-heading{margin-top:25px;margin-bottom:12px}
.summary-phase #uploads .upload-history-heading h2{margin:0}
.summary-phase #uploads #showArchivedLabel{margin:0;font-size:13px;white-space:nowrap}
.summary-phase #uploads #history td{vertical-align:middle}
.summary-phase #uploads #history{min-width:880px}
.summary-phase #uploads #history td:nth-child(3){white-space:nowrap}
.summary-phase #uploads #history td:nth-child(4){min-width:190px}
.summary-phase #uploads #history td small{display:block;margin-top:4px;color:#526983;font-size:11px;font-weight:600;white-space:nowrap}
.summary-phase #uploads #history td .status-pill+.status-pill{margin-left:5px}
.summary-phase #uploads .upload-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap;min-width:210px}
.summary-phase #uploads .upload-actions :is(button,.upload-download){display:inline-flex;align-items:center;justify-content:center;min-height:31px;padding:5px 9px;border:1px solid #cbdbea;border-radius:6px;background:#fff;color:#1d527e;font-size:12px;font-weight:700;text-decoration:none;white-space:nowrap}
.summary-phase #uploads .upload-actions :is(button,.upload-download):hover{background:#eaf3fb}
.summary-phase #uploads .upload-actions .upload-danger{color:#983f4d;border-color:#e2bbc3}
.summary-phase #uploads .upload-subsection-heading{margin:26px 0 12px;padding-top:18px;border-top:1px solid #cbdced}
.summary-phase #uploads .upload-subsection-heading h2{margin:0}
.summary-phase #uploads .upload-filter-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.summary-phase #uploads #dateSearch{width:174px;min-height:36px;padding:6px 9px}
.summary-phase #uploads .upload-filter-actions .check{margin:0;font-size:13px;white-space:nowrap}
.summary-phase #uploads #reportingDates td{white-space:nowrap}
.summary-phase #uploads #reportingDates button{min-height:32px;padding:5px 11px;font-size:12px;font-weight:700}
.summary-phase #uploads #auditExport{display:inline-flex;align-items:center;min-height:34px;padding:6px 11px;border:1px solid #b7cbe5;border-radius:6px;background:#eff5ff;color:#174879;font-size:12px;font-weight:800;text-decoration:none}
.summary-phase #uploads #auditExport:hover{background:#e1edff}
.summary-phase #uploads .audit-status{display:inline-flex;margin:0 0 12px;padding:7px 11px;border:1px solid #b7ddcd;border-radius:6px;background:#eaf7f0;color:#116444;font-size:12px;font-weight:800}
.summary-phase #uploads .audit-status.audit-invalid{border-color:#e8bbc2;background:#fff0f2;color:#9b3041}
.summary-phase #uploads .table-wrap:has(#auditEvents) table{min-width:760px}
.summary-phase #uploads #auditEvents td{vertical-align:top;font-size:12px}
.summary-phase #uploads #auditEvents td:first-child,.summary-phase #uploads #auditEvents td:nth-child(2){white-space:nowrap}
.summary-phase #uploads #auditEvents td:nth-child(4){max-width:320px;overflow-wrap:anywhere}
.summary-phase #uploads #auditEvents code{font-size:11px;color:#385c88}
.summary-phase #admin :is(.role-super,.role-admin){color:#713483;background:#f4eaf8;border-color:#e1c9eb}
.summary-phase #admin .role-uploader{color:#176278;background:#e5f4f8;border-color:#bce0e8}
.summary-phase #admin .role-viewer{color:#365a94;background:#eaf1ff;border-color:#c8d9f4}
.summary-phase #admin .role-unknown{color:#465d78;background:#edf2f8;border-color:#d1dce8}
.summary-phase #diyGraphs .diy-controls,.summary-phase #diyGraphs .diy-presets{border:1px solid #d0daee;padding:14px;background:linear-gradient(125deg,#fff 60%,#f1f2fc);box-shadow:inset 0 1px 0 #fff,0 4px 12px #1a3c6310}
.summary-phase #diyGraphs .diy-controls{border-radius:8px 8px 0 0}
.summary-phase #diyGraphs .diy-presets{margin-top:-1px;border-radius:0 0 8px 8px}
.summary-phase #diyGraphs #diyChannels summary{border-radius:8px}
.summary-phase #diyGraphs .diy-channel-menu{background:#fff;border-color:#c8d6ed;box-shadow:0 12px 26px #17375829}
.summary-phase #diyGraphs .diy-data{margin-top:20px}
.summary-phase #insightsView #quickInsights{border:0;padding:0}
.summary-phase #insightsView #quickInsights .insights-heading{border-bottom:1px solid #cfdff0;padding:0 0 14px}
.summary-phase #insightsView #quickInsights .insight-item{border:1px solid #d6dff0;border-top:3px solid var(--kpi-accent);box-shadow:inset 0 1px 0 #fff,0 6px 17px #17375817,0 1px 3px #1737580d}
.summary-phase #insightsView #quickInsights .insight-item:hover{box-shadow:inset 0 1px 0 #fff,0 8px 20px #17375822}
.summary-phase :is(#userDialog,#passwordDialog,#accountDialog){background:linear-gradient(145deg,#fff 62%,#edf4fe);border:1px solid #bed1e5;box-shadow:inset 0 1px 0 #fff,0 20px 60px #061b3b50;color:#173552}
.summary-phase :is(#userDialog,#passwordDialog,#accountDialog) h2{color:#102b4e;font-size:22px}
.summary-phase :is(#userDialog,#passwordDialog,#accountDialog) :is(label,legend){color:#254563;font-size:13px;font-weight:700}
.summary-phase :is(#userDialog,#passwordDialog,#accountDialog) fieldset{border-color:#c7d9ea;background:#f7faff}
.summary-phase :is(#userDialog,#passwordDialog,#accountDialog) .primary{background:linear-gradient(180deg,#2873c5,#174d91);border-color:#174d91;color:#fff;font-weight:700;box-shadow:inset 0 1px 0 #ffffff55,0 4px 12px #17375825}
@media(max-width:650px){
  .summary-phase :is(#tabular,#uploads,#admin,#diyGraphs,#insightsView) h1{font-size:24px}
  .summary-phase #uploads #uploadForm,.summary-phase #admin #channelForm{padding:13px;align-items:stretch}
  .summary-phase #uploads #uploadForm label,.summary-phase #admin #channelForm label{flex-basis:100%;max-width:none}
  .summary-phase #admin #channelDirectory{grid-template-columns:minmax(0,1fr)}
  .summary-phase #diyGraphs .diy-controls,.summary-phase #diyGraphs .diy-presets{padding:12px}
}

/* Keep the header controls on a shared baseline and the navigation drawer above them. */
.summary-phase #shell>header{align-items:center;flex-wrap:nowrap;gap:12px;min-height:72px}
.summary-phase #accountMenu{flex:0 0 auto;min-width:0}
.summary-phase #shell>header>#accountMenu[open]{z-index:5}
.summary-phase #accountMenu>summary{display:flex;align-items:center;gap:12px;min-height:44px;line-height:1.2}
.summary-phase #accountMenu .brand-icon{width:44px;height:44px}
.summary-phase #revenueHeader{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:1 1 auto;min-width:0}
.summary-phase #filters{display:flex;align-items:center;flex:0 1 auto;flex-wrap:nowrap;gap:10px;min-width:0}
.summary-phase #filters>#rangePicker,.summary-phase #filters>.channel-field{flex:1 1 300px;width:300px;max-width:300px;min-width:0}
.summary-phase #filters>.channel-field{display:flex;align-items:center}
.summary-phase .revenue-header #channelPicker{width:100%;max-width:100%;min-width:0}
.summary-phase #rangePicker>summary,.summary-phase .revenue-header #channelPicker>summary,
.summary-phase #revenueHeader #export{height:44px;min-height:44px;max-height:44px;box-sizing:border-box;align-items:center;margin:0}
.summary-phase #rangePicker>summary,.summary-phase .revenue-header #channelPicker>summary{overflow:hidden;white-space:nowrap}
.summary-phase #rangePicker>summary>span:not(:first-child){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.summary-phase #revenueHeader #export{width:44px;min-width:44px;flex:none;display:grid;place-items:center;padding:10px}
.summary-phase #accountMenu .account-panel{background:linear-gradient(155deg,#fff 18%,#eef5ff);border-right:1px solid #cadcf2;box-shadow:16px 0 48px #081d3f40;padding:18px;z-index:60}
.summary-phase #accountMenu .drawer-heading{display:flex;align-items:center;justify-content:space-between;min-height:48px;gap:12px;padding:0 0 14px;border-bottom:1px solid #d6e3f1;color:#102b4e}
.summary-phase #accountMenu .drawer-heading strong{font-size:20px;font-weight:800}
.summary-phase #accountMenu .drawer-close{display:grid;place-items:center;width:36px;height:36px;min-height:36px;flex:none;margin:0;padding:7px;border:1px solid #c7d7e9;border-radius:8px;background:#fff;color:#173c6e}
.summary-phase #accountMenu .drawer-close svg{width:18px;height:18px}
.summary-phase #accountMenu .account-panel nav{width:100%;margin:14px 0 20px;padding:0;gap:4px;background:transparent;border:0}
.summary-phase #accountMenu .account-panel nav button{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:10px 12px;border:1px solid transparent;border-left:3px solid transparent;border-radius:8px;text-align:left;font-size:14px;font-weight:700;line-height:1.3;color:#244362;box-shadow:none}
.summary-phase #accountMenu .account-panel nav button:hover{background:#edf4fd;color:#153e77;box-shadow:none}
.summary-phase #accountMenu .account-panel nav button.active,
.summary-phase #accountMenu .account-panel nav button.active:hover{background:linear-gradient(105deg,#e6f1ff,#f3f5ff);color:#124a98;border-color:#c8dcf5;border-left-color:#2874d4;box-shadow:inset 0 1px 0 #fff,0 2px 6px #17375812}
.summary-phase #accountMenu .menu-icon{display:grid;place-items:center;width:19px;height:19px;flex:none;color:#4276af}
.summary-phase #accountMenu .menu-icon svg{width:19px;height:19px}
.summary-phase #accountMenu .account-panel .identity{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:8px;padding-top:16px;border-top:1px solid #d6e3f1}
.summary-phase #accountMenu .account-panel #identity{grid-column:1/-1;color:#49627f;font-size:12px;line-height:1.4}
.summary-phase #accountMenu .account-panel .identity button{width:100%;min-height:40px;margin:0;padding:8px;font-weight:700}
@media(max-width:650px){
  .summary-phase #shell>header{flex-wrap:wrap;gap:8px;padding-top:12px;padding-bottom:12px}
  .summary-phase #revenueHeader{flex:1 1 100%;width:100%;gap:8px}
  .summary-phase #filters{flex:1 1 auto;gap:6px}
  .summary-phase #filters>#rangePicker{flex:1.2 1 0;width:0;max-width:none}
  .summary-phase #filters>.channel-field{flex:1 1 0;width:0;max-width:none}
}

/* Match the date and channel popovers to the light header controls. */
.summary-phase #rangePicker .range-panel,
.summary-phase #channelPicker .channel-menu{background:linear-gradient(150deg,#fff 45%,#f2f6ff);color:#17385d;border:1px solid #b8cdeb;box-shadow:0 16px 38px #061a3b38,inset 0 1px 0 #fff}
.summary-phase #channelPicker .picker-actions{border-bottom-color:#d7e3f1}
.summary-phase #channelPicker .picker-actions button,
.summary-phase #rangePicker :is(.calendar-nav,.calendar-choices) button{background:#edf4ff;color:#174879;border:1px solid #c7d9ee;font-weight:700}
.summary-phase #channelPicker .picker-actions button:hover,
.summary-phase #rangePicker :is(.calendar-nav,.calendar-choices) button:not(:disabled):hover{background:#dceaff;color:#103d75;border-color:#91b4e2}
.summary-phase #channelPicker #channelSearch{background:#fff;color:#17385d;border:1px solid #b8cdeb;box-shadow:inset 0 1px 2px #143b650a}
.summary-phase #channelPicker #channelSearch::placeholder{color:#60758c;opacity:1}
.summary-phase #channelPicker #channelOptions label{color:#17385d;border-radius:6px;font-weight:600}
.summary-phase #channelPicker #channelOptions label:hover{background:#e9f2ff;box-shadow:inset 0 0 0 1px #bdd4ef}
.summary-phase #channelPicker #channelOptions label:has(input:checked){background:#e8f1ff;color:#123f77}
.summary-phase #channelPicker #channelOptions input{accent-color:#155bb3}
.summary-phase #rangePicker .flatpickr-calendar.inline,
.summary-phase #rangePicker .flatpickr-months .flatpickr-month,
.summary-phase #rangePicker .flatpickr-weekdays,
.summary-phase #rangePicker .flatpickr-weekday{background:transparent;color:#17385d}
.summary-phase #rangePicker .flatpickr-current-month .cur-month,
.summary-phase #rangePicker .flatpickr-current-month input.cur-year{background:transparent;color:#102e55;font-weight:800}
.summary-phase #rangePicker .flatpickr-months :is(.flatpickr-prev-month,.flatpickr-next-month){color:#174879;fill:#174879}
.summary-phase #rangePicker .flatpickr-day{background:transparent;color:#17385d;border:1px solid transparent;font-weight:600}
.summary-phase #rangePicker .flatpickr-day:not(.flatpickr-disabled):hover{background:#e8f0ff;color:#174879;border-color:#b8cdeb}
.summary-phase #rangePicker #availableDataDates{width:100%;margin-bottom:10px;min-height:36px;font-size:13px;background:#edf4ff;color:#174879;border:1px solid #b8cdeb;box-shadow:none}
.summary-phase #rangePicker #availableDataDates[aria-pressed=true]{background:#155bb3;color:#fff;border-color:#155bb3}
.summary-phase #rangePicker .calendar-choices{max-height:220px;overflow:auto;overscroll-behavior:contain}
.summary-phase #rangePicker .flatpickr-day.flatpickr-disabled,
.summary-phase #rangePicker .flatpickr-day.flatpickr-disabled:hover{background:#f3f6fa;color:#8492a2;border-color:#fff}
.summary-phase #rangePicker .flatpickr-day.selected,
.summary-phase #rangePicker .flatpickr-day.selected:hover{background:#155bb3;color:#fff;border-color:#155bb3}
.summary-phase #rangePicker .flatpickr-day.today:not(.selected){border-color:#155bb3}
.calendar-coverage-legend{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;font-size:11px}
.calendar-coverage-legend span{padding:4px 6px;border-radius:4px}
.summary-phase #rangePicker .coverage-complete{background:#dff3e8;color:#165e3d}
.summary-phase #rangePicker .coverage-partial{background:#fff0c2;color:#785407}
.summary-phase #rangePicker .coverage-missing{background:#fbe5e8;color:#962d40}
.summary-phase #rangePicker .flatpickr-day.selected{background:#155bb3;color:#fff;border-color:#155bb3}
.summary-phase #rangePicker .calendar-choices{background:#fff;border:1px solid #d7e3f1;border-radius:8px;padding:8px}
@media(max-width:650px){
  .summary-phase #rangePicker .range-panel{width:min(336px,calc(100vw - 24px));max-width:calc(100vw - 24px);left:0;right:auto}
}
@media(max-width:600px){
  .summary-phase #uploads .table-wrap:has(#history){border:0;background:transparent;box-shadow:none;overflow:visible}
  .summary-phase #uploads .table-wrap:has(#history) table,
  .summary-phase #uploads #history{display:block;width:100%;min-width:0}
  .summary-phase #uploads .table-wrap:has(#history) thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .summary-phase #uploads #history tr{display:block;margin-bottom:10px;border:1px solid #d2dfef;border-radius:8px;background:linear-gradient(145deg,#fff,#f4f8ff);box-shadow:0 4px 14px #24477112;overflow:hidden}
  .summary-phase #uploads #history td{display:grid;grid-template-columns:68px minmax(0,1fr);gap:8px;align-items:start;width:100%;min-width:0;padding:8px 11px;white-space:normal;overflow-wrap:anywhere}
  .summary-phase #uploads #history td::before{content:attr(data-label);color:#526983;font-size:11px;font-weight:800;text-transform:uppercase}
  .summary-phase #uploads #history td[colspan]{display:block}
  .summary-phase #uploads #history td[colspan]::before{content:none}
  .summary-phase #uploads #history td:nth-child(4){min-width:0}
  .summary-phase #uploads .upload-actions{min-width:0}
  .summary-phase #uploads #history td[data-label="Actions"]:has(.upload-actions:empty){display:none}
  .summary-phase #uploads .table-wrap:has(#reportingDates){border:0;background:transparent;box-shadow:none;overflow:visible}
  .summary-phase #uploads .table-wrap:has(#reportingDates) table,
  .summary-phase #uploads #reportingDates{display:block;width:100%;min-width:0}
  .summary-phase #uploads .table-wrap:has(#reportingDates) thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .summary-phase #uploads #reportingDates tr{display:grid;grid-template-columns:1fr 1fr;gap:0 8px;padding:5px 9px;margin-bottom:8px;border:1px solid #d2dfef;border-radius:8px;background:linear-gradient(145deg,#fff,#f4f8ff);box-shadow:0 4px 14px #24477112}
  .summary-phase #uploads #reportingDates td{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;padding:6px 4px;border:0;white-space:normal}
  .summary-phase #uploads #reportingDates td::before{content:attr(data-label);color:#526983;font-size:10px;font-weight:800;text-transform:uppercase}
  .summary-phase #uploads #reportingDates td[colspan]{grid-column:1/-1}
  .summary-phase #uploads #reportingDates td[colspan]::before{content:none}
  .summary-phase #uploads .table-wrap:has(#auditEvents){border:0;background:transparent;box-shadow:none;overflow:visible}
  .summary-phase #uploads .table-wrap:has(#auditEvents) table,
  .summary-phase #uploads #auditEvents{display:block;width:100%;min-width:0}
  .summary-phase #uploads .table-wrap:has(#auditEvents) thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .summary-phase #uploads #auditEvents tr{display:grid;grid-template-columns:1fr 1fr;gap:0 8px;padding:5px 9px;margin-bottom:8px;border:1px solid #d2dfef;border-radius:8px;background:linear-gradient(145deg,#fff,#f4f8ff);box-shadow:0 4px 14px #24477112}
  .summary-phase #uploads #auditEvents td{display:flex;flex-direction:column;gap:4px;min-width:0;max-width:none;padding:6px 4px;border:0;white-space:normal;overflow-wrap:anywhere}
  .summary-phase #uploads #auditEvents td::before{content:attr(data-label);color:#526983;font-size:10px;font-weight:800;text-transform:uppercase}
  .summary-phase #uploads #auditEvents td:nth-child(n+3){grid-column:1/-1}
  .summary-phase #uploads #auditEvents td[colspan]::before{content:none}
}
/* Keep account recovery addresses readable without widening the user table. */
.user-recovery-email{display:block;max-width:280px;margin-top:4px;white-space:normal;overflow-wrap:anywhere;font-size:12px;color:#435b78}

/* Keep the change badge distinct from its comparison-period caption. */
.summary-phase .metrics .metric-value-row>.metric-changes{max-width:44%;align-self:center}
.summary-phase .metrics .metric-changes .metric-change{display:flex;flex-direction:column;align-items:flex-end;gap:5px;padding:0;background:transparent;border:0;border-radius:0;white-space:normal;box-shadow:none}
.summary-phase .metrics .metric-changes .metric-change[hidden]{display:none}
.summary-phase .metrics .metric-changes .metric-change:is(.up,.down,.steady,.neutral){background:transparent;box-shadow:none}
.summary-phase .metrics .metric-change::before,.summary-phase .metrics .metric-change.up::before,.summary-phase .metrics .metric-change.down::before{content:none}
.summary-phase .metrics .metric-change-value{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:26px;padding:3px 9px;border:1px solid #dfc998;border-radius:6px;background:#fff4db;color:#795014;font-size:13px;font-weight:750;line-height:18px;font-variant-numeric:tabular-nums}
.summary-phase .metrics .up .metric-change-value{background:#e6f5ed;color:#126441;border-color:#b9dfcb}
.summary-phase .metrics .down .metric-change-value{background:#fff0f3;color:#a52e4b;border-color:#edc4cf}
.summary-phase .metrics .metric-comparison-period{max-width:112px;margin:0;color:#526580;font-size:11px;font-weight:500;line-height:1.35;text-align:right;white-space:normal}
.summary-phase .metrics article:first-child .metric-comparison-period{color:#edf4ff}
.summary-phase .metrics article:first-child .metric-change-value{box-shadow:0 2px 5px #071b3a14}