/* /Components/Layout/MainLayout.razor.rz.scp.css */ .app[b-i18pzlogrz]{ display:grid; grid-template-columns:300px 1fr; min-height:100vh; background:var(--bg); transition:grid-template-columns .16s ease; } /* COLLAPSED NAVIGATION — an app-wide state, set on by js/nav.js. 68px is the icon rail: an 18px glyph inside the sidebar's own 1.12 zoom, centred, with enough padding either side to stay a comfortable click target. Everything the rail hides is still in the DOM and still reachable — see NavMenu.razor.css. */ html.nav-collapsed .app[b-i18pzlogrz]{grid-template-columns:68px 1fr;} @media(prefers-reduced-motion:reduce){.app[b-i18pzlogrz]{transition:none;}} .side[b-i18pzlogrz]{ background:var(--surface); border-right:1px solid var(--line); position:sticky; top:0; height:100vh; overflow:auto; } .main[b-i18pzlogrz]{min-width:0;} .content[b-i18pzlogrz]{ max-width:1240px; margin:0 auto; padding:30px 26px 70px; zoom:1.15; /* guaranteed uniform enlargement of ALL page content (Leon: bigger) */ } @media(max-width:820px){ /* The phone layout stacks the nav above the content, so there is no side column to reclaim — the collapsed state is switched off entirely rather than producing a 68px stripe. */ .app[b-i18pzlogrz],html.nav-collapsed .app[b-i18pzlogrz]{grid-template-columns:1fr;} .side[b-i18pzlogrz]{position:static;height:auto;border-right:0;border-bottom:1px solid var(--line);} } #blazor-error-ui[b-i18pzlogrz]{ display:none; position:fixed;bottom:0;left:0;right:0; background:var(--red-bg);color:var(--red); border-top:1px solid var(--red); padding:10px 16px;font-size:13px;font-weight:600;z-index:60; } #blazor-error-ui .reload[b-i18pzlogrz]{color:var(--red);font-weight:800;margin-left:8px;} #blazor-error-ui .dismiss[b-i18pzlogrz]{cursor:pointer;float:right;} /* ══ SCORECARD FOCUS WORKSPACE ═════════════════════════════════════════════════════════════════ An APPLICATION-level takeover, not the browser Fullscreen API: the address bar, tabs and back button all stay. Two things change, and between them they are the whole feature — 1. the navigation column goes, and 2. the content's reading-width cap goes. (2) is the one that actually matters. 1240px is the right measure for prose; on a management grid it was throwing away ~170px at 1920 and every one of those pixels is a week column. Set on by js/scorecardfit.js so the meeting room can later launch the same workspace over its own navigation without either page owning an overlay. */ /* ⚠ ONE COLUMN, NOT "0 1fr". With the sidebar display:none'd there is only ONE grid item left, so a two-column template puts .main in the ZERO-width first column and the grid pane measures 0 — which made the fit calculation fall back to a single week and stacked every frozen summary column on top of the others. Collapsing the template to a single track is the fix. */ html.sc-focus .app[b-i18pzlogrz] { grid-template-columns: 1fr; } html.sc-focus .side[b-i18pzlogrz] { display: none; } html.sc-focus .content[b-i18pzlogrz] { max-width: none; padding: 12px 16px 40px; } /* /Components/Layout/NavMenu.razor.rz.scp.css */ .brand[b-rr2rwh9xoq]{ display:flex;align-items:center;gap:11px; padding:20px 18px 18px;border-bottom:1px solid var(--line); } .brand .mark-img[b-rr2rwh9xoq]{ width:34px;height:34px;border-radius:9px;flex:none;display:block; } .brand .name[b-rr2rwh9xoq]{font-weight:800;font-size:20px;letter-spacing:-.01em;color:var(--ink);} .brand .pag[b-rr2rwh9xoq]{display:block;height:22px;width:auto;max-width:100%;margin-top:5px;object-fit:contain;} /* Text stand-in when a tenant has no LogoUrl (the normal state for a new tenant). Occupies the same slot as the logo so the sidebar does not reflow. */ .brand .pag-name[b-rr2rwh9xoq]{display:block;margin-top:5px;font-size:13px;font-weight:700;line-height:22px; color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;} .brand[b-rr2rwh9xoq],.nav[b-rr2rwh9xoq],.foot[b-rr2rwh9xoq]{zoom:1.12;} /* match the content enlargement (Leon: bigger) */ .nav[b-rr2rwh9xoq]{display:flex;flex-direction:column;padding:12px 10px;gap:2px;} [b-rr2rwh9xoq] .link{ display:flex;align-items:center;gap:11px; padding:10px 12px;border-radius:9px; color:var(--muted);font-weight:600;font-size:18px;text-decoration:none; } [b-rr2rwh9xoq] .link:hover{background:var(--surface2);color:var(--ink);} [b-rr2rwh9xoq] .link.active{background:var(--accent-soft);color:var(--accent);} [b-rr2rwh9xoq] .link .ic{width:18px;text-align:center;font-size:15.5px;} .foot[b-rr2rwh9xoq]{margin-top:auto;padding:16px 18px;border-top:1px solid var(--line);} .foot .q[b-rr2rwh9xoq]{font-size:13px;color:var(--muted);font-style:italic;line-height:1.5;} /* ══ THE COLLAPSE TOGGLE ═══════════════════════════════════════════════════════════════════════ Sits above the brand and stays in the same place in both states, so the control that changes the sidebar does not itself move when it is used. */ .navtoggle[b-rr2rwh9xoq]{ position:absolute;top:10px;right:8px;z-index:2; width:26px;height:26px;padding:0; display:flex;align-items:center;justify-content:center; background:var(--surface);border:1px solid var(--line);border-radius:8px; color:var(--muted);cursor:pointer;line-height:1; } .navtoggle:hover[b-rr2rwh9xoq],.navtoggle:focus-visible[b-rr2rwh9xoq]{color:var(--accent);border-color:var(--accent);} .navtoggle-ic[b-rr2rwh9xoq]{font-size:12px;display:block;transition:transform .16s ease;} html.nav-collapsed .navtoggle[b-rr2rwh9xoq]{right:auto;left:50%;transform:translateX(-50%);} html.nav-collapsed .navtoggle-ic[b-rr2rwh9xoq]{transform:rotate(180deg);} @media(prefers-reduced-motion:reduce){.navtoggle-ic[b-rr2rwh9xoq]{transition:none;}} /* ══ THE COLLAPSED RAIL ════════════════════════════════════════════════════════════════════════ ⚠ CLIPPED, NOT REMOVED. Every label keeps its box in the accessibility tree — display:none would take the seven link names away from a screen reader as well as from the eye, and the point of the rail is to save WIDTH, not to publish less navigation. */ html.nav-collapsed .lbl[b-rr2rwh9xoq], html.nav-collapsed .brandtext[b-rr2rwh9xoq], html.nav-collapsed .whoami[b-rr2rwh9xoq], html.nav-collapsed .foot .q[b-rr2rwh9xoq]{ position:absolute;width:1px;height:1px;margin:-1px;padding:0; overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0; } html.nav-collapsed .brand[b-rr2rwh9xoq]{ padding:44px 0 14px;justify-content:center;gap:0; } html.nav-collapsed .nav[b-rr2rwh9xoq]{padding:12px 8px;} html.nav-collapsed .nav[b-rr2rwh9xoq] .link{justify-content:center;gap:0;padding:10px 0;} html.nav-collapsed .nav[b-rr2rwh9xoq] .link .ic{width:auto;font-size:17px;} html.nav-collapsed .foot[b-rr2rwh9xoq]{padding:12px 8px;} html.nav-collapsed .foot[b-rr2rwh9xoq] .signout{text-align:center !important;justify-content:center;} /* The phone layout stacks the nav above the content — there is no side column to reclaim, so the control that reclaims it does not belong on screen. */ @media(max-width:820px){.navtoggle[b-rr2rwh9xoq]{display:none;}} /* /Components/Layout/ReconnectModal.razor.rz.scp.css */ .components-reconnect-first-attempt-visible[b-tu62m4w34a], .components-reconnect-repeated-attempt-visible[b-tu62m4w34a], .components-reconnect-failed-visible[b-tu62m4w34a], .components-pause-visible[b-tu62m4w34a], .components-resume-failed-visible[b-tu62m4w34a], .components-rejoining-animation[b-tu62m4w34a] { display: none; } #components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-tu62m4w34a], #components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-tu62m4w34a], #components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-tu62m4w34a], #components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-tu62m4w34a], #components-reconnect-modal.components-reconnect-retrying[b-tu62m4w34a], #components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-tu62m4w34a], #components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-tu62m4w34a], #components-reconnect-modal.components-reconnect-failed[b-tu62m4w34a], #components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-tu62m4w34a] { display: block; } #components-reconnect-modal[b-tu62m4w34a] { background-color: white; width: 20rem; margin: 20vh auto; padding: 2rem; border: 0; border-radius: 0.5rem; box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3); opacity: 0; transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete; animation: components-reconnect-modal-fadeOutOpacity-b-tu62m4w34a 0.5s both; &[open] { animation: components-reconnect-modal-slideUp-b-tu62m4w34a 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-tu62m4w34a 0.5s ease-in-out 0.3s; animation-fill-mode: both; } } #components-reconnect-modal[b-tu62m4w34a]::backdrop { background-color: rgba(0, 0, 0, 0.4); animation: components-reconnect-modal-fadeInOpacity-b-tu62m4w34a 0.5s ease-in-out; opacity: 1; } @keyframes components-reconnect-modal-slideUp-b-tu62m4w34a { 0% { transform: translateY(30px) scale(0.95); } 100% { transform: translateY(0); } } @keyframes components-reconnect-modal-fadeInOpacity-b-tu62m4w34a { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes components-reconnect-modal-fadeOutOpacity-b-tu62m4w34a { 0% { opacity: 1; } 100% { opacity: 0; } } .components-reconnect-container[b-tu62m4w34a] { display: flex; flex-direction: column; align-items: center; gap: 1rem; } #components-reconnect-modal p[b-tu62m4w34a] { margin: 0; text-align: center; } #components-reconnect-modal button[b-tu62m4w34a] { border: 0; background-color: #6b9ed2; color: white; padding: 4px 24px; border-radius: 4px; } #components-reconnect-modal button:hover[b-tu62m4w34a] { background-color: #3b6ea2; } #components-reconnect-modal button:active[b-tu62m4w34a] { background-color: #6b9ed2; } .components-rejoining-animation[b-tu62m4w34a] { position: relative; width: 80px; height: 80px; } .components-rejoining-animation div[b-tu62m4w34a] { position: absolute; border: 3px solid #0087ff; opacity: 1; border-radius: 50%; animation: components-rejoining-animation-b-tu62m4w34a 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite; } .components-rejoining-animation div:nth-child(2)[b-tu62m4w34a] { animation-delay: -0.5s; } @keyframes components-rejoining-animation-b-tu62m4w34a { 0% { top: 40px; left: 40px; width: 0; height: 0; opacity: 0; } 4.9% { top: 40px; left: 40px; width: 0; height: 0; opacity: 0; } 5% { top: 40px; left: 40px; width: 0; height: 0; opacity: 1; } 100% { top: 0px; left: 0px; width: 80px; height: 80px; opacity: 0; } } /* /Components/Pages/L10Room.razor.rz.scp.css */ /* L10 meeting room — ported from the mockup, scoped, at the 18px readability scale. */ .app[b-99zp0kbjkb]{display:grid;grid-template-columns:320px 1fr;min-height:100vh;background:var(--bg);color:var(--ink);zoom:1.12;} .rail[b-99zp0kbjkb]{background:var(--surface);border-right:1px solid var(--line);padding:20px 16px;position:sticky;top:0;align-self:start;height:100vh;overflow:auto;} .mt[b-99zp0kbjkb]{font-size:15px;color:var(--muted);font-weight:700;line-height:1.4;} .mt b[b-99zp0kbjkb]{color:var(--ink);font-size:17px;display:block;letter-spacing:-.01em;} .exit[b-99zp0kbjkb]{display:inline-block;margin-bottom:12px;color:var(--muted);text-decoration:none;font-size:15px;font-weight:700;} .exit:hover[b-99zp0kbjkb]{color:var(--accent);} .timer[b-99zp0kbjkb]{margin:14px 0;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--surface2);text-align:center;} .timer .now[b-99zp0kbjkb]{font-size:15px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:800;} .timer .clock[b-99zp0kbjkb]{font-family:var(--mono);font-size:34px;font-weight:800;letter-spacing:-.02em;margin:4px 0 2px;font-variant-numeric:tabular-nums;} .timer .clock.danger[b-99zp0kbjkb]{color:var(--red);} .timer .budget[b-99zp0kbjkb]{font-size:15px;color:var(--muted);} .timer .bar[b-99zp0kbjkb]{height:6px;border-radius:99px;background:var(--line);overflow:hidden;margin-top:9px;} .timer .fill[b-99zp0kbjkb]{height:100%;background:var(--accent);border-radius:99px;transition:width .5s linear;} .timer .fill.over[b-99zp0kbjkb]{background:var(--red);} .agenda[b-99zp0kbjkb]{display:flex;flex-direction:column;gap:4px;margin-top:6px;} .ag[b-99zp0kbjkb]{display:flex;align-items:center;gap:9px;padding:10px 10px;border-radius:10px;cursor:pointer;border:1px solid transparent;text-align:left;background:transparent;color:inherit;font-family:inherit;width:100%;} .ag:hover[b-99zp0kbjkb]{background:var(--surface2);} .ag.on[b-99zp0kbjkb]{background:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 35%,transparent);} .ag .num[b-99zp0kbjkb]{width:22px;height:22px;border-radius:50%;background:var(--surface2);color:var(--muted);font-size:15px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none;font-family:var(--mono);} .ag.on .num[b-99zp0kbjkb]{background:var(--accent);color:#fff;} .ag.done .num[b-99zp0kbjkb]{background:var(--green);color:#fff;} .ag .lab[b-99zp0kbjkb]{flex:1;font-size:16.5px;font-weight:700;line-height:1.2;} .ag .min[b-99zp0kbjkb]{font-size:15px;color:var(--muted);font-family:var(--mono);} .rtag[b-99zp0kbjkb]{font-size:15px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;padding:2px 5px;border-radius:5px;margin-left:6px;display:inline-block;} .r-review[b-99zp0kbjkb]{background:var(--accent-soft);color:var(--accent);} .r-measure[b-99zp0kbjkb]{background:var(--amber-bg);color:var(--amber);} .r-decide[b-99zp0kbjkb]{background:var(--green-bg);color:var(--green);} .prev[b-99zp0kbjkb]{margin-top:18px;padding:13px;border:1px dashed var(--line);border-radius:12px;font-size:15px;color:var(--muted);} .prev b[b-99zp0kbjkb]{color:var(--ink);} .live[b-99zp0kbjkb]{display:flex;align-items:center;gap:7px;margin-top:14px;font-size:15px;color:var(--muted);font-weight:700;} .live .pip[b-99zp0kbjkb]{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px var(--green-bg);} .main[b-99zp0kbjkb]{padding:26px 32px 100px;max-width:1320px;} .sec-head[b-99zp0kbjkb]{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:4px;} .sec-head h1[b-99zp0kbjkb]{font-size:31px;font-weight:800;letter-spacing:-.02em;margin:0;} .sec-head .min[b-99zp0kbjkb]{font-family:var(--mono);color:var(--muted);font-size:17.5px;} .sec-sub[b-99zp0kbjkb]{color:var(--muted);font-size:17.5px;margin:0 0 20px;} .navbtns[b-99zp0kbjkb]{display:flex;justify-content:space-between;margin-top:30px;gap:12px;} .btn[b-99zp0kbjkb]{border:1px solid var(--line);background:var(--surface);color:var(--ink);font-weight:700;font-size:16.5px;padding:10px 16px;border-radius:10px;cursor:pointer;font-family:inherit;} .btn:hover[b-99zp0kbjkb]{background:var(--surface2);} .btn.primary[b-99zp0kbjkb]{background:var(--accent);color:#fff;border-color:var(--accent);} .btn.primary:hover[b-99zp0kbjkb]{filter:brightness(1.06);} .btn.sm[b-99zp0kbjkb]{padding:6px 11px;font-size:15px;} .btn:disabled[b-99zp0kbjkb]{opacity:.4;cursor:default;} .mini[b-99zp0kbjkb]{border:1px solid var(--red);border-radius:9px;padding:3px 10px;font-size:15px;font-weight:800;cursor:pointer;background:transparent;font-family:inherit;color:var(--red);} .mini:hover[b-99zp0kbjkb]{background:var(--red-bg);} .mini.resolve[b-99zp0kbjkb]{color:var(--accent);border-color:var(--accent);} .mini.resolve:hover[b-99zp0kbjkb]{background:var(--accent-soft);} .grid[b-99zp0kbjkb]{display:grid;gap:14px;} .cols3[b-99zp0kbjkb]{grid-template-columns:repeat(3,1fr);} .cols2[b-99zp0kbjkb]{grid-template-columns:repeat(2,1fr);} @media(max-width:900px){.cols3[b-99zp0kbjkb],.cols2[b-99zp0kbjkb]{grid-template-columns:1fr;}} [b-99zp0kbjkb] .card{background:var(--surface);border:1px solid var(--line);border-radius:13px;padding:16px;box-shadow:var(--shadow);} [b-99zp0kbjkb] .card + .card{margin-top:14px;} .who[b-99zp0kbjkb]{font-size:15px;color:var(--muted);font-family:var(--mono);text-transform:uppercase;letter-spacing:.05em;} [b-99zp0kbjkb] .card p{margin:8px 0 0;font-size:16.5px;color:var(--muted);line-height:1.5;} [b-99zp0kbjkb] .card p b{color:var(--ink);font-weight:600;} [b-99zp0kbjkb] .grpname{font-size:15px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--accent);margin:16px 0 6px;} [b-99zp0kbjkb] .grpname:first-child{margin-top:0;} .deptsub[b-99zp0kbjkb]{font-size:13.5px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--accent);margin:18px 0 4px;padding:6px 12px;background:var(--surface2);border-radius:7px;} .deptsub2[b-99zp0kbjkb]{display:inline-block;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:10px 0 2px;padding:3px 10px;background:color-mix(in srgb,var(--surface2) 55%,transparent);border:1px solid var(--line);border-radius:6px;} /* Q2 Financial Rocks: editable numbers, auto-summed totals. Actuals color red (below goal) / green (at/above). */ /* Company-as-a-whole summary line - colored roll-up; department detail sits plain below it */ .finhead[b-99zp0kbjkb]{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-weight:800;font-size:14.5px;margin:6px 0 6px;background:var(--green-bg);border-radius:10px;padding:9px 12px;} .fintot[b-99zp0kbjkb]{font-weight:600;font-size:13px;color:var(--muted);display:inline-flex;flex-wrap:wrap;align-items:center;gap:5px;} .finkind[b-99zp0kbjkb]{font-weight:800;font-size:13px;color:var(--ink);} .finrow[b-99zp0kbjkb]{display:flex;gap:10px;padding:7px 0;border-top:1px solid var(--line);align-items:center;flex-wrap:wrap;} .fincat[b-99zp0kbjkb]{font-weight:800;min-width:64px;color:var(--accent);} .finline[b-99zp0kbjkb]{flex:1;min-width:0;display:flex;align-items:center;gap:7px;flex-wrap:wrap;} .finlbl[b-99zp0kbjkb]{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:800;} [b-99zp0kbjkb] .finslash{color:var(--muted);opacity:.6;} [b-99zp0kbjkb] .finin{width:94px;padding:4px 7px;border:1px solid var(--line);border-radius:6px;font-family:var(--mono);font-size:13px;background:var(--surface);color:var(--ink);font-weight:700;} [b-99zp0kbjkb] .finin.neg{color:var(--red);border-color:color-mix(in srgb,var(--red) 40%,var(--line));} [b-99zp0kbjkb] .finin.pos{color:var(--green);border-color:color-mix(in srgb,var(--green) 40%,var(--line));} .finpct[b-99zp0kbjkb]{margin-left:auto;font-weight:800;font-family:var(--mono);font-size:13px;white-space:nowrap;color:var(--muted);} .finmargin[b-99zp0kbjkb]{flex-basis:100%;font-family:var(--mono);font-size:12px;font-weight:700;color:var(--accent);opacity:.9;white-space:nowrap;margin:2px 0 0 74px;} [b-99zp0kbjkb] .finpend{font-style:italic;color:var(--amber);font-weight:700;font-family:inherit;} /* Rate-the-quarter optional comment: present but deliberately understated (dashed, muted, empty) */ .raterow .ratecmt[b-99zp0kbjkb]{flex:1;min-width:80px;font-size:13px;line-height:1.4;padding:5px 8px;border:1px dashed var(--line);opacity:.6;height:auto;min-height:32px;background:transparent;resize:none;field-sizing:content;overflow-y:hidden;} .raterow .ratecmt:focus[b-99zp0kbjkb]{opacity:1;border-color:var(--accent);} .rocknote[b-99zp0kbjkb]{font-size:12px;color:var(--muted);font-style:italic;font-weight:500;background:transparent;border-left:2px solid var(--line);border-radius:0;padding:1px 0 1px 8px;margin-top:3px;} /* V/TO: let the numbers that matter stand out; live annual-progress callout */ .vtotext[b-99zp0kbjkb]{color:var(--ink);font-size:16px;line-height:1.65;} .vtonum[b-99zp0kbjkb]{color:var(--accent);font-weight:800;font-variant-numeric:tabular-nums;} .vtoprogress[b-99zp0kbjkb]{margin-top:10px;padding:12px 16px;background:var(--green-bg);border-radius:10px;max-width:420px;} .vtoproglabel[b-99zp0kbjkb]{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--green);font-weight:800;margin-bottom:8px;} .vtoproghead[b-99zp0kbjkb]{display:grid;grid-template-columns:1fr 80px 80px;gap:8px;margin-bottom:2px;} .vtoproghead span[b-99zp0kbjkb]{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);text-align:right;} .vtoprogrow[b-99zp0kbjkb]{display:grid;grid-template-columns:1fr 80px 80px;gap:8px;align-items:baseline;padding:3px 0;} .vtoprogname[b-99zp0kbjkb]{font-weight:800;color:var(--ink);font-size:14.5px;} .vtoprogpct[b-99zp0kbjkb]{font-size:15px;font-weight:800;color:var(--green);font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right;} .vtoprogtot[b-99zp0kbjkb]{border-top:1px solid color-mix(in srgb,var(--green) 28%,transparent);margin-top:4px;padding-top:6px;} .vtoprogtot .vtoprogname[b-99zp0kbjkb]{color:var(--green);} /* Marketing strategy: bold headers with indented sub-items */ .vtomkt[b-99zp0kbjkb]{font-size:15px;line-height:1.5;color:var(--ink);} .vtomkthead[b-99zp0kbjkb]{font-weight:800;font-size:15.5px;color:var(--ink);margin:2px 0;} .vtomktsub[b-99zp0kbjkb]{font-weight:600;color:var(--muted);font-size:13.5px;} .vtomktitem[b-99zp0kbjkb]{padding-left:20px;margin:1px 0;} .vtomktgap[b-99zp0kbjkb]{height:10px;} /* 1-Year plan: annual goals synced from the pacing tool */ .vtoyr[b-99zp0kbjkb]{font-size:15px;line-height:1.4;} .vtoyrline[b-99zp0kbjkb]{margin-top:4px;color:var(--ink);} .vtoyrlabel[b-99zp0kbjkb]{font-weight:800;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em;margin-right:6px;} .vtoyrbreak[b-99zp0kbjkb]{padding-left:8px;margin:2px 0;display:flex;flex-wrap:wrap;gap:3px 18px;} .vtoyrdept[b-99zp0kbjkb]{color:var(--muted);font-size:14px;} .vtosrc[b-99zp0kbjkb]{font-size:11.5px;color:var(--muted);font-style:italic;margin-top:8px;} /* Q2 financial review - one clean, full-width row per line: COMPANY summary + each department */ [b-99zp0kbjkb] .finsection{margin-top:6px;} [b-99zp0kbjkb] .finsec-head{font-size:13.5px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--accent);margin:16px 0 4px;padding:6px 12px;background:var(--surface2);border-radius:7px;} /* SIX COLUMNS NOW — the trailing one is GAP (sales / GM still to make). Added by narrowing the two goal/actual columns rather than widening the table: the card must not get materially wider or the room scrolls sideways. The gap column is the narrowest because it carries two short figures. */ [b-99zp0kbjkb] .fintable{--fincols:minmax(92px,.78fr) minmax(136px,1.3fr) minmax(136px,1.3fr) minmax(84px,.85fr) minmax(78px,.78fr) minmax(96px,.95fr);} [b-99zp0kbjkb] .finhdr2{display:grid;grid-template-columns:var(--fincols);gap:14px;padding:2px 12px 5px;} [b-99zp0kbjkb] .finhdr2 span{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);} [b-99zp0kbjkb] .finhdr2 span:nth-child(n+4){text-align:right;} [b-99zp0kbjkb] .finrow2{display:grid;grid-template-columns:var(--fincols);gap:14px;align-items:center;padding:8px 12px;border-top:1px solid var(--line);} [b-99zp0kbjkb] .finrow2.fincompany{background:var(--green-bg);border-radius:10px;border-top:0;margin-bottom:3px;} [b-99zp0kbjkb] .fincat2{font-size:18px;font-weight:800;color:var(--ink);display:flex;flex-direction:column;line-height:1.15;} [b-99zp0kbjkb] .fincompany .fincat2{color:var(--green);} [b-99zp0kbjkb] .fincapt{font-size:10px;font-weight:700;color:var(--muted);text-transform:none;letter-spacing:0;margin-top:1px;} [b-99zp0kbjkb] .fincell{display:flex;align-items:center;gap:6px;min-width:0;} [b-99zp0kbjkb] .fincell .finin{flex:1;min-width:0;width:auto;} [b-99zp0kbjkb] .fincellro{font-family:var(--mono);font-weight:800;font-size:14px;} [b-99zp0kbjkb] .fingm2{font-family:var(--mono);font-size:12.5px;font-weight:800;color:var(--accent);white-space:nowrap;text-align:right;} [b-99zp0kbjkb] .finach2{font-family:var(--mono);font-size:12.5px;font-weight:800;color:var(--muted);white-space:nowrap;text-align:right;} @media(max-width:820px){[b-99zp0kbjkb] .fintable{overflow-x:auto;}[b-99zp0kbjkb] .finhdr2,[b-99zp0kbjkb] .finrow2{min-width:700px;}} [b-99zp0kbjkb] .fin-under{color:var(--red);font-weight:800;font-family:var(--mono);} [b-99zp0kbjkb] .fin-over{color:var(--green);font-weight:800;font-family:var(--mono);} .rockmeta[b-99zp0kbjkb]{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:3px;} .rockmeta .m[b-99zp0kbjkb]{margin:0;} .row.subrock[b-99zp0kbjkb]{padding:3px 0;} .row.subrock .t[b-99zp0kbjkb]{font-weight:500;font-size:16px;color:var(--ink);} /* Rock-review partial %: the "½" becomes an editable percentage that drives the score */ .pctwrap[b-99zp0kbjkb]{display:inline-flex;align-items:center;gap:2px;font-weight:800;color:var(--accent);font-size:15px;} .pctin[b-99zp0kbjkb]{width:48px;padding:5px 4px;border:1.5px solid var(--accent);border-radius:8px;font-size:15px;font-weight:800;text-align:center;font-family:inherit;color:var(--accent);background:var(--surface);appearance:textfield;-moz-appearance:textfield;} .pctin[b-99zp0kbjkb]::-webkit-outer-spin-button,.pctin[b-99zp0kbjkb]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;} /* Rock-review status on the LEFT (matches the to-do checkbox cadence): Done checkbox, Not done, Partial */ .row.rockrow[b-99zp0kbjkb]{align-items:flex-start;} .rockstat[b-99zp0kbjkb]{display:flex;align-items:center;gap:7px;flex:0 0 auto;margin-top:2px;} .rockstat .chk[b-99zp0kbjkb]{width:22px;height:22px;font-size:16px;} .ministate[b-99zp0kbjkb]{font-size:13px;font-weight:700;padding:5px 10px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--muted);cursor:pointer;font-family:inherit;white-space:nowrap;} .ministate:hover[b-99zp0kbjkb]{border-color:var(--accent);color:var(--accent);} .ministate.on[b-99zp0kbjkb]{background:var(--surface2);color:var(--ink);border-color:var(--muted);font-weight:800;} [b-99zp0kbjkb] .hint{color:var(--accent);cursor:help;font-size:14px;font-weight:700;opacity:.75;} [b-99zp0kbjkb] .hint:hover{opacity:1;} /* Financial rock pacing tool (Set Rocks) - one clean table per section */ .pacesectionhead[b-99zp0kbjkb]{font-size:13.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--accent);margin:18px 0 6px;padding-bottom:5px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;} .paceset-btn[b-99zp0kbjkb]{text-transform:none;letter-spacing:0;font-weight:700;flex:none;} .pacesection:first-of-type .pacesectionhead[b-99zp0kbjkb]{margin-top:6px;} .pacescroll[b-99zp0kbjkb]{overflow-x:auto;} table.pace2[b-99zp0kbjkb]{width:100%;border-collapse:collapse;min-width:600px;} table.pace2 th[b-99zp0kbjkb]{font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);text-align:right;padding:0 8px 7px;white-space:nowrap;} table.pace2 th:first-child[b-99zp0kbjkb]{text-align:left;} table.pace2 td[b-99zp0kbjkb]{padding:4px 8px;text-align:right;font-size:13.5px;vertical-align:middle;} td.pacemetric[b-99zp0kbjkb]{text-align:left;font-weight:700;color:var(--muted);font-size:12.5px;padding-left:18px;} tr.pacegrp td[b-99zp0kbjkb]{background:var(--surface2);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);padding:5px 10px;text-align:left;} /* Company total = summary roll-up: green background */ tr.pacegrp.pacetot td[b-99zp0kbjkb]{background:var(--green-bg);color:var(--green);} tr.pacetotrow td[b-99zp0kbjkb]{font-weight:800;color:var(--ink);font-family:var(--mono);font-variant-numeric:tabular-nums;background:var(--green-bg);} tr.pacetotrow td.pacemetric[b-99zp0kbjkb]{font-family:inherit;color:var(--green);} .pacegoal[b-99zp0kbjkb],.paceact[b-99zp0kbjkb],.paceset[b-99zp0kbjkb]{text-align:right;border-radius:7px;font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:700;font-size:13px;background:var(--surface);padding:4px 6px;} .pacegoal[b-99zp0kbjkb]{width:98px;border:1px solid var(--line);color:var(--ink);} .paceact[b-99zp0kbjkb]{width:96px;border:1px solid var(--line);color:var(--green);} .paceset[b-99zp0kbjkb]{width:96px;border:1.5px solid var(--accent);color:var(--accent);font-weight:800;} .pacegap[b-99zp0kbjkb]{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:800;} .gap-ok[b-99zp0kbjkb]{color:var(--green);} .gap-short[b-99zp0kbjkb]{color:var(--amber);} .gap-over[b-99zp0kbjkb]{color:var(--green);} /* GM cell: dollar with its linked, editable margin % tucked to the lower-right */ .gmcell[b-99zp0kbjkb]{display:inline-flex;flex-direction:row;align-items:flex-end;justify-content:flex-end;gap:5px;} .pacepct[b-99zp0kbjkb]{width:46px;text-align:right;border:1px dashed color-mix(in srgb,var(--accent) 45%,var(--line));border-radius:6px;padding:2px 4px;font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:11px;font-weight:700;color:var(--muted);background:transparent;align-self:flex-end;} .pacepcttot[b-99zp0kbjkb]{font-size:11px;font-weight:800;color:var(--green);opacity:.9;font-family:var(--mono);font-variant-numeric:tabular-nums;align-self:flex-end;} /* single margin % lever per dept, sits in the group-header row */ td.pacegrpmargin[b-99zp0kbjkb]{text-align:right;white-space:nowrap;font-size:11px;font-weight:700;text-transform:none;letter-spacing:0;} .pacemarginlbl[b-99zp0kbjkb]{color:var(--muted);font-weight:700;font-size:10px;text-transform:uppercase;letter-spacing:.05em;margin-right:5px;} .pacemargin[b-99zp0kbjkb]{width:54px;text-align:right;border:1.5px dashed color-mix(in srgb,var(--accent) 55%,var(--line));border-radius:7px;padding:2px 6px;font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:12px;font-weight:800;color:var(--accent);background:var(--surface);} .pacemargin:focus[b-99zp0kbjkb]{outline:none;border-style:solid;} /* derived GM (Sales × margin%) - read-only, visually softer than the editable cells */ td.gmproj[b-99zp0kbjkb]{color:var(--muted);font-style:italic;} /* actual GM % achieved in a booked quarter, shown under the GM $ (goal margin lives on the dept header) */ .gmwrap[b-99zp0kbjkb]{display:flex;flex-direction:column;align-items:flex-end;gap:1px;} .pacemarginact[b-99zp0kbjkb]{font-size:10.5px;font-weight:700;color:var(--muted);font-family:var(--mono);font-variant-numeric:tabular-nums;} /* Written Contract: margin/GM not knowable until finalization */ .pacemarginna[b-99zp0kbjkb]{font-size:10.5px;font-weight:700;font-style:italic;color:var(--muted);text-transform:none;letter-spacing:0;} td.pacenanote[b-99zp0kbjkb]{text-align:left;font-size:12px;font-style:italic;color:var(--muted);padding-left:18px;} .row[b-99zp0kbjkb]{display:flex;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--line);flex-wrap:wrap;} .row:first-child[b-99zp0kbjkb]{border-top:0;} .grow[b-99zp0kbjkb]{flex:1;min-width:0;} .grow .t[b-99zp0kbjkb]{font-weight:600;font-size:17.5px;} .grow .t.done[b-99zp0kbjkb]{text-decoration:line-through;color:var(--muted);} .grow .m[b-99zp0kbjkb]{font-size:15px;color:var(--muted);font-family:var(--mono);} /* Internal reference codes (TD-/IDS-/QR-…): tiny, muted, tucked under the title. Not for the casual reader. */ /* internal identifiers (IDS-000221, QR-2026-…, DEC-…) are meaningless to the room - hidden everywhere */ .idcode[b-99zp0kbjkb]{display:none;} .linkhint[b-99zp0kbjkb]{font-size:12px;line-height:1;color:var(--accent);opacity:.75;font-weight:700;} .pill[b-99zp0kbjkb]{display:inline-block;padding:3px 10px;border-radius:999px;font-size:15px;font-weight:800;white-space:nowrap;} .p-green[b-99zp0kbjkb]{background:var(--green-bg);color:var(--green);} .p-amber[b-99zp0kbjkb]{background:var(--amber-bg);color:var(--amber);} .p-red[b-99zp0kbjkb]{background:var(--red-bg);color:var(--red);} .p-accent[b-99zp0kbjkb]{background:var(--accent-soft);color:var(--accent);} .p-muted[b-99zp0kbjkb]{background:var(--surface2);color:var(--muted);} .lbl[b-99zp0kbjkb]{font-size:15px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:800;margin-right:5px;} /* Scorecard weekly actual: mono so columns of numbers line up; the prior week sits under it as muted reference only - it is deliberately not editable, you edit that week in that week's L10. */ .scval[b-99zp0kbjkb]{width:126px;font-family:var(--mono);font-weight:700;text-align:right;} /* Period-to-date strip under a metric. "—" is a real answer here: it means we have no rule for aggregating this metric, not that the number is zero. */ .scqtd[b-99zp0kbjkb]{display:flex;flex-wrap:wrap;gap:4px 20px;margin:2px 0 10px;padding-left:2px;font-size:13px;color:var(--muted);} .scqtd b[b-99zp0kbjkb]{font-family:var(--mono);font-weight:800;color:var(--ink);margin-left:4px;} .scnote[b-99zp0kbjkb]{font-style:italic;opacity:.75;margin-left:4px;} .scprev[b-99zp0kbjkb]{display:block;font-size:12.5px;color:var(--muted);font-family:var(--mono);margin-top:3px;white-space:nowrap;} /* THE GOAL IS THE NUMBER THAT MAKES THE ACTUAL MEAN ANYTHING. It used to render inside .m - 15px, muted, mono - i.e. indistinguishable from a reference code, sitting under a 17.5px semibold metric name and losing every time. It now reads as a peer of the name: same size, heavier, in ink, with a small uppercase GOAL tag so it is still obvious WHICH number it is without a full sentence. Deliberately NOT accent-coloured - a goal is not a status. */ .scgoal[b-99zp0kbjkb]{display:flex;align-items:baseline;gap:7px;margin-top:3px;} .scgoal .scgoalv[b-99zp0kbjkb]{font-size:17.5px;font-weight:800;color:var(--ink);font-family:var(--mono);letter-spacing:-.01em;} .scgoal .scgoallbl[b-99zp0kbjkb]{font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);} /* No goal set is a QUIET state. "goal -" must not shout the absence of a target; it stays exactly as it rendered before, in .m, so the eye skips it and lands on the metrics that do have one. */ .chk[b-99zp0kbjkb]{width:20px;height:20px;border:2px solid var(--line);border-radius:6px;cursor:pointer;flex:none;display:flex;align-items:center;justify-content:center;font-size:15px;color:#fff;background:transparent;} .chk.on[b-99zp0kbjkb]{background:var(--green);border-color:var(--green);} .field[b-99zp0kbjkb]{width:100%;border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-family:inherit;font-size:16.5px;background:var(--bg);color:var(--ink);} textarea.field[b-99zp0kbjkb]{min-height:62px;resize:none;field-sizing:content;} .sel[b-99zp0kbjkb]{max-width:150px;} .addrow[b-99zp0kbjkb]{display:flex;gap:8px;align-items:center;margin-top:10px;flex-wrap:wrap;padding-top:11px;border-top:1px dashed var(--line);} .addrow .field[b-99zp0kbjkb]{flex:1;min-width:130px;} /* To-do priority indicator — a small cycling button beside the to-do, NOT a row colour. Colouring the whole row was rejected: a row already carries meaning here (done, linked, confidential) and a second full-row treatment would fight the first. This is a 22px control that sits in the row's flex line and cannot be mistaken for the row's own state. ACCESSIBILITY. Colour is the LAST cue, never the only one. The glyph differs per state (○ / ! / ‼) so the control survives greyscale and colour-blindness; title/aria-label carry the same sentence in words; and it is a real