/* 360volt board: original brand artwork, dark layered surfaces and accessible reading contrast. */
.motivation-page,.motivation-reading { --motivation-violet:#6766e8; --motivation-red:#ec495a; --motivation-ink:#231f20; --motivation-accent:#c4bcff; --motivation-surface:#322d32; --motivation-raised:#403743; --motivation-border:#625565; --motivation-text:#f7f4f8; --motivation-muted:#c8c0cd; color:var(--motivation-text); }
.motivation-page { width:100%; display:flex; flex-direction:column; gap:16px; min-width:0; min-height:0; background:var(--motivation-ink); padding:22px; border-radius:24px; box-sizing:border-box; }
.motivation-heading,.motivation-title,.motivation-actions,.motivation-toolbar,.motivation-footer { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.motivation-heading { flex-shrink:0; padding:20px 24px; border-radius:16px; background:linear-gradient(#231f203d,#231f203d),url("../images/motivation/360volt-gradient.png") center/cover; color:#fff; }
.motivation-title h1 { margin:6px 0; font-size:32px; line-height:1.15; color:#fff; font-weight:750; }
.motivation-title p { margin:0; color:#fff; font-size:14px; }.motivation-heading .portal-eyebrow { color:#fff; }
.motivation-fullscreen-logo { display:none; width:128px; height:auto; padding:14px; background:#fff; border-radius:12px; box-sizing:content-box; }
.motivation-actions { flex-wrap:wrap; justify-content:flex-end; gap:8px; }.motivation-actions button { border-color:#ffffff66; }
.motivation-page button,.motivation-reading-refresh { min-height:44px; padding:10px 16px; border:1px solid var(--motivation-border); border-radius:10px; color:var(--motivation-text); font:inherit; font-size:14px; font-weight:600; background:var(--motivation-surface); cursor:pointer; }
.motivation-page button:hover,.motivation-reading-refresh:hover { background:var(--motivation-raised); }.motivation-actions button:nth-child(2) { color:#fff; background:var(--motivation-violet); border-color:var(--motivation-violet); }.motivation-actions button:nth-child(2):hover { background:#5140aa; }
.motivation-page button:active { background:#514653; }
.motivation-page button:disabled,.motivation-reading-refresh:disabled { opacity:.6; cursor:wait; }
.motivation-page button:focus-visible,.motivation-page a:focus-visible,.motivation-reading a:focus-visible { outline:3px solid #6766e8; outline-offset:3px; }.motivation-actions button:focus-visible,.motivation-toolbar button:focus-visible { outline-color:#fff; box-shadow:0 0 0 6px #231f20; }
.motivation-toolbar { flex-shrink:0; }
.motivation-toolbar [role=tablist] { display:flex; flex-wrap:wrap; gap:6px; padding:5px; border:1px solid #665c63; background:#342e32; border-radius:14px; }
.motivation-toolbar [role=tab] { border-color:transparent; background:transparent; color:#e5e0e5; }.motivation-toolbar [role=tab]:hover { background:#4b4149; color:#fff; }
.motivation-toolbar [aria-selected=true] { color:#fff; background:var(--motivation-violet); }
.motivation-toolbar [aria-selected=true]:hover { background:#5140aa; }
.motivation-clock { display:flex; gap:10px; align-items:baseline; color:#d2cbd1; font-size:13px; text-align:right; }
.motivation-clock strong { font-size:30px; color:#fff; font-variant-numeric:tabular-nums; }
.motivation-warning,.motivation-reading>[role=alert] { display:flex; flex-wrap:wrap; gap:4px 8px; flex-shrink:0; border:1px solid #8f6939; border-radius:10px; padding:10px 14px; color:#f6d49a; background:#3d2c1d; font-size:13px; }
.motivation-panel { flex:1; min-height:0; overflow:auto; border-radius:16px; scrollbar-width:thin; container-type:inline-size; }.motivation-panel>.motivation-empty { background:var(--motivation-surface); border:1px solid var(--motivation-border); border-radius:16px; }
.motivation-footer { flex-shrink:0; font-size:12px; color:#d2cbd1; }
.motivation-indicators { display:flex; align-items:center; gap:8px; }
.motivation-page .motivation-indicators button { display:grid; place-items:center; min-width:44px; min-height:44px; padding:0; border:0; border-radius:8px; background:transparent; }
.motivation-indicators button span { display:block; width:32px; height:10px; border-radius:999px; background:#ffffff59; }
.motivation-indicators button[aria-current=true] span { width:64px; background:#fff; }
.motivation-indicators button:hover span { background:#ffffffa6; }
.motivation-indicators button[aria-current=true]:hover span { background:#fff; }
.motivation-page .motivation-indicators button:focus-visible { outline-color:#fff; }
.motivation-playback-status { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

.motivation-month-grid,.motivation-co2-grid { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.2fr); gap:20px; height:100%; min-height:0; }
.motivation-metrics { display:grid; grid-template-rows:repeat(3,minmax(0,1fr)); gap:14px; min-height:0; }
.motivation-metric { position:relative; border-radius:16px; padding:16px 24px; display:flex; flex-direction:column; justify-content:center; min-height:0; overflow:auto; }.motivation-month-grid .motivation-metric { padding-left:88px; }.motivation-metric-icon { position:absolute; left:24px; top:50%; transform:translateY(-50%); width:40px; height:40px; padding:9px; border-radius:12px; background:#ffffff26; box-sizing:content-box; }
.motivation-metric.primary { color:#fff; background:var(--motivation-violet); }.motivation-metric.completed { color:#fff; background:#403346; border-left:6px solid var(--motivation-red); }.motivation-metric.brand { color:#fff; background:linear-gradient(#231f203d,#231f203d),url("../images/motivation/360volt-gradient.png") center/cover; }
.motivation-metric.green { color:#d1f1de; background:#173e31; border:1px solid #38624c; }

.motivation-metric>span { font-size:14px; font-weight:600; }
.motivation-metric>strong { font-size:clamp(40px,4.5vw,68px); line-height:1.1; font-weight:750; font-variant-numeric:tabular-nums; margin:4px 0; }
.motivation-metric strong small { font-size:20px; }
.motivation-metric p { margin:0; font-size:13px; }
.motivation-projects { display:grid; grid-template-rows:repeat(2,minmax(0,1fr)); gap:16px; min-height:0; }
.motivation-project-list { display:flex; flex-direction:column; min-height:0; border:1px solid var(--motivation-border); border-radius:16px; overflow:hidden; background:var(--motivation-surface); }
.motivation-project-list header { display:flex; justify-content:space-between; gap:10px; align-items:center; padding:14px 18px; background:#ffffff08; border-bottom:1px solid #ffffff24; border-top:4px solid var(--motivation-violet); }.motivation-project-list:nth-child(2) header { border-top-color:var(--motivation-red); }
.motivation-project-list h3 { margin:0; color:var(--motivation-text); font-size:16px; font-weight:600; }
.motivation-project-list header>span { padding:2px 10px; border-radius:6px; background:#6766e82b; color:var(--motivation-accent); font-weight:600; }
.motivation-project-list ul { list-style:none; margin:0; padding:0 18px; overflow:auto; min-height:0; flex:1; scrollbar-width:thin; }
.motivation-project-list li { display:grid; grid-template-columns:minmax(0,1fr) 62px 44px; align-items:center; gap:12px; padding:14px 0; border-bottom:1px solid #ffffff1f; }
.motivation-project-list time { color:var(--motivation-muted); font-size:13px; text-align:right; font-variant-numeric:tabular-nums; }
.motivation-project-list strong { display:block; color:var(--motivation-text); font-size:18px; line-height:1.35; overflow-wrap:anywhere; }
.motivation-project-list small { display:block; color:var(--motivation-muted); font-size:13px; margin-top:3px; }
.motivation-size { font-size:13px; font-weight:600; color:var(--motivation-text); background:#ffffff0f; border:1px solid #ffffff40; padding:7px 5px; border-radius:8px; text-align:center; }
.motivation-list-more { margin:0; padding:6px 18px; font-size:12px; color:var(--motivation-muted); }
.motivation-empty { display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; color:var(--motivation-muted); padding:24px; min-height:100px; height:100%; }
.motivation-empty h2 { font-size:24px; margin-bottom:14px; color:var(--motivation-text); }
.motivation-empty p { max-width:520px; line-height:1.7; }
.motivation-co2-grid { grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); }
.motivation-impact { position:relative; display:flex; flex-direction:column; justify-content:center; padding:36px; border-radius:16px; color:#fff; background:linear-gradient(130deg,#10291be8,#162b20c9),url('../images/motivation/co2-leaves.png') center/cover; overflow:auto; }
.motivation-impact h2 { color:#fff; font-size:clamp(24px,3vw,40px); line-height:1.2; margin:12px 0 18px; max-width:560px; font-weight:700; }
.motivation-impact p { margin:0; color:#dcebdd; }
.motivation-kicker { font-size:12px; letter-spacing:.1em; text-transform:uppercase; font-weight:600; color:var(--motivation-accent); }
.motivation-impact .motivation-kicker { color:#bfe5c7; }
.motivation-impact-number { display:block; font-size:clamp(44px,7vw,96px); color:#b8f1cc; margin:20px 0; line-height:1.15; font-variant-numeric:tabular-nums; }
.motivation-impact-number span { font-size:.4em; }
.motivation-equivalent { margin-top:auto; padding-top:20px; border-top:1px solid #ffffff40; }
.motivation-equivalent small { display:block; color:#d1e5d6; font-size:12px; }
.motivation-equivalent strong { display:block; font-size:23px; line-height:1.4; margin-top:8px; }
.motivation-news { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:30px; height:100%; min-height:0; background:var(--motivation-surface); border:1px solid var(--motivation-border); border-radius:16px; overflow:hidden; }
.motivation-news-image { min-height:180px; background:linear-gradient(#231f203d,#231f203d),url("../images/motivation/360volt-gradient.png") center/cover; overflow:hidden; display:grid; place-items:center; }
.motivation-news-image img { width:100%; height:100%; min-height:0; object-fit:contain; }
.motivation-news-image>span { color:#fff; padding:35px; font-size:clamp(30px,4vw,52px); font-weight:750; line-height:1.2; }
.motivation-news>div:last-child { align-self:center; max-height:100%; overflow:auto; padding:28px 28px 28px 0; }
.motivation-news h2 { color:var(--motivation-text); font-size:clamp(24px,3vw,40px); line-height:1.3; margin:16px 0; font-weight:700; }
.motivation-news p { color:var(--motivation-muted); font-size:18px; line-height:1.7; }
.motivation-news-label { display:inline-block; font-size:12px; color:var(--motivation-muted); border-top:1px solid #ffffff26; margin-top:24px; padding-top:16px; }
.motivation-updates-grid { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:30px; height:100%; min-height:0; }
.motivation-updates { overflow:auto; min-height:0; scrollbar-width:thin; background:var(--motivation-surface); padding:24px; border:1px solid var(--motivation-border); border-radius:16px; border-top:4px solid var(--motivation-violet); }
.motivation-updates h2 { margin:8px 0 14px; color:var(--motivation-text); font-size:30px; font-weight:700; }
.motivation-updates article { display:grid; grid-template-columns:84px 120px minmax(0,1fr); align-items:center; gap:16px; padding:12px 0; border-top:1px solid #ffffff26; }
.motivation-updates time { color:var(--motivation-muted); font-size:13px; }
.motivation-apps { display:inline-block; justify-self:start; padding:4px 10px; color:var(--motivation-accent); background:#6766e82b; border:1px solid #c4bcff40; border-radius:999px; font-size:12px; font-weight:600; }
.motivation-updates h3 { color:var(--motivation-text); font-size:20px; line-height:1.4; font-weight:600; margin:0 0 6px; }
.motivation-updates p { font-size:16px; color:var(--motivation-muted); line-height:1.6; margin:0; }
.motivation-qr { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:14px; color:#fff; background:linear-gradient(#231f203d,#231f203d),url("../images/motivation/360volt-gradient.png") center/cover; border-radius:16px; padding:22px; }
.motivation-qr-code { background:#fff; padding:8px; width:100%; max-width:210px; border-radius:10px; }
.motivation-qr svg { display:block; width:100%; height:auto; }
.motivation-qr h3 { font-size:18px; line-height:1.4; font-weight:600; margin:0; }
.motivation-qr p { font-size:14px; color:#fff; line-height:1.6; margin:0; }
.motivation-qr a { color:#fff; font-size:13px; text-decoration:underline; min-height:44px; display:flex; align-items:center; }
.motivation-qr small { color:#fff; font-size:11px; }
.motivation-page:fullscreen { padding:24px 36px; height:100dvh; border-radius:0; box-sizing:border-box; }
.motivation-page:fullscreen .motivation-fullscreen-logo { display:block; }
.motivation-reading { container-type:inline-size; padding:24px; border-radius:24px; background:var(--motivation-ink); }.motivation-reading .portal-page-head h1 { color:var(--motivation-text); }.motivation-reading .portal-page-head p { color:var(--motivation-muted); }.motivation-reading .portal-page-head a { color:var(--motivation-accent); }
.motivation-reading .motivation-updates-grid { display:block; margin-bottom:40px; }
.motivation-reading>h2 { margin:30px 0 20px; font-size:26px; color:var(--motivation-text); }
.motivation-reading .motivation-news { min-height:400px; }
.motivation-page:has(>.motivation-warning) .motivation-metric { padding-block:12px; }
.motivation-page:has(>.motivation-warning) .motivation-metric>strong { font-size:clamp(32px,4vw,56px); margin:2px 0; }
@media(min-width:901px) {
 .mud-main-content:has(.motivation-page) { display:flex; flex-direction:column; height:100dvh; min-height:0; overflow:hidden; box-sizing:border-box; }
 .mud-main-content:has(.motivation-page)>.portal-nav { flex-shrink:0; }
 .ops-shell:has(>.motivation-page) { display:flex; flex:1; min-height:0; padding-bottom:16px; }
}
@media(max-width:1100px) { .motivation-clock span { display:none; }.motivation-heading { flex-wrap:wrap; }.motivation-page { gap:12px; }.motivation-metric { padding:16px; }.motivation-impact { padding:24px; } }
@media(max-width:900px) {
 .motivation-heading { align-items:flex-start; }.motivation-actions { justify-content:flex-start; }
 .motivation-page { padding:16px; border-radius:18px; }.motivation-heading { padding:18px; }.motivation-panel { min-height:560px; }.motivation-month-grid,.motivation-co2-grid { height:auto; min-height:520px; }
 .motivation-project-list { max-height:300px; }.motivation-footer { align-items:flex-start; flex-wrap:wrap; padding-bottom:20px; }
 .motivation-clock { display:none; }.motivation-toolbar [role=tablist] { width:100%; }.motivation-toolbar [role=tab] { flex:1; padding:10px; }
}
@container(max-width:650px) {
 .motivation-month-grid,.motivation-co2-grid,.motivation-news,.motivation-updates-grid { display:flex; flex-direction:column; }
 .motivation-metrics { grid-template-rows:none; grid-template-columns:1fr; gap:12px; }.motivation-metric { min-height:130px; }.motivation-projects { display:flex; flex-direction:column; }
 .motivation-project-list { min-height:200px; }.motivation-project-list li { grid-template-columns:minmax(0,1fr) 44px 32px; gap:8px; }.motivation-project-list strong { font-size:16px; }.motivation-impact { min-height:420px; }.motivation-news-image { height:230px; flex-shrink:0; }
 .motivation-qr { margin-top:20px; }.motivation-news>div:last-child { overflow:visible; padding:24px; }.motivation-updates article { grid-template-columns:1fr; gap:4px; }
}
@media(prefers-reduced-motion:reduce) { .motivation-page * { scroll-behavior:auto; transition:none; animation:none; } }
@media(min-width:901px) and (max-height:820px) {
 .motivation-page { gap:10px; padding:16px; }.motivation-heading { padding:8px 18px; }.motivation-title h1 { font-size:26px; margin:3px 0; }.motivation-title p { font-size:12px; }
 .motivation-metrics { gap:10px; }.motivation-metric { padding:6px 16px; }.motivation-metric>span { font-size:12px; }.motivation-metric>strong { font-size:36px; margin:1px 0; line-height:1.05; }.motivation-month-grid .motivation-metric { padding-left:72px; }.motivation-metric-icon { left:16px; width:28px; height:28px; padding:8px; }.motivation-metric p { font-size:11px; }
 .motivation-project-list header { padding:9px 14px; }.motivation-project-list h3 { font-size:14px; }.motivation-project-list li { padding:8px 0; }.motivation-project-list strong { font-size:15px; }
 .motivation-page:has(>.motivation-warning) .motivation-title p { display:none; }
 .motivation-page:has(>.motivation-warning) .motivation-metric { padding-block:4px; }
 .motivation-page:has(>.motivation-warning) .motivation-metric>strong { font-size:32px; margin:0; line-height:1; }
 .motivation-impact { padding:20px; }.motivation-impact h2 { font-size:26px; margin:8px 0; }.motivation-impact p { font-size:12px; }.motivation-impact-number { font-size:52px; margin:12px 0; }.motivation-equivalent { padding-top:10px; }.motivation-equivalent strong { font-size:17px; }
}

@media(prefers-contrast:more) { .motivation-page button { border-width:2px; }.motivation-project-list,.motivation-updates,.motivation-news { border:2px solid #d6cddd; } }
