/**/
/**/
@font-face {
font-family: "Fraunces";
font-style: normal;
font-weight: 300 700;
font-display: swap;
src: url("fonts/fraunces-latin.woff2") format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "Inter Tight";
font-style: normal;
font-weight: 300 700;
font-display: swap;
src: url("fonts/inter-tight-latin.woff2") format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: "JetBrains Mono";
font-style: normal;
font-weight: 400 600;
font-display: swap;
src: url("fonts/jetbrains-mono-latin.woff2") format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/**/
:root,
[data-theme="dark"] {
color-scheme: dark;
/**/
--bg: #071722;
--bg-2: #0B2032;
--card: #0F2A3A;
--card-2: #153341;
/**/
--fg: #F4EEE4;
--fg-soft: #C6D2DA;
--muted: #93A7B4;
--border: #1E3D4E;
--border-2: #2A5468;
/**/
--brass: #D2A25C;
--brass-2: #E3C69C;
--brass-soft: rgba(210, 162, 92, 0.10);
--ok: #4FC08D;
--warn: #E4AC4C;
--error: #EE7A64;
/**/
--info: #9DAEF7;
--unknown: #8CA0AD;
/**/
--lift: 0 1px 0 rgba(244, 238, 228, 0.04) inset, 0 1px 2px rgba(0, 0, 0, 0.32);
--shadow: 0 1px 0 rgba(244, 238, 228, 0.06) inset, 0 12px 32px -12px rgba(0, 0, 0, 0.65);
/**/
--on-brass: #16110A;
/**/
--error-ink: #C4462F;
/**/
--scrim: rgba(0, 0, 0, 0.82);
--on-scrim: #f2f4f7;
/**/
--veil-bg-2: 72%;
--veil-card: 74%;
--veil-card-2: 88%;
/**/
--font-display: Fraunces, "Iowan Old Style", Georgia, serif;
--font-sans: "Inter Tight", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
/**/
--text-2xs: 10px;
--text-xs: 11px;
--text-sm: 12px;
--text-base: 13px;
--text-md: 15px;
--text-lg: 18px;
--text-xl: 22px;
--text-2xl: 26px;
--text-3xl: 30px;
--text-touch: 16px;
/**/
--sp-1: 4px;
--sp-1-5: 6px;
--sp-2: 8px;
--sp-2-5: 10px;
--sp-3: 12px;
--sp-4: 16px;
--sp-5: 24px;
--sp-6: 32px;
/**/
--radius-sm: 0;
--radius-md: 2px;
--radius-lg: 3px;
--radius-pill: 999px;
--radius-circle: 50%;
/**/
--safe-area-top: env(safe-area-inset-top, 0px);
--safe-area-right: env(safe-area-inset-right, 0px);
--safe-area-left: env(safe-area-inset-left, 0px);
/**/
--topbar-h: calc(56px + var(--safe-area-top));
/**/
--row-h: 32px;
--row-pad: var(--sp-1);
--measure: 1440px;
}
/**/
[data-theme="light"] {
color-scheme: light;
--bg: #FBF5EC; /**/
--bg-2: #F2EADE; /**/
--card: #FFFFFF;
--card-2: #F2EADE;
--fg: #0B2032; /**/
--fg-soft: #3C4F62; /**/
--muted: #556777;
--border: #D8D0C4; /**/
--border-2: #C2B7A6;
/**/
--brass: #8A6224;
--brass-2: #6E4D1B;
--brass-soft: rgba(186, 135, 67, 0.12);
--ok: #17724A;
--info: #3F4FA8;
--warn: #8A5F14;
--error: #B8402F;
--unknown: #556777;
--lift: 0 1px 0 rgba(255, 255, 255, 0.6) inset, 0 1px 2px rgba(11, 32, 50, 0.05);
--shadow: 0 1px 0 rgba(255, 255, 255, 0.6) inset, 0 16px 40px -24px rgba(11, 32, 50, 0.22);
--on-brass: #FFFFFF;
--error-ink: #B8402F;
/**/
--veil-bg-2: 80%;
--veil-card: 84%;
--veil-card-2: 90%;
}
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
margin: 0;
font-family: var(--font-sans);
font-size: var(--text-base);
line-height: 1.45;
/**/
letter-spacing: -0.006em;
/**/
font-feature-settings: "tnum" on;
color: var(--fg);
/**/
background: transparent;
-webkit-font-smoothing: antialiased;
}
/**/
html { background: var(--bg); }
body::before {
content: ""; position: fixed; inset: 0; z-index: -2;
background-image: var(--backdrop-dusk);
background-position: 16% 72%;
background-size: max(150%, 180vh) auto;
background-repeat: no-repeat;
}
body::after {
content: ""; position: fixed; inset: 0; z-index: -1;
background: linear-gradient(180deg,
rgba(5, 17, 26, 0.80) 0%,
rgba(5, 17, 26, 0.62) 34%,
rgba(6, 20, 30, 0.60) 58%,
rgba(4, 14, 21, 0.82) 78%,
rgba(3, 12, 18, 0.92) 100%);
}
[data-theme="light"] body::before { background-image: var(--backdrop-dawn); }
[data-theme="light"] body::after {
background: linear-gradient(180deg,
rgba(251, 245, 236, 0.93) 0%,
rgba(251, 245, 236, 0.84) 40%,
rgba(250, 242, 232, 0.86) 62%,
rgba(248, 240, 229, 0.93) 100%);
}
@media print { body::before, body::after { display: none; } }
/**/
@media (prefers-reduced-data: reduce) {
body::before { background-image: none; }
[data-theme="light"] body::before { background-image: none; }
}
a { color: inherit; text-decoration: none; }
/**/
main > h2,
/**/
.page-head > h2,
.page-head-text > h2,
.login-card h1 {
font-family: var(--font-display);
font-weight: 300;
font-size: var(--text-2xl);
line-height: 1.1;
letter-spacing: -0.022em;
/**/
font-variation-settings: "opsz" 48;
}
.kpi-num, .kpi-value, .num, .prop-list dd.big, .chip b {
font-family: var(--font-display);
font-weight: 400;
font-variant-numeric: tabular-nums lining-nums;
letter-spacing: -0.02em;
font-variation-settings: "opsz" 40;
}
/**/
/**/
.pn, .setting-key, .setting-masked, kbd {
font-family: var(--font-mono);
letter-spacing: -0.02em;
}
/**/
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
outline: 2px solid var(--brass-2);
outline-offset: 2px;
border-radius: var(--radius-sm);
}
/**/
:root { --spine-w: 2px; --ease: cubic-bezier(.2, .7, .3, 1); }
/**/
main tbody tr:focus-within td,
main tbody tr:target td { background: var(--card-2); }
/**/
main tbody tr:target { scroll-margin-top: 16rem; }
main tbody tr td:first-child { position: relative; }
main tbody tr td:first-child::before {
content: ""; position: absolute; left: 0; top: 0; bottom: 0;
width: var(--spine-w); background: var(--brass);
transform: scaleY(0); transform-origin: center;
transition: transform .16s var(--ease);
}
main tbody tr:hover td:first-child::before,
main tbody tr:focus-within td:first-child::before,
main tbody tr:target td:first-child::before { transform: scaleY(1); }
/**/
.sr-only {
position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
/**/
section > h2,
section > h3,
main > h3,
.page-head + h3,
.card-title,
.kpi-band-title,
.collapsed-card > summary,
.nav-group,
.brand-sub,
.kanban-col-head,
main th,
.gantt-label-head {
font-size: var(--text-2xs);
font-weight: 500;
letter-spacing: .18em;
text-transform: uppercase;
color: var(--muted);
}
/**/
section > h2,
section > h3,
main > h3,
.page-head + h3,
.card-title,
.kpi-band-title,
.collapsed-card > summary,
.nav-group {
color: var(--brass);
}
/**/
section:not(.card) > h2,
section:not(.card) > h3,
main > h3,
.page-head + h3,
.kpi-band-title {
display: flex;
align-items: center;
gap: var(--sp-3);
}
section:not(.card) > h2::after,
section:not(.card) > h3::after,
main > h3::after,
.page-head + h3::after,
.kpi-band-title::after {
content: ""; flex: 1; height: 1px; background: var(--border-2);
transform: scaleX(0); transform-origin: left;
animation: rule-in .7s var(--ease) forwards;
}
/**/
section:nth-of-type(2):not(.card) > h2::after { animation-delay: .06s; }
section:nth-of-type(3):not(.card) > h2::after { animation-delay: .12s; }
section:nth-of-type(n+4):not(.card) > h2::after { animation-delay: .18s; }
@keyframes rule-in { to { transform: scaleX(1); } }
/**/
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: .01ms !important;
animation-delay: 0ms !important;
transition-duration: .01ms !important;
}
}
.field-grid label,
.field-grid dt,
.prop-list dt,
.filter-bar label,
.login-card label span,
.field > span,
.filter-select > span,
/**/
.control-label,
.kpi-label,
.job .jd-cl-field > span,
.note-author,
.jd-who {
font-size: var(--text-xs);
font-weight: 400;
letter-spacing: 0;
text-transform: none;
color: var(--muted);
}
/**/
.app { display: flex; min-height: 100vh; min-height: 100dvh; }
.sidebar {
flex: 0 0 240px;
width: 240px;
background: color-mix(in srgb, var(--bg-2) var(--veil-bg-2), transparent);
border-right: 1px solid var(--border);
position: sticky;
top: 0;
/**/
height: 100vh;
height: 100dvh;
overflow: hidden;
padding: var(--sp-4) var(--sp-3) var(--sp-3);
display: flex;
flex-direction: column;
z-index: 30;
}
/**/
#navToggle {
position: fixed; z-index: 31;
left: calc(240px - 20px); top: 50%; transform: translateY(-50%);
width: 40px; height: 40px; border-radius: var(--radius-circle);
background: color-mix(in srgb, var(--card) 85%, transparent);
font-size: var(--text-xl); line-height: 1;
transition: left .2s var(--ease), background .2s var(--ease);
}
/**/
html #navToggle:hover, html #navToggle:focus-visible { background: var(--card-2); }
@media (min-width: 761px) {
#menuBtn { display: none; }
.sidebar { transition: margin-left .2s var(--ease); }
main { transition: padding-left .2s var(--ease); }
html.nav-collapsed .sidebar {
margin-left: -240px; visibility: hidden;
transition: margin-left .2s var(--ease), visibility 0s .2s;
}
html.nav-collapsed #navToggle {
left: -20px; padding-left: 20px;
background: color-mix(in srgb, var(--card) 65%, transparent);
}
}
.brand { padding: var(--sp-1-5) var(--sp-2-5) var(--sp-4); }
/**/
.brand-mark {
display: inline-flex; align-items: center; justify-content: center;
width: 32px; height: 32px; border-radius: var(--radius-sm);
background: var(--brass);
color: var(--on-brass);
font-family: var(--font-display); font-weight: 500; font-size: var(--text-lg);
vertical-align: middle; margin-right: var(--sp-2-5);
}
.brand-name { font-weight: 600; font-size: var(--text-md); letter-spacing: -.01em; }
.brand-sub { display: block; margin: var(--sp-1-5) 0 0 42px; font-size: var(--text-2xs); }
.nav { display: flex; flex-direction: column; gap: 2px; flex: 1; }
/**/
.sidebar .nav { min-height: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
.nav-group { margin: var(--sp-4) var(--sp-3) var(--sp-1-5); }
.nav-item {
display: flex; align-items: center; gap: var(--sp-2-5); position: relative;
padding: var(--sp-2) var(--sp-3); border-radius: var(--radius-md); color: var(--fg-soft);
font-size: var(--text-base); transition: background .12s var(--ease), color .12s var(--ease);
}
.nav-item:hover { background: var(--card); color: var(--fg); }
/**/
.nav-item.active { background: var(--card); color: var(--fg); font-weight: 500; }
.nav-item.active::before,
.nav-item:focus-within::before {
content: ""; position: absolute; left: 0; top: 5px; bottom: 5px;
width: var(--spine-w); background: var(--brass);
}
.nav-ico { width: 16px; text-align: center; font-size: var(--text-sm); color: var(--muted); }
.nav-item.active .nav-ico { color: var(--brass); }
.sidebar-foot {
margin-top: var(--sp-2-5); padding: var(--sp-2-5) var(--sp-3); font-size: var(--text-sm); color: var(--muted);
border-top: 1px solid var(--border); display: flex; align-items: center; gap: var(--sp-2);
}
.main-wrap { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.topbar {
height: var(--topbar-h); flex: 0 0 var(--topbar-h);
display: flex; align-items: center; gap: var(--sp-3);
padding: var(--safe-area-top)
calc(var(--sp-5) + var(--safe-area-right))
0
calc(var(--sp-5) + var(--safe-area-left));
background: color-mix(in srgb, var(--bg) 85%, transparent);
border-bottom: 1px solid var(--border);
position: sticky; top: 0; z-index: 20;
backdrop-filter: blur(8px);
}
.crumbs { margin: 0; font-weight: 500; font-size: var(--text-base); color: var(--fg-soft); }
.topbar-actions { margin-left: auto; display: flex; align-items: center; gap: var(--sp-2); }
/**/
.kbar {
display: flex; align-items: center; gap: var(--sp-2);
height: 28px; padding: 0 var(--sp-2) 0 var(--sp-2-5); min-width: 200px;
background: var(--card); border: 1px solid var(--border);
border-radius: var(--radius-md); color: var(--muted); font-size: var(--text-sm);
transition: border-color .12s var(--ease), color .12s var(--ease);
}
.kbar:hover { border-color: var(--brass); color: var(--fg-soft); }
/**/
#accountBtn.account-btn {
display: flex; align-items: center; gap: var(--sp-2);
height: 28px; padding: 0 var(--sp-2) 0 var(--sp-1);
background: var(--card); border: 1px solid var(--border);
border-radius: var(--radius-md); color: var(--muted); font-size: var(--text-sm);
font-weight: 500; cursor: pointer;
transition: border-color .12s var(--ease), color .12s var(--ease);
}
#accountBtn.account-btn:hover,
#accountBtn.account-btn[aria-expanded="true"] {
border-color: var(--brass); color: var(--fg-soft);
}
.account-avatar {
width: 20px; height: 20px; flex: 0 0 20px;
display: flex; align-items: center; justify-content: center;
border-radius: var(--radius-circle); background: var(--card-2);
color: var(--brass-2); font-size: var(--text-xs); font-weight: 600;
}
/**/
.account-name { max-width: 14ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-caret { font-size: var(--text-2xs); }
/**/
.account-menu {
position: fixed; inset: auto; top: calc(var(--topbar-h) - 4px);
right: calc(24px + var(--safe-area-right));
margin: 0; padding: var(--sp-1); min-width: 200px;
background: var(--card); border: 1px solid var(--border-2);
border-radius: var(--radius-lg); box-shadow: var(--shadow); color: var(--fg);
}
.account-who {
padding: var(--sp-2) var(--sp-2-5) var(--sp-2-5); border-bottom: 1px solid var(--border);
margin-bottom: var(--sp-1); display: flex; flex-direction: column; gap: 2px;
}
.account-who b { font-size: var(--text-base); color: var(--fg); }
.account-role { font-size: var(--text-xs); color: var(--muted); }
#accountMenu .account-item {
display: flex; align-items: center; width: 100%;
padding: var(--sp-1-5) var(--sp-2-5); border: 0; border-radius: var(--radius-md);
background: transparent; color: var(--fg-soft);
font-size: var(--text-base); font-weight: 400; text-align: left; cursor: pointer;
transition: background .12s var(--ease), color .12s var(--ease);
}
#accountMenu .account-item:hover,
#accountMenu .account-item:focus-visible { background: var(--card-2); color: var(--fg); }
/**/
#accountMenu .account-out { margin-top: var(--sp-1); border-top: 1px solid var(--border); }
kbd {
font-size: var(--text-2xs); font-weight: 500; letter-spacing: 0;
padding: 1px var(--sp-1); margin-left: auto; color: var(--fg-soft);
background: var(--card-2); border: 1px solid var(--border-2);
border-radius: var(--radius-sm);
}
.nav-backdrop { display: none; }
tr[onclick] { cursor: pointer; } /**/
.icon-btn {
border: 1px solid var(--border-2); background: var(--card);
color: var(--fg-soft); cursor: pointer; border-radius: var(--radius-md);
width: 34px; height: 34px; font-size: var(--text-md); display: inline-flex;
align-items: center; justify-content: center; transition: background .12s;
}
.icon-btn:hover { background: var(--card-2); color: var(--fg); }
/**/
/**/
main { padding: var(--sp-5); flex: 1; max-width: var(--measure); width: 100%; margin-inline: auto; }
/**/
section { margin-bottom: var(--sp-5); }
section > h2 { margin: 0 0 var(--sp-3); }
section > h3 { margin: var(--sp-3) 0 var(--sp-2); }
.card {
background: color-mix(in srgb, var(--card) var(--veil-card), transparent);
border: 1px solid var(--border);
border-radius: var(--radius-lg); padding: var(--sp-4);
box-shadow: var(--lift);
}
/**/
.card, .empty-state { margin-bottom: var(--sp-3); }
.card .empty-state { margin-bottom: 0; }
.card.muted { color: var(--muted); }
.muted { color: var(--muted); }
/**/
.kpi-band-title { margin: 0 0 var(--sp-2-5); }
.kpi-grid {
display: grid; gap: var(--sp-3); margin-bottom: var(--sp-5);
grid-template-columns: repeat(auto-fit, minmax(176px, 1fr));
}
.kpi-card {
background: color-mix(in srgb, var(--card) var(--veil-card), transparent);
border: 1px solid var(--border);
border-radius: var(--radius-lg); padding: var(--sp-4) var(--sp-4); position: relative; overflow: hidden;
box-shadow: var(--lift);
transition: background .12s var(--ease);
}
/**/
.kpi-card::before {
content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: var(--spine-w);
background: var(--border-2);
transition: background .16s var(--ease);
}
.kpi-card:hover, .kpi-card:focus-within { background: var(--card-2); }
.kpi-card:hover::before, .kpi-card:focus-within::before { background: var(--brass); }
/**/
a.kpi-card { display: block; }
/**/
a.kpi-card .kpi-label {
display: flex; align-items: center; gap: var(--sp-2);
}
a.kpi-card .kpi-label::after {
content: "↗"; margin-left: auto; font-size: var(--text-xs); color: var(--muted);
opacity: .55; transition: color .16s var(--ease), opacity .16s var(--ease);
}
a.kpi-card:hover .kpi-label::after,
a.kpi-card:focus-within .kpi-label::after { color: var(--brass); opacity: 1; }
.kpi-label { margin-bottom: var(--sp-2); }
.kpi-num { font-size: var(--text-3xl); line-height: 1; }
.kpi-sub { font-size: var(--text-sm); color: var(--muted); margin-top: var(--sp-1-5); }
.kpi-delta { font-size: var(--text-sm); font-weight: 600; margin-top: var(--sp-1-5); }
.kpi-delta.up { color: var(--ok); }
.kpi-delta.down { color: var(--error); }
.kpi-card.alert::before, .kpi-card.alert:hover::before { background: var(--error); }
.kpi-card.warn::before, .kpi-card.warn:hover::before { background: var(--warn); }
/**/
#prompts-section .prompt-row,
.prompt-row {
display: flex; align-items: center; gap: var(--sp-3);
padding: var(--sp-3) var(--sp-4); margin-bottom: var(--sp-2); border-radius: var(--radius-md);
background: var(--card); border: 1px solid var(--border);
border-left: 3px solid var(--info);
transition: transform .1s, border-color .12s, background .12s;
}
.prompt-row:hover, .prompt-row:focus-within { background: var(--card-2); border-color: var(--border-2); }
.prompt-row.urgency-high { border-left-color: var(--error); }
.prompt-row.urgency-med { border-left-color: var(--warn); }
.prompt-row.urgency-low { border-left-color: var(--info); }
.prompt-icon { font-size: var(--text-lg); width: 24px; text-align: center; }
.prompt-text { flex: 1; font-weight: 500; }
.prompt-arrow { color: var(--muted); font-size: var(--text-md); }
/**/
/**/
/**/
.draft-card, .failed-card { border-left: 3px solid var(--brass); }
.failed-card { border-left-color: var(--error); }
.draft-card h2, .failed-card h2 {
text-transform: none; letter-spacing: 0; font-size: var(--text-md); color: var(--fg);
margin: 0 0 var(--sp-2-5); display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap;
}
.msg {
padding: var(--sp-2) var(--sp-3); border-radius: var(--radius-md); margin: var(--sp-1) 0;
max-width: 90%; font-size: var(--text-base);
}
.msg.inbound { background: var(--card-2); border: 1px solid var(--border); }
.msg.outbound { background: var(--brass-soft); border: 1px solid var(--brass-soft); }
/**/
/**/
/**/
main:has(> #kanban-section) { display: flex; flex-direction: column; max-width: none; }
#kanban-section {
display: flex; flex-direction: column; flex: 1 1 0;
min-height: min(420px, calc(100dvh - var(--topbar-h) - 2 * var(--sp-5)));
}
#kanban-board {
display: grid; gap: var(--sp-3); position: relative;
grid-template-columns: repeat(6, minmax(220px, 1fr));
grid-template-rows: minmax(0, 1fr);
flex: 1 1 0; min-height: 0;
overflow-x: auto; overscroll-behavior-x: contain;
}
.kanban-col {
background: color-mix(in srgb, var(--card) var(--veil-card), transparent);
border: 1px solid var(--border);
border-radius: var(--radius-lg); padding: var(--sp-2-5);
display: flex; flex-direction: column;
}
.kanban-col-head {
display: flex; align-items: center; gap: var(--sp-2);
padding: var(--sp-1) var(--sp-1) var(--sp-2-5); border-bottom: 1px solid var(--border);
margin-bottom: var(--sp-2-5);
}
/**/
.kanban-cards {
display: flex; flex-direction: column; gap: var(--sp-2); flex: 1; min-height: 0;
overflow-y: auto; overscroll-behavior-y: contain;
}
.kanban-card {
background: color-mix(in srgb, var(--card-2) var(--veil-card-2), transparent);
border: 1px solid var(--border); position: relative;
border-radius: var(--radius-md); padding: var(--sp-2-5) var(--sp-2-5); cursor: pointer; font-size: var(--text-base);
transition: border-color .12s var(--ease), background .12s var(--ease);
}
/**/
.kanban-card:hover, .kanban-card:focus-within { border-color: var(--border-2); background: var(--card); }
.kanban-card::after {
content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: var(--spine-w);
background: var(--brass); transform: scaleY(0); transform-origin: center;
transition: transform .16s var(--ease);
}
.kanban-card:hover::after, .kanban-card:focus-within::after { transform: scaleY(1); }
.kanban-card strong { font-weight: 600; }
.kanban-meta { color: var(--muted); font-size: var(--text-xs); margin-top: var(--sp-1); }
.kanban-card.mode-auto { box-shadow: inset 2px 0 0 var(--ok); }
.kanban-card.mode-paused { box-shadow: inset 2px 0 0 var(--unknown); }
.kanban-card.mode-needs_review { box-shadow: inset 2px 0 0 var(--warn); }
/**/
#kanban-board, .kanban-card { user-select: none; -webkit-user-select: none; }
body.kanban-dragging { user-select: none; -webkit-user-select: none; }
/**/
body.kanban-dragging .kanban-card { transition: none; }
/**/
body.kanban-dragging .kc-empty { display: none; }
/**/
.kanban-card.sortable-ghost { opacity: .35; border-style: dashed; background: transparent; }
.kanban-card.sortable-ghost::after { display: none; }
.kanban-card.sortable-fallback { opacity: 1; box-shadow: 0 10px 28px rgba(0, 0, 0, .28); cursor: grabbing; pointer-events: none; }
/**/
.kanban-card.kanban-saving { opacity: .62; cursor: progress; }
.kanban-card.kanban-saving::after { display: none; }
/**/
.kanban-card.sortable-ghost { opacity: .35; border-style: dashed; background: transparent; }
.kanban-card.sortable-ghost::after { display: none; }
.kanban-card.sortable-fallback { opacity: 1; box-shadow: 0 10px 28px rgba(0, 0, 0, .28); cursor: grabbing; }
/**/
#health-strip {
display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-1-5) var(--sp-3);
padding: var(--sp-3) var(--sp-4); margin-top: var(--sp-2); border-radius: var(--radius-lg);
background: var(--card); border: 1px solid var(--border); color: var(--muted);
font-size: var(--text-sm);
}
/**/
.health-dot { display: inline-flex; align-items: center; gap: var(--sp-1); }
.health-refresh {
border: none; background: transparent; color: var(--muted);
cursor: pointer; font-size: var(--text-base); padding: 0 var(--sp-1); margin-right: var(--sp-1-5);
}
.health-refresh:hover { color: var(--fg); }
/**/
.health-dot.health-checked {
color: var(--brass);
transition: color .12s var(--ease);
}
/**/
.health-legend {
flex-basis: 100%; color: var(--muted); font-size: var(--text-xs); opacity: .85;
}
.health-legend > span { font-weight: 700; }
/**/
.dot { width: 8px; height: 8px; border-radius: var(--radius-circle); display: inline-block; background: var(--muted); }
.dot.ok { background: var(--ok); }
/**/
.dot-go { background: var(--info); }
.dot-hold { background: var(--warn); }
.dot-done { background: var(--ok); }
.dot-ns { background: var(--unknown); }
/**/
.planned {
text-align: center; padding: 56px var(--sp-5); border: 1px dashed var(--border-2);
border-radius: var(--radius-lg); background: var(--card); color: var(--muted);
}
.planned .planned-ico { font-size: var(--text-3xl); opacity: .5; }
.planned h3 { color: var(--fg); margin: var(--sp-3) 0 var(--sp-1-5); text-transform: none; letter-spacing: 0; font-size: var(--text-lg); }
/**/
/**/
.jarvis-fab {
position: fixed; right: 24px; bottom: 24px; z-index: 50;
width: 58px; height: 58px; border-radius: var(--radius-circle); border: none; cursor: pointer;
background: linear-gradient(145deg, var(--brass-2), var(--brass));
color: var(--on-brass); font-size: var(--text-xl); box-shadow: var(--shadow);
display: flex; align-items: center; justify-content: center;
transition: transform .15s;
}
.jarvis-fab:hover { transform: scale(1.06); }
.jarvis-badge {
position: absolute; top: -2px; right: -2px; min-width: 20px; height: 20px;
border-radius: var(--radius-pill); background: var(--error-ink); color: #fff; font-size: var(--text-xs);
font-weight: 700; display: flex; align-items: center; justify-content: center;
padding: 0 var(--sp-1); border: 2px solid var(--bg);
}
/**/
.jarvis-badge[hidden] { display: none; }
body.jarvis-open .jarvis-fab { transform: scale(0); opacity: 0; pointer-events: none; }
/**/
.jarvis-panel {
position: fixed; right: 24px; bottom: 24px; z-index: 51;
width: var(--jarvis-w, 370px); max-width: calc(100vw - 32px);
height: var(--jarvis-h, 540px); max-height: calc(100vh - 48px);
/**/
margin: 0;
background: var(--card); border: 1px solid var(--border-2); border-radius: var(--radius-lg);
box-shadow: var(--shadow); display: flex; flex-direction: column; overflow: hidden;
opacity: 0; transform: translateY(16px) scale(.98); pointer-events: none;
transition: opacity .16s, transform .16s;
}
body.jarvis-open .jarvis-panel { opacity: 1; transform: none; pointer-events: auto; }
/**/
.jarvis-grip {
position: absolute; top: 0; left: 0; z-index: 1;
width: 26px; height: 26px; padding: 0;
background: transparent; border: none; color: var(--muted);
border-radius: var(--radius-lg) 0 0 0;
font-size: var(--text-xs); line-height: 1; cursor: nwse-resize;
touch-action: none; user-select: none;
}
.jarvis-grip:hover { background: transparent; color: var(--fg); }
/**/
[data-icon]::before,
.jarvis-maximise::before,
.jarvis-grip::before {
content: "";
display: inline-block;
width: 16px; height: 16px; flex: 0 0 auto;
background: currentColor;
-webkit-mask: var(--icon) center / contain no-repeat;
mask: var(--icon) center / contain no-repeat;
}
[data-icon="history"] { --icon: url("data:image/svg+xml;utf8,"); }
[data-icon="new"] { --icon: url("data:image/svg+xml;utf8,"); }
[data-icon="close"] { --icon: url("data:image/svg+xml;utf8,"); }
[data-icon="delete"] { --icon: url("data:image/svg+xml;utf8,"); }
[data-icon="mic"] { --icon: url("data:image/svg+xml;utf8,"); }
[data-icon="stop"] { --icon: url("data:image/svg+xml;utf8,"); }
[data-icon="send"] { --icon: url("data:image/svg+xml;utf8,"); }
/**/
[data-icon="alert"] { --icon: url("data:image/svg+xml;utf8,"); }
.jarvis-maximise[aria-pressed="false"] { --icon: url("data:image/svg+xml;utf8,"); }
.jarvis-maximise[aria-pressed="true"] { --icon: url("data:image/svg+xml;utf8,"); }
.jarvis-grip { --icon: url("data:image/svg+xml;utf8,"); }
.jarvis-head {
display: flex; align-items: center; gap: var(--sp-2-5); padding: var(--sp-3) var(--sp-4);
border-bottom: 1px solid var(--border);
background: linear-gradient(180deg, var(--brass-soft), transparent);
}
.jarvis-avatar {
width: 34px; height: 34px; border-radius: var(--radius-md); display: flex;
align-items: center; justify-content: center; font-size: var(--text-md);
background: linear-gradient(145deg, var(--brass-2), var(--brass)); color: var(--on-brass);
}
.jarvis-head strong { font-size: var(--text-base); }
.jarvis-status { font-size: var(--text-xs); color: var(--muted); display: flex; align-items: center; gap: var(--sp-1-5); }
/**/
.jarvis-actions { margin-left: auto; display: flex; align-items: center; gap: var(--sp-1); }
.jarvis-actions .icon-btn { width: 30px; height: 30px; }
.jarvis-body { flex: 1; overflow-y: auto; padding: var(--sp-4); display: flex; flex-direction: column; gap: var(--sp-2-5); }
/**/
.jarvis-msg {
padding: var(--sp-2-5) var(--sp-3); border-radius: var(--radius-lg); font-size: var(--text-base);
max-width: min(86%, 68ch); line-height: 1.45;
}
.jarvis-msg.bot { background: var(--card-2); border: 1px solid var(--border); align-self: flex-start; border-bottom-left-radius: var(--radius-sm); }
.jarvis-msg.me { background: var(--brass-soft); border: 1px solid var(--brass); color: var(--fg);
align-self: flex-end; border-bottom-right-radius: var(--radius-sm); }
/**/
.jarvis-msg { white-space: pre-wrap; }
/**/
.jarvis-msg.pending { color: var(--muted); font-style: italic; }
/**/
.jarvis-runref { margin-top: var(--sp-1-5); font-size: var(--text-xs); color: var(--muted); }
/**/
.jarvis-again { margin-top: var(--sp-2); }
/**/
.jarvis-tools {
margin-top: var(--sp-2); font-size: var(--text-xs); color: var(--muted);
border-top: 1px solid var(--border); padding-top: var(--sp-1-5);
white-space: normal;
}
/**/
.jarvis-msg.jarvis-md { white-space: normal; }
.jarvis-md p, .jarvis-md ul, .jarvis-md ol, .jarvis-md pre,
.jarvis-md blockquote { margin: 0 0 var(--sp-2); }
.jarvis-md > :last-child, .jarvis-md p:last-child { margin-bottom: 0; }
.jarvis-md h1, .jarvis-md h2, .jarvis-md h3, .jarvis-md h4, .jarvis-md h5,
.jarvis-md h6 { font-size: var(--text-base); font-weight: 700; margin: var(--sp-2-5) 0 var(--sp-1); }
.jarvis-md ul, .jarvis-md ol { padding-left: 18px; }
.jarvis-md li { margin: 2px 0; }
.jarvis-md code {
font-family: var(--mono, ui-monospace, monospace); font-size: var(--text-sm);
background: var(--card); border: 1px solid var(--border);
border-radius: var(--radius-sm); padding: 1px var(--sp-1);
}
.jarvis-md pre {
background: var(--card); border: 1px solid var(--border);
border-radius: var(--radius-sm); padding: var(--sp-2) var(--sp-2-5); overflow-x: auto;
}
.jarvis-md pre code { border: none; background: transparent; padding: 0; }
.jarvis-md blockquote {
border-left: 3px solid var(--border-2); padding-left: var(--sp-2-5);
color: var(--muted);
}
.jarvis-md hr { border: none; border-top: 1px solid var(--border); margin: var(--sp-2) 0; }
/**/
.jarvis-md table {
display: block; max-width: 100%; overflow-x: auto;
border-collapse: collapse; margin: 0 0 var(--sp-2);
font-size: var(--text-sm);
}
.jarvis-md th, .jarvis-md td {
border: 1px solid var(--border);
padding: var(--sp-1) var(--sp-2);
text-align: left; vertical-align: top;
}
.jarvis-md th {
font-size: var(--text-xs); font-weight: 400; letter-spacing: 0;
text-transform: none; color: var(--muted); white-space: nowrap;
}
/**/
.jarvis-side { display: none; }
body.jarvis-maxed .jarvis-panel {
inset: 0; width: auto; height: auto; max-width: none; max-height: none;
border-radius: 0; border: none;
display: grid;
grid-template-columns: 300px minmax(0, 1fr);
grid-template-rows: auto auto 1fr auto auto;
grid-template-areas:
"side head"
"side voice"
"side body"
"side note"
"side input";
}
body.jarvis-maxed .jarvis-head { grid-area: head; }
body.jarvis-maxed .jarvis-voice { grid-area: voice; }
body.jarvis-maxed .jarvis-body { grid-area: body; }
/**/
body.jarvis-maxed .jarvis-wait-note { grid-area: note; }
body.jarvis-maxed .jarvis-input { grid-area: input; }
/**/
body.jarvis-maxed .jarvis-body { padding: var(--sp-5) clamp(16px, 8vw, 120px); }
/**/
body.jarvis-maxed .jarvis-grip { display: none; }
body.jarvis-maxed .jarvis-side {
grid-area: side; display: flex; flex-direction: column; min-height: 0;
border-right: 1px solid var(--border); background: var(--card-2);
}
.jarvis-side-head {
display: flex; align-items: center; justify-content: space-between;
padding: var(--sp-3) var(--sp-4); border-bottom: 1px solid var(--border);
font-size: var(--text-base);
}
.jarvis-side-list {
flex: 1; overflow-y: auto; padding: var(--sp-2-5);
display: flex; flex-direction: column; gap: var(--sp-1-5);
}
/**/
.jarvis-msg a { color: var(--fg); text-decoration: underline; }
.jarvis-msg a { overflow-wrap: anywhere; }
/**/
.jarvis-records {
display: flex; flex-wrap: wrap; gap: var(--sp-1-5);
margin-top: var(--sp-2-5); padding-top: var(--sp-2); border-top: 1px solid var(--border);
}
.jarvis-msg a.jarvis-record {
display: flex; flex-direction: column; gap: 1px; max-width: 100%;
white-space: normal; text-decoration: none; color: var(--fg);
background: var(--card); border: 1px solid var(--border-2);
border-radius: var(--radius-md); padding: var(--sp-1-5) var(--sp-2-5);
transition: border-color .12s var(--ease);
}
.jarvis-msg a.jarvis-record:hover,
.jarvis-msg a.jarvis-record:focus-visible { border-color: var(--brass); }
.jarvis-record-label { font-size: var(--text-base); overflow-wrap: anywhere; }
.jarvis-record-note { font-size: var(--text-xs); color: var(--muted); }
/**/
.jarvis-panel .jarvis-thread-intro,
.jarvis-panel button.jarvis-thread:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
display: block; width: 100%; text-align: left;
background: var(--card-2); border: 1px solid var(--border);
border-radius: var(--radius-md); padding: var(--sp-2) var(--sp-3);
font-size: var(--text-sm); line-height: 1.45; color: var(--fg-soft); cursor: pointer;
}
.jarvis-panel button.jarvis-thread:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip):hover {
border-color: var(--brass); color: var(--fg);
}
/**/
.jarvis-panel .jarvis-thread-intro { cursor: default; }
/**/
.jarvis-thread-meta { display: block; min-width: 0; color: var(--muted); }
.jarvis-thread-title {
display: block; min-width: 0;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/**/
.jarvis-thread-row { display: flex; align-items: stretch; gap: var(--sp-1-5); }
/**/
.jarvis-thread-confirm {
display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2);
background: var(--card-2); border: 1px solid var(--border-2);
border-radius: var(--radius-md); padding: var(--sp-2) var(--sp-3);
font-size: var(--text-sm); line-height: 1.45; color: var(--fg-soft);
}
.jarvis-thread-confirm span { flex: 1 1 100%; }
/**/
.chip {
border: 1px solid var(--border); background: transparent; color: var(--fg-soft);
border-radius: var(--radius-sm); padding: var(--sp-1) var(--sp-2-5); font-size: var(--text-sm); cursor: pointer;
transition: border-color .12s var(--ease), color .12s var(--ease);
}
/**/
.chip:hover { border-color: var(--border-2); color: var(--fg); }
.jarvis-input { display: flex; gap: var(--sp-2); padding: var(--sp-3) var(--sp-4); border-top: 1px solid var(--border); }
/**/
.jarvis-input input {
flex: 1; min-width: 0;
background: var(--bg); border: 1px solid var(--border-2); color: var(--fg);
border-radius: var(--radius-md); padding: var(--sp-2-5) var(--sp-3); font-size: var(--text-base);
}
.jarvis-input input:focus { border-color: var(--brass); }
/**/
.jarvis-send {
flex: 0 0 auto;
border: none; border-radius: var(--radius-md); width: 40px; cursor: pointer; font-size: var(--text-md);
background: linear-gradient(145deg, var(--brass-2), var(--brass)); color: var(--on-brass);
}
/**/
.jarvis-send:disabled,
.jarvis-input input:disabled {
opacity: .45;
cursor: not-allowed;
}
/**/
.jarvis-mic { width: 56px; height: 56px; font-size: var(--text-xl); }
.jarvis-mic[hidden] { display: none; }
.jarvis-mic[aria-pressed="true"] {
background: var(--error); color: var(--on-brass);
}
/**/
.jarvis-voice {
padding: var(--sp-2-5) var(--sp-4); font-size: var(--text-md); font-weight: 700; line-height: 1.3;
background: var(--card-2); border-top: 1px solid var(--border);
border-left: 6px solid var(--unknown); color: var(--fg);
}
.jarvis-voice[hidden] { display: none; }
.jarvis-voice[data-state="listening"] { border-left-color: var(--brass); color: var(--brass); }
.jarvis-voice[data-state="thinking"] { border-left-color: var(--info); color: var(--info); }
.jarvis-voice[data-state="error"] { border-left-color: var(--error); color: var(--error); }
/**/
.jarvis-wait-note {
margin: 0; padding: 0 var(--sp-4) var(--sp-2-5);
font-size: var(--text-xs); color: var(--muted); line-height: 1.4;
}
.jarvis-wait-note[hidden] { display: none; }
/**/
/**/
.page-head {
display: flex; align-items: center; justify-content: space-between;
gap: var(--sp-4); margin: 0 0 var(--sp-4); flex-wrap: wrap;
}
.page-head > h1, .page-head > h2, .page-head-text > h2 { margin: 0; }
.page-head-actions { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }
/**/
.head-link {
text-decoration: underline;
text-decoration-color: var(--border-2);
text-decoration-thickness: 1px;
text-underline-offset: .18em;
transition: text-decoration-color .16s var(--ease);
}
.head-link:hover, .head-link:focus-visible {
color: var(--brass); text-decoration-color: var(--brass);
}
/**/
/**/
main > h2 { margin: 0 0 var(--sp-3); }
main > h3, .page-head + h3 { margin: var(--sp-5) 0 var(--sp-2); }
main > h2:first-child, main > h3:first-child { margin-top: 0; }
main > p { margin: var(--sp-3) 0; }
.note { font-size: var(--text-sm); color: var(--muted); margin-top: var(--sp-4); }
/**/
input, select, textarea {
font: inherit; color: var(--fg); background: var(--bg-2);
border: 1px solid var(--border-2); border-radius: var(--radius-md);
padding: var(--sp-2) var(--sp-3); max-width: 100%;
}
input:focus, select:focus, textarea:focus { border-color: var(--brass); }
select { cursor: pointer; }
button { font: inherit; }
button:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip),
.btn-secondary {
display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-1-5);
padding: var(--sp-2) var(--sp-4); border-radius: var(--radius-md);
background: var(--card-2); border: 1px solid var(--border-2); color: var(--fg-soft);
font-size: var(--text-base); font-weight: 600; cursor: pointer; white-space: nowrap;
transition: background .12s, border-color .12s, color .12s;
}
button:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip):hover,
.btn-secondary:hover { border-color: var(--brass); color: var(--brass-2); }
/**/
button[data-refresh-retry][hidden]:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
display: none;
}
/**/
.htmx-request { opacity: .55; cursor: progress; transition: opacity .12s var(--ease); }
/**/
button:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip).htmx-request,
.btn-primary.htmx-request,
.btn-secondary.htmx-request,
.btn-danger.htmx-request,
.icon-btn.htmx-request,
.health-refresh.htmx-request { cursor: progress; }
button:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip):disabled,
.btn-secondary:disabled,
.btn-primary:disabled,
.btn-danger:disabled,
.icon-btn:disabled,
button:disabled {
opacity: .5; cursor: not-allowed; filter: saturate(.5);
transition: opacity .12s var(--ease);
}
/**/
.btn-primary {
display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-1-5);
padding: var(--sp-2) var(--sp-4); border-radius: var(--radius-md);
background: var(--brass); border: 1px solid var(--brass); color: var(--on-brass);
font-size: var(--text-base); font-weight: 600; cursor: pointer; white-space: nowrap;
transition: background .12s var(--ease), border-color .12s var(--ease);
}
.btn-primary:hover { background: var(--brass-2); border-color: var(--brass-2); }
/**/
.filter-bar {
display: flex; align-items: flex-end; gap: var(--sp-3);
flex-wrap: wrap; margin: 0 0 var(--sp-4);
}
.filter-bar label { display: flex; flex-direction: column; gap: var(--sp-1); }
.filter-bar select, .filter-bar input { font-size: var(--text-base); color: var(--fg); }
.filter-bar input[type="search"] { min-width: 240px; }
.filter-bar .spacer { margin-left: auto; }
/**/
.filter-select { display: inline-flex; flex-direction: column; gap: var(--sp-1); margin: 0 0 var(--sp-4); }
.filter-select select { font-size: var(--text-base); color: var(--fg); }
.filter-bar .filter-select { margin-bottom: 0; }
/**/
.filter-menu { position: relative; flex: 0 0 auto; }
.filter-menu > summary { list-style: none; position: relative; }
.filter-menu > summary::-webkit-details-marker { display: none; }
.filter-menu > summary:hover { background: var(--card-2); color: var(--fg); }
.filter-menu[open] > summary { border-color: var(--brass); color: var(--brass-2); }
/**/
.filter-menu-count {
position: absolute; top: -5px; right: -5px; min-width: 15px; height: 15px;
padding: 0 3px; border-radius: var(--radius-pill); background: var(--brass);
color: var(--on-brass); font-size: var(--text-2xs); line-height: 15px; font-weight: 600;
}
/**/
.filter-menu-panel {
position: absolute; top: calc(100% + var(--sp-2)); right: 0; z-index: 40;
display: flex; flex-direction: column; gap: var(--sp-3);
min-width: 230px; max-width: calc(100vw - var(--sp-6));
padding: var(--sp-3); background: var(--card);
border: 1px solid var(--border-2); border-radius: var(--radius-md);
box-shadow: var(--shadow);
}
.filter-menu-panel .filter-select { margin: 0; display: flex; }
.filter-menu-panel select { width: 100%; }
/**/
.chip-row { display: flex; gap: var(--sp-1-5); flex-wrap: wrap; align-items: baseline; }
/**/
.stat-line {
display: flex; flex-wrap: wrap; align-items: baseline; gap: 0;
margin: 0 0 var(--sp-4); font-size: var(--text-xs); color: var(--muted);
}
.stat-line b { font-weight: 600; color: var(--fg); }
/**/
.stat-sep { color: var(--border-2); padding: 0 var(--sp-1-5); }
/**/
.table-wrap {
overflow-x: auto; -webkit-overflow-scrolling: touch;
border: 1px solid var(--border); border-radius: var(--radius-lg); max-width: 100%;
/**/
position: relative;
/**/
background:
linear-gradient(to right, var(--card) 40%, transparent) left / 28px 100% no-repeat local,
linear-gradient(to left, var(--card) 40%, transparent) right / 28px 100% no-repeat local,
radial-gradient(farthest-side at 0 50%, rgba(0,0,0,.28), transparent) left / 12px 100% no-repeat scroll,
radial-gradient(farthest-side at 100% 50%, rgba(0,0,0,.28), transparent) right / 12px 100% no-repeat scroll,
var(--card);
}
main table { width: 100%; border-collapse: collapse; font-size: var(--text-base); }
main th {
text-align: left; white-space: nowrap;
background: var(--card-2); border-bottom: 1px solid var(--border);
}
main td {
border-bottom: 1px solid var(--border);
overflow-wrap: anywhere;
}
/**/
.sort-header { color: inherit; text-decoration: none; white-space: nowrap; }
.sort-header:hover { color: var(--fg); }
.sort-header.active { color: var(--brass); }
.sort-header span { margin-left: 3px; }
/**/
main th, main td {
height: var(--row-h); padding: var(--row-pad) var(--sp-4); vertical-align: top;
}
main tbody tr:last-child td { border-bottom: none; }
main tbody tr:hover td { background: var(--card-2); }
/**/
main td a { color: var(--fg); font-weight: 500; }
main td a:hover { color: var(--brass-2); text-decoration: underline; }
/**/
.row-link { color: inherit; font-weight: 600; }
.row-link:hover { text-decoration: underline; }
/**/
#leads-results { padding-bottom: calc(58px + 24px + env(safe-area-inset-bottom)); }
.pn { color: var(--fg-soft); font-weight: 500; font-size: var(--text-xs); }
/**/
.cell-sub { font-size: var(--text-xs); color: var(--muted); white-space: nowrap; }
/**/
.cell-text { max-width: 36ch; white-space: normal; }
.num { white-space: nowrap; }
/**/
.amount-note { white-space: normal; }
/**/
.table-centre th, .table-centre td { text-align: center; }
/**/
.row-actions { width: 1%; white-space: nowrap; text-align: right; }
/**/
.row-menu {
position: fixed; inset: auto; margin: 0;
padding: var(--sp-1); min-width: 200px; text-align: left;
background: var(--card); border: 1px solid var(--border-2);
border-radius: var(--radius-lg); box-shadow: var(--shadow); color: var(--fg);
}
/**/
.row-menu-item:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
display: flex; align-items: center; justify-content: flex-start; width: 100%;
padding: var(--sp-1-5) var(--sp-2-5); border: 0; border-radius: var(--radius-md);
background: transparent; color: var(--fg-soft);
font-size: var(--text-base); font-weight: 400; text-align: left; white-space: nowrap;
transition: background .12s var(--ease), color .12s var(--ease);
}
.row-menu-item:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip):hover,
.row-menu-item:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip):focus-visible {
background: var(--card-2); color: var(--fg); border-color: transparent;
}
/**/
.row-menu-btn { border-color: transparent; background: transparent; opacity: .6; }
tbody tr:hover .row-menu-btn,
.row-menu-btn:focus-visible,
.row-menu-btn:hover { opacity: 1; border-color: var(--border-2); background: var(--card); }
/**/
@media (hover: none) {
.row-menu-btn {
opacity: 1; border-color: var(--border-2); background: var(--card);
width: 40px; height: 40px;
}
}
/**/
.empty-state {
border: 1px dashed var(--border-2); border-radius: var(--radius-lg);
background: var(--card); color: var(--muted);
padding: var(--sp-5) var(--sp-4); text-align: center;
}
.empty-state p { margin: 0; }
.empty-state p + p { margin-top: var(--sp-2); }
.empty-state strong { color: var(--fg-soft); font-weight: 600; }
.empty-state .btn-primary, .empty-state .btn-secondary { margin-top: var(--sp-3); }
td.empty-state { border: 0; }
/**/
.status-pill {
display: inline; padding: 0; border: 0; background: none;
font-size: var(--text-xs); font-weight: 400; letter-spacing: 0;
text-transform: none; white-space: nowrap;
}
/**/
.status-pill.status-ok,
.status-pill.status-neutral,
.status-pill.status-unknown,
.status-pill.status-stale,
.status-pill.status-idle { color: var(--muted); }
.status-pill.status-info,
.status-pill.status-warn,
.status-pill.status-timeout,
.status-pill.status-error { color: var(--brass); }
.status-ok { color: var(--ok); }
.status-info { color: var(--info); }
.status-warn,
.status-timeout { color: var(--warn); }
.status-error { color: var(--error); }
/**/
/**/
.status-neutral,
.status-unknown,
.status-stale,
.status-idle { color: var(--unknown); }
/**/
/**/
/**/
.src-row { display: flex; align-items: baseline; gap: 0; flex-wrap: wrap; }
.src-sep { color: var(--border-2); padding: 0 var(--sp-1); font-size: var(--text-xs); }
/**/
:is(.src-toggle, .word-toggle):not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
display: inline-block; padding: 2px 0 3px; margin: 0;
background: none; border: 0; border-radius: 0;
/**/
border-bottom: 2px solid transparent;
font-size: var(--text-xs); font-weight: 400; letter-spacing: 0;
text-transform: none; white-space: nowrap; color: var(--muted);
cursor: pointer; transition: color .12s var(--ease), border-color .12s var(--ease);
text-decoration: none;
}
:is(.src-toggle, .word-toggle):not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip):hover {
color: var(--fg-soft); text-decoration: none;
}
/**/
:is(.src-toggle, .word-toggle).on:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
color: var(--fg); font-weight: 500; border-bottom-color: var(--brass);
}
/**/
.field-grid {
display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: var(--sp-3) var(--sp-4); margin: 0;
}
.field-grid > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.field-grid dd { margin: 0; }
/**/
.prop-list > div { display: contents; }
.field-grid > .empty, .prop-list > .empty {
display: flex; flex-direction: column; align-items: center; gap: 3px;
width: max-content; max-width: 100%; justify-self: start;
}
.prop-list > .empty { grid-column: 1 / -1; }
.field-grid .value, .field-grid dd, .field-grid span, .field-grid a { font-size: var(--text-base); }
.field-grid a { color: var(--brass-2); }
.field-grid a:hover { text-decoration: underline; }
.value-money { color: var(--brass-2); font-weight: 600; }
.value-good { color: var(--ok); }
/**/
.kanban-section-head {
display: flex; align-items: baseline; justify-content: space-between;
gap: var(--sp-3); flex-wrap: wrap; margin: 0 0 var(--sp-2);
}
/**/
.kanban-col-head .col-count {
margin-left: auto; font-size: var(--text-xs); letter-spacing: 0; padding: 1px var(--sp-1-5);
border-radius: var(--radius-pill); background: var(--card-2); border: 1px solid var(--border);
}
.kc-row1 {
display: flex; align-items: center; justify-content: space-between;
gap: var(--sp-2); margin-bottom: var(--sp-1);
}
.kc-name { font-size: var(--text-base); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/**/
.kc-actions { flex: 0 0 auto; display: flex; margin: -4px 0; }
.kc-actions .row-menu-btn { opacity: 1; border-color: var(--border-2); background: var(--card); }
/**/
@media (hover: hover) {
.kc-actions .row-menu-btn { opacity: 0; }
.kanban-card:hover .kc-actions .row-menu-btn,
.kc-actions .row-menu-btn:focus-visible,
.kc-actions:has(.row-menu:popover-open) .row-menu-btn { opacity: 1; }
}
.kc-row2 { display: flex; flex-wrap: wrap; gap: var(--sp-1) var(--sp-3); font-size: var(--text-xs); color: var(--muted); }
/**/
.kc-suburb { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/**/
.kc-budget { color: var(--brass-2); font-weight: 500; }
.kc-empty {
padding: var(--sp-3); text-align: center; font-size: var(--text-xs); color: var(--muted);
border: 1px dashed var(--border); border-radius: var(--radius-md);
}
/**/
.kc-why {
margin-top: var(--sp-1-5); padding: 0 var(--sp-2); text-align: center;
font-size: var(--text-2xs); line-height: 1.45; color: var(--muted); opacity: .8;
}
/**/
/**/
.kb-dialog { width: min(720px, calc(100vw - var(--sp-5))); }
/**/
/**/
.modal.kb-move { width: min(440px, calc(100vw - var(--sp-5))); padding: 0; }
.kb-move-body { padding: var(--sp-5); }
.kb-move .kb-head { align-items: flex-start; margin-bottom: var(--sp-4); }
.kb-move .kb-lede { margin-top: var(--sp-1); }
.kb-move-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.kb-move-list li { position: relative; }
/**/
.kb-move-list li:not(:last-child)::after {
content: ""; position: absolute; width: 2px; background: var(--border-2);
left: calc(var(--sp-3) + 13px); top: calc(50% + 14px); bottom: calc(14px - 50% - 2px);
}
.kb-move-stage:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
position: relative; display: flex; align-items: center; gap: var(--sp-3);
width: 100%; min-height: 48px; margin: 0; padding: var(--sp-2) var(--sp-3);
background: transparent; border: 0; border-radius: var(--radius-md); box-shadow: none;
font-size: var(--text-base); font-weight: 400; text-align: left; color: var(--fg-soft);
cursor: pointer; transition: background .12s var(--ease), color .12s var(--ease);
}
.kb-move-stage:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip):hover,
.kb-move-stage:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip):focus-visible {
background: var(--card-2); color: var(--fg);
}
.kb-move-step {
flex: 0 0 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center;
border: 2px solid var(--border-2); border-radius: var(--radius-circle);
background: var(--card); font-size: var(--text-xs); font-weight: 600; color: var(--muted);
position: relative; z-index: 1;
}
.kb-move-stage:hover .kb-move-step { border-color: var(--brass); color: var(--fg); }
.kb-move-name { flex: 1 1 auto; min-width: 0; }
.kb-move-stage[aria-current]:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
background: var(--card-2); color: var(--fg); font-weight: 500; cursor: default; opacity: 1;
}
.kb-move-stage[aria-current]::before {
content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: var(--spine-w); background: var(--brass);
}
.kb-move-stage[aria-current] .kb-move-step { background: var(--brass); border-color: var(--brass); color: var(--on-brass); }
.kb-move-stage[aria-current]::after {
content: "Current"; flex: 0 0 auto; font-size: var(--text-xs); font-weight: 500; color: var(--brass);
}
.kb-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); }
.kb-head h3 { margin: 0; font-size: var(--text-lg); }
.kb-lede, .kb-said, .kb-empty { margin: var(--sp-2) 0 0; font-size: var(--text-sm); color: var(--fg-soft); }
/**/
.kb-said-ok { color: var(--brass-2); }
.kb-said-no { color: var(--error); }
/**/
.kb-close { flex: 0 0 auto; }
.kb-clear { margin: var(--sp-2) 0 0; font-size: var(--text-sm); color: var(--ok); font-weight: 600; }
.kb-line { border-top: 1px solid var(--border); margin-top: var(--sp-3); padding-top: var(--sp-3); }
.kb-line-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--sp-2); }
.kb-why { font-size: var(--text-xs); color: var(--muted); }
/**/
.kb-opt { font-size: var(--text-xs); color: var(--muted); font-style: italic; }
/**/
.kb-form {
display: grid; grid-template-columns: minmax(0, 1fr) 7.5rem auto;
gap: var(--sp-1) var(--sp-3); align-items: end; margin-top: var(--sp-2-5);
}
.kb-form label { display: flex; flex-direction: column; gap: var(--sp-1); font-size: var(--text-xs); color: var(--muted); }
.kb-form > button { grid-column: 3; grid-row: 1; }
.kb-pick { grid-column: 1; grid-row: 1; min-width: 0; }
.kb-qty { grid-column: 2; grid-row: 1; }
/**/
.kb-total {
grid-column: 1 / -1; grid-row: 2; min-height: 1.4em; font-size: var(--text-base);
font-weight: 600; color: var(--brass-2); font-variant-numeric: tabular-nums;
}
/**/
.kb-amount { grid-column: 1 / -1; max-width: 14rem; }
.kb-byhand .kb-amount { display: flex; flex-direction: column; gap: var(--sp-1);
font-size: var(--text-xs); color: var(--muted); }
@media (max-width: 700px) {
.kb-form, .kb-byhand .kb-form { grid-template-columns: minmax(0, 1fr); }
.kb-form > button, .kb-pick, .kb-qty, .kb-amount { grid-column: 1; grid-row: auto; }
.kb-total { grid-column: 1; grid-row: auto; }
}
.kb-alts { display: flex; align-items: flex-start; flex-wrap: wrap; gap: var(--sp-2) var(--sp-3); margin-top: var(--sp-2-5); }
/**/
.kb-byhand[open] { flex: 1 1 100%; }
.kb-byhand > summary { font-size: var(--text-xs); color: var(--muted); cursor: pointer; padding: var(--sp-2) 0; }
.kb-byhand > summary:hover { color: var(--fg); }
/**/
/**/
.kb-line-off .kb-line-head strong { text-decoration: line-through; }
.kb-line-off .kb-form, .kb-line-off .kb-byhand { filter: grayscale(1); }
.kb-line-off .kb-form select, .kb-line-off .kb-form input,
.kb-line-off .kb-byhand input { pointer-events: none; }
.kb-line-off .kb-line-head { color: var(--muted); }
/**/
.kb-add-rows { display: flex; flex-direction: column; gap: var(--sp-2); margin-top: var(--sp-2); }
.kb-add-row { border-left: 3px solid var(--ok); padding-left: var(--sp-2-5); }
.kb-add-row .kb-total:empty { display: none; }
/**/
.kb-add-row > .kb-add-off { grid-column: 3; grid-row: 1; }
@media (max-width: 700px) { .kb-add-row > .kb-add-off { grid-column: 1; grid-row: auto; } }
/**/
.kb-savebar {
position: sticky; bottom: calc(var(--sp-5) * -1);
display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap;
margin-top: var(--sp-4); padding: var(--sp-3) 0;
background: var(--card); border-top: 1px solid var(--border);
}
.kb-savehint { font-size: var(--text-xs); color: var(--muted); }
/**/
.kb-lede-mark { display: inline-block; width: 15px; height: 15px; flex: 0 0 auto;
vertical-align: -2px; margin-right: var(--sp-2); background: var(--brass);
-webkit-mask: var(--icon) center / contain no-repeat;
mask: var(--icon) center / contain no-repeat; }
.kb-close { position: relative; }
.kb-close::after {
content: ""; position: absolute; top: 50%; left: 50%;
transform: translate(-50%, -50%); width: 44px; height: 44px;
}
/**/
.kb-lead-link { color: inherit; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--border); }
.kb-lead-link:hover, .kb-lead-link:focus-visible { color: var(--brass-2); text-decoration-color: currentColor; }
.kb-total-now { font-variant-numeric: tabular-nums; color: var(--fg-soft); }
/**/
.kb-add { border-top: 1px solid var(--border); margin-top: var(--sp-4); padding-top: var(--sp-2); }
.kb-add > summary { font-size: var(--text-sm); color: var(--muted); cursor: pointer; padding: var(--sp-2) 0; }
.kb-add > summary:hover { color: var(--fg); }
.kb-add-note { margin: 0 0 var(--sp-2); font-size: var(--text-xs); color: var(--muted); }
/**/
/**/
.gantt {
background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-lg);
padding: var(--sp-3) 0 var(--sp-4); margin-bottom: var(--sp-5);
overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%;
display: flex; align-items: flex-start;
}
/**/
.gantt { --gantt-head-h: 44px; }
/**/
/**/
.gantt-labels {
position: sticky; left: 0; z-index: 6; flex: 0 0 auto;
display: grid; grid-template-columns: var(--gantt-name-w) max-content;
background: var(--card); border-right: 1px solid var(--border);
}
/**/
.gantt { --gantt-name-w: 260px; }
/**/
.gantt-label {
height: calc(var(--row-h) * var(--lanes, 1)); display: flex; align-items: center;
padding: 0 var(--sp-3); font-size: var(--text-base);
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/**/
.gantt-label .row-link {
min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.gantt-label .pn { margin-right: var(--sp-1-5); color: var(--muted); }
/**/
.gantt-assignees { border-left: 1px solid var(--border); }
.gantt-label .crew { flex: 0 0 auto; }
/**/
.gantt-label .crew.gantt-crew-chip { margin-right: var(--sp-2); }
.gantt-label-crew { align-items: flex-start; padding-top: 7px; }
/**/
.gantt-label-crew.gantt-assignees { gap: var(--sp-1-5); }
/**/
.gantt-flag {
font-weight: 600; font-size: var(--text-2xs); white-space: nowrap;
}
.gantt-flag-error { color: var(--error); }
.gantt-flag-warn { color: var(--warn); }
/**/
.gantt-staffing { display: inline-flex; gap: var(--sp-2); align-items: baseline; }
.gantt-staffing a { text-decoration: none; }
.gantt-staffing a:hover .gantt-flag { text-decoration: underline; }
.gantt-label .crew .av { width: 18px; height: 18px; font-size: var(--text-2xs); }
.gantt-label-head { height: var(--gantt-head-h); align-items: flex-end; padding-bottom: var(--sp-1-5); }
.gantt-inner { position: relative; flex: 0 0 auto; width: var(--gantt-w); }
/**/
.gantt-inner::before {
content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
background: repeating-linear-gradient(45deg,
var(--border) 0 1px, transparent 1px 6px);
opacity: .65;
-webkit-mask-image: repeating-linear-gradient(90deg,
transparent 0 calc(5 * var(--gantt-day)),
#000 calc(5 * var(--gantt-day)) calc(7 * var(--gantt-day)));
mask-image: repeating-linear-gradient(90deg,
transparent 0 calc(5 * var(--gantt-day)),
#000 calc(5 * var(--gantt-day)) calc(7 * var(--gantt-day)));
}
.gantt-head { position: relative; height: var(--gantt-head-h); }
.gantt-band-row, .gantt-cell-row { position: relative; height: 22px; }
.gantt-band, .gantt-cell {
position: absolute; top: 0; height: 100%; overflow: hidden;
display: flex; align-items: center; justify-content: center;
border-left: 1px solid var(--border); font-size: var(--text-xs); color: var(--muted);
white-space: nowrap;
}
.gantt-band { font-weight: 500; letter-spacing: .04em; }
/**/
.gantt-cell.is-today { color: var(--brass); }
.gantt-cell > i { font-style: normal; }
.gantt-cell.is-today > i { font-weight: 700; }
.gantt-cell.is-today::after {
content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
background: var(--brass);
}
.gantt-band.is-today { color: var(--brass); }
.gantt-body { position: relative; }
/**/
.gantt-row { position: relative; height: calc(var(--row-h) * var(--lanes, 1)); }
.gantt-row:hover { background: var(--card-2); }
/**/
.gantt-row-crew { border-top: 1px solid var(--border); }
.gantt-track { position: relative; height: 100%; }
.gantt-bar {
position: absolute; top: calc(7px + var(--row-h) * var(--lane, 0));
height: 18px; border-radius: var(--radius-sm); min-width: 6px;
display: flex; align-items: center; gap: var(--sp-1); padding: 0 var(--sp-2);
color: #fff; font-size: var(--text-xs); white-space: nowrap; overflow: hidden;
cursor: grab; touch-action: none; z-index: 2;
/**/
box-shadow: inset 0 0 0 999px rgba(0, 0, 0, .35);
}
/**/
.gantt-bar[hidden], .gb-dot[hidden], .gantt-mk[hidden], .gantt-today[hidden] {
display: none;
}
.gb-text { overflow: hidden; text-overflow: ellipsis; }
/**/
.gb-grip {
position: absolute; top: 0; bottom: 0; width: min(8px, 45%);
cursor: ew-resize; opacity: .5;
/**/
z-index: 1;
}
.gb-grip-s { left: 0; box-shadow: inset 1px 0 0 rgba(255, 255, 255, .85); }
.gb-grip-e { right: 0; box-shadow: inset -1px 0 0 rgba(255, 255, 255, .85); }
.gantt-bar:hover .gb-grip { opacity: 1; }
/**/
.gb-dot {
position: absolute; top: calc(16px + var(--row-h) * var(--lane, 0));
width: 11px; height: 11px; margin-top: -5.5px;
border-radius: var(--radius-circle); background: var(--bg);
border: 2px solid var(--fg-soft);
opacity: 0; cursor: crosshair; z-index: 5;
/**/
touch-action: none;
transition: opacity .12s var(--ease), transform .12s var(--ease),
border-color .12s var(--ease);
}
.gantt-bar:hover + .gb-dot,
.gantt-bar:hover + .gb-dot + .gb-dot,
.gb-dot:hover,
.gb-dot:hover + .gb-dot,
.gb-dot:focus-visible,
.gb-dot.is-armed,
.gantt-linking .gb-dot { opacity: 1; }
.gb-dot:hover { transform: scale(1.25); border-color: var(--brass); }
/**/
.gb-dot.is-armed { background: var(--brass); border-color: var(--brass); }
/**/
.gantt-row.is-target { background: color-mix(in srgb, var(--fg-soft) 12%, transparent); }
.gantt-row.is-target .gantt-bar, .gantt-bar.is-target {
box-shadow: inset 0 0 0 999px rgba(0, 0, 0, .35), 0 0 0 2px var(--brass);
}
/**/
.gantt-linking .gantt-row { cursor: crosshair; }
/**/
.gantt-mk {
position: absolute; top: calc(12px + var(--row-h) * var(--lane, 0));
width: 9px; height: 9px; z-index: 3;
transform: translateX(-50%) rotate(45deg);
background: var(--card); border: 1.5px solid var(--brass); border-radius: 0;
}
.gantt-mk.done { background: var(--brass); }
/**/
.gantt-today {
position: absolute; top: 0; bottom: 0; width: var(--gantt-day);
background: var(--brass-soft); z-index: 1; pointer-events: none;
border-left: 1px solid color-mix(in srgb, var(--brass) 45%, transparent);
border-right: 1px solid color-mix(in srgb, var(--brass) 45%, transparent);
}
/**/
.gantt-links {
position: absolute; inset: 0; z-index: 4; pointer-events: none;
overflow: visible;
}
/**/
.gantt-links .gl-line {
fill: none; stroke: var(--fg-soft); stroke-width: 1.5;
transition: stroke .12s var(--ease), stroke-width .12s var(--ease);
}
/**/
@media (prefers-reduced-motion: reduce) {
.gantt-links .gl-line { transition: none; }
}
/**/
.gantt-links .gl-rubber {
fill: none; stroke: var(--brass); stroke-width: 2;
stroke-dasharray: 5 4; stroke-linecap: round; pointer-events: none;
}
/**/
.gantt-links .gl-hit {
fill: none; stroke: transparent; stroke-width: 12;
pointer-events: stroke; cursor: pointer;
}
/**/
.gantt-links .gl-x { cursor: pointer; pointer-events: none; opacity: 0; }
/**/
.gantt-links .gl:hover .gl-x,
.gantt-links .gl.is-armed .gl-x,
.gantt-links .gl:focus-within .gl-x { pointer-events: all; opacity: 1; }
.gantt-links .gl-x-hit { fill: transparent; }
.gantt-links .gl-x-dot { fill: var(--card); stroke: var(--fg-soft); stroke-width: 1.5; }
.gantt-links .gl-x-mark {
fill: none; stroke: var(--fg-soft); stroke-width: 1.6; stroke-linecap: round;
}
/**/
.gantt-links .gl-x:hover .gl-x-dot, .gantt-links .gl-x:focus-visible .gl-x-dot {
fill: var(--error); stroke: var(--error);
}
.gantt-links .gl-x:hover .gl-x-mark, .gantt-links .gl-x:focus-visible .gl-x-mark {
stroke: var(--on-brass);
}
/**/
.gantt-links .gl:hover .gl-line,
.gantt-links .gl.is-armed .gl-line,
.gantt-links .gl:focus-within .gl-line {
stroke: var(--error); stroke-width: 2.5;
}
/**/
.gantt-undo { margin-left: var(--sp-2); }
.gantt-bar-row { margin-bottom: var(--sp-3); }
/**/
#gantt-notice { position: relative; z-index: 20; }
#gantt-notice .callout {
position: absolute; top: 0; left: 0; right: 0; box-shadow: var(--shadow);
}
/**/
.gantt-bar-row .filter-select {
flex-direction: row; align-items: center; gap: var(--sp-2);
}
/**/
#gantt-scroll, .gantt-bar { -webkit-user-select: none; user-select: none; }
body.gantt-dragging { -webkit-user-select: none; user-select: none; cursor: grabbing; }
body.gantt-dragging .gantt-bar { cursor: grabbing; }
/**/
.gb-clash { outline: 2px solid var(--error); outline-offset: 1px; }
/**/
.crew-clash-list { margin: var(--sp-2) 0; padding-left: var(--sp-4); }
.crew-clash-list li { margin: 2px 0; }
/**/
.crew { display: inline-flex; gap: var(--sp-1); }
.crew .av {
width: 24px; height: 24px; border-radius: var(--radius-circle);
background: var(--card-2); border: 1px solid var(--border-2); color: var(--fg-soft);
font-size: var(--text-2xs); font-weight: 700;
display: flex; align-items: center; justify-content: center;
}
/**/
.src-bar {
display: inline-block; vertical-align: middle; height: 10px;
border-radius: var(--radius-sm); background: var(--brass); margin-right: var(--sp-1-5); max-width: 100%;
}
/**/
.setting-row {
display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap;
background: var(--card); border: 1px solid var(--border);
border-radius: var(--radius-md); padding: var(--sp-3) var(--sp-4); margin-bottom: var(--sp-2);
}
.setting-key { font-weight: 500; }
.setting-masked { font-size: var(--text-sm); color: var(--muted); }
.setting-updated { font-size: var(--text-sm); color: var(--muted); margin-left: auto; }
.setting-row form { display: flex; gap: var(--sp-2); flex: 1 1 100%; margin: 0; }
.setting-row form input { flex: 1 1 auto; }
/**/
.site-measure { font-size: var(--text-base); }
.sm-head { display: flex; gap: var(--sp-3); align-items: baseline; flex-wrap: wrap; margin-bottom: var(--sp-3); }
.sm-ver { font-weight: 600; }
.sm-src, .sm-date, .sm-muted { font-size: var(--text-xs); color: var(--muted); }
.sm-notes { margin: var(--sp-1-5) 0; }
.sm-brief { margin: var(--sp-2) 0; }
.sm-brief summary { cursor: pointer; color: var(--brass-2); }
.sm-brief p { white-space: pre-wrap; margin: var(--sp-1-5) 0 0; color: var(--fg-soft); }
.sm-thumbs { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-1-5); }
.sm-thumbs img { width: 96px; height: 96px; object-fit: cover; border-radius: var(--radius-sm); border: 1px solid var(--border); }
.sm-quotes { margin-top: var(--sp-3); }
.sm-quotes a, .sm-photos a { color: var(--brass-2); }
/**/
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: var(--sp-5); }
.login-card {
background: var(--card); border: 1px solid var(--border);
border-radius: var(--radius-lg); box-shadow: var(--shadow);
padding: var(--sp-6) var(--sp-5); width: 100%; max-width: 360px;
}
/**/
.login-card h1 { margin: 0 0 var(--sp-1-5); }
.login-card .sub { margin: 0 0 var(--sp-5); font-size: var(--text-base); color: var(--muted); }
.login-card label { display: block; margin-bottom: var(--sp-3); }
.login-card label span { display: block; margin-bottom: var(--sp-1); }
.login-card input, .login-card .btn-primary { width: 100%; }
.login-card .btn-primary { margin-top: var(--sp-1); padding: var(--sp-2-5) var(--sp-4); }
.form-error {
padding: var(--sp-2) var(--sp-3); margin-bottom: var(--sp-4);
border-radius: var(--radius-md); font-size: var(--text-base); color: var(--error);
background: color-mix(in srgb, var(--error) 14%, transparent);
border: 1px solid color-mix(in srgb, var(--error) 45%, transparent);
}
/**/
/**/
.theme-toggle { font-size: var(--text-md); }
/**/
/**/
.page-head-text { min-width: 0; }
.page-sub { margin: var(--sp-1) 0 0; font-size: var(--text-base); color: var(--muted); }
/**/
.card-title { margin: 0 0 var(--sp-3); }
/**/
.card-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-3); }
/**/
.card.flush { padding: 0; overflow: hidden; }
/**/
.status-badge {
display: inline; padding: 0; border: 0; background: none;
font-size: var(--text-xs); font-weight: 400; letter-spacing: 0;
text-transform: none; white-space: nowrap;
}
/**/
.status-badge.status-ok,
.status-badge.status-neutral,
.status-badge.status-unknown { color: var(--muted); }
/**/
.status-badge.status-info,
.status-badge.status-warn,
.status-badge.status-error,
/**/
.status-badge.status-brass { color: var(--brass); }
/**/
.status-badge.status-draft,
.status-badge.status-accepted,
.status-badge.status-approved { color: var(--brass); }
/**/
.status-badge.status-settled { color: var(--muted); }
.status-badge.status-live { color: var(--brass); }
/**/
.line-name { font-weight: 600; color: var(--fg); }
.line-price-control { display: inline-flex; flex-direction: column; align-items: flex-end; }
.line-price-field { display: inline-flex; align-items: center; gap: var(--sp-1); }
.line-price-field input { width: 8.5em; min-width: 0; text-align: right; }
.line-price-origin { display: block; margin-top: 2px; font-size: var(--text-2xs); }
.proposal-price-actions {
display: grid; grid-template-columns: max-content minmax(0, 1fr);
align-items: start; gap: var(--sp-3) var(--sp-2);
margin-top: var(--sp-4); padding-top: var(--sp-4);
border-top: 1px solid var(--border);
}
.proposal-line-adder { min-width: 0; }
.proposal-line-adder[open] { display: contents; }
/**/
.proposal-line-adder[open]::details-content { display: contents; }
.proposal-price-actions > button { justify-self: start; }
.proposal-line-adder > summary {
width: max-content; max-width: 100%; list-style: none;
}
.proposal-line-adder > summary::-webkit-details-marker { display: none; }
.proposal-line-adder[open] > summary {
border-color: var(--brass); color: var(--brass-2);
}
.proposal-line-adder-panel {
grid-column: 1 / -1; padding: var(--sp-4);
border: 1px solid var(--border); border-radius: var(--radius-md);
background: var(--card-2);
}
.proposal-line-adder-panel > p { margin: 0 0 var(--sp-4); }
.proposal-line-actions {
display: flex; align-items: center; justify-content: flex-end; gap: var(--sp-2);
}
.proposal-lines th:last-child { text-align: right; }
.proposal-lines td[data-label="Qty"], .proposal-lines td.row-actions { width: 1%; white-space: nowrap; }
.proposal-line-actions .confirm-pop { white-space: normal; text-align: left; }
.proposal-lines .checkbox, .proposal-line-adder-panel .checkbox { min-height: 44px; }
.proposal-line-editor .collapsed-card { margin-top: var(--sp-4); }
/**/
.kpi-row { display: flex; flex-wrap: wrap; gap: var(--sp-5); }
.kpi { flex: 1 1 160px; min-width: 0; }
.kpi-num, .kpi-value { font-size: var(--text-3xl); line-height: 1; }
.kpi-sub, .kpi-foot { font-size: var(--text-sm); color: var(--muted); margin-top: var(--sp-1-5); }
/**/
.actions-row { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; }
/**/
.cell-actions { display: flex; align-items: center; gap: var(--sp-2);
justify-content: space-between; white-space: nowrap; }
.cell-actions form { display: contents; }
/**/
.detail-grid {
display: grid; grid-template-columns: minmax(0, 1fr) 360px;
gap: var(--sp-4); align-items: start;
}
/**/
.detail-grid:has(> .detail-main:only-child) { grid-template-columns: minmax(0, 1fr); }
.detail-main { min-width: 0; }
.detail-rail { display: flex; flex-direction: column; gap: var(--sp-3); min-width: 0; }
.detail-rail .card { margin-bottom: 0; }
.pdf-frame { display: block; width: 100%; height: 980px; border: 0; background: var(--card-2); }
/**/
.detail-back { margin: 0 0 var(--sp-2); }
.back { font-size: var(--text-sm); color: var(--muted); }
.back:hover { color: var(--fg); text-decoration: underline; }
/**/
.tab-nav {
display: flex; gap: 2px; margin: 0 0 var(--sp-4);
border-bottom: 1px solid var(--border);
/**/
overflow-x: auto; -webkit-overflow-scrolling: touch;
scrollbar-width: none; /**/
-ms-overflow-style: none; /**/
}
/**/
.tab-nav::-webkit-scrollbar { display: none; }
.tab {
padding: var(--sp-2-5) var(--sp-3); font-size: var(--text-base); font-weight: 500; white-space: nowrap;
color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.tab:hover { color: var(--fg-soft); }
.tab.on { color: var(--fg); border-bottom-color: var(--brass); }
/**/
.tab-nav.tab-nav-wrap { flex-wrap: wrap; overflow-x: visible; }
/**/
.callout {
border-left: 3px solid var(--border-2); padding: var(--sp-2-5) var(--sp-3);
border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
margin-bottom: var(--sp-4); font-size: var(--text-base); color: var(--fg-soft);
}
.callout-brass { border-left-color: var(--brass); background: var(--brass-soft); }
.callout-ok { border-left-color: var(--ok); background: color-mix(in srgb, var(--ok) 10%, transparent); }
.callout-info { border-left-color: var(--info); background: color-mix(in srgb, var(--info) 10%, transparent); }
.callout-warn { border-left-color: var(--warn); background: color-mix(in srgb, var(--warn) 10%, transparent); }
.callout-error { border-left-color: var(--error); background: color-mix(in srgb, var(--error) 10%, transparent); }
.callout-foot { margin-top: var(--sp-2-5); }
/**/
.callout ul { margin: 0; padding-left: var(--sp-4); }
/**/
.lede { margin: 0; font-size: var(--text-base); font-weight: 500; }
/**/
main tbody tr.row-optional td { color: var(--muted); }
/**/
.note.ok { color: var(--ok); }
.note.error { color: var(--error); }
/**/
.prop-list {
display: grid; grid-template-columns: auto minmax(0, 1fr);
gap: var(--sp-2) var(--sp-4); margin: 0; font-size: var(--text-base); align-items: baseline;
}
.prop-list dd { margin: 0; overflow-wrap: anywhere; }
/**/
.prop-list dd.big { font-size: var(--text-xl); }
/**/
.stage-line {
display: flex; justify-content: space-between; gap: var(--sp-3);
padding: var(--sp-1) 0; font-size: var(--text-sm); color: var(--fg-soft);
}
.stage-pct { color: var(--muted); }
.stage-line.current, .stage-line.current .stage-pct { color: var(--brass-2); font-weight: 600; }
/**/
.form-row { display: flex; gap: var(--sp-3); align-items: stretch; flex-wrap: wrap; }
.form-row input, .form-row select { flex: 1 1 240px; min-width: 0; }
/**/
.form-row > button, .form-row > .btn-primary, .form-row > .btn-secondary { align-self: flex-end; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3) var(--sp-4); }
/**/
.field { display: block; min-width: 0; }
.field > span { display: block; margin-bottom: var(--sp-1); }
.field input, .field select, .field textarea { width: 100%; }
/**/
.proposal-form .grid-2 + .field,
.proposal-form .grid-2 + .checkbox,
.proposal-form .checkbox + .checkbox { margin-top: var(--sp-3); }
.proposal-form .proposal-extras { min-width: 640px; }
.proposal-form .proposal-extras th:not(:nth-child(2)),
.proposal-form .proposal-extras td:not(:nth-child(2)) { width: 1%; white-space: nowrap; }
.proposal-form .proposal-extras input[type="number"] { width: 6em; min-width: 6em; }
.proposal-form .proposal-extras input[type="checkbox"] { width: auto; margin: 0; }
.proposal-form .proposal-extras small { display: block; }
/**/
.checkbox { display: flex; align-items: center; gap: var(--sp-2); font-size: var(--text-base); }
.checkbox input, .proposal-form .checkbox input { width: auto; flex: 0 0 auto; }
.form-foot {
display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap;
margin-top: var(--sp-4); padding-top: var(--sp-4); border-top: 1px solid var(--border);
}
/**/
.account-form { max-width: 420px; }
.account-form .field + .field { margin-top: var(--sp-3); }
.account-form .field small { display: block; margin-top: var(--sp-1); font-size: var(--text-sm); }
/**/
.btn-danger {
display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-1-5);
padding: var(--sp-2) var(--sp-4); border-radius: var(--radius-md);
background: transparent; color: var(--error);
border: 1px solid color-mix(in srgb, var(--error) 55%, transparent);
font-size: var(--text-base); font-weight: 600; cursor: pointer; white-space: nowrap;
transition: border-color .12s;
}
.btn-danger:hover { border-color: var(--error); }
.btn-block { width: 100%; }
/**/
.stack { display: flex; flex-direction: column; gap: var(--sp-2); }
/**/
/**/
/**/
.mode-control { display: inline-flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }
/**/
.mode-toggle { display: inline-flex; align-items: baseline; gap: var(--sp-3); flex-wrap: wrap; }
/**/
.jd-cl-legend { margin: 0 0 14px; font-size: var(--text-sm); }
/**/
.saved-flash { color: var(--ok); font-size: var(--text-sm); white-space: nowrap; }
/**/
.thread-head {
display: flex; align-items: baseline; justify-content: space-between;
gap: var(--sp-3); margin: var(--sp-4) 0 var(--sp-2-5);
padding-top: var(--sp-3); border-top: 1px solid var(--border);
}
.thread-title {
margin: 0; font-family: var(--font-body); font-size: var(--text-base);
font-weight: 600; color: var(--fg);
}
.thread-count { font-size: var(--text-xs); color: var(--muted); white-space: nowrap; }
.thread { display: flex; flex-direction: column; gap: var(--sp-3); }
.thread .msg {
width: fit-content; max-width: min(74%, 760px); margin: 0; padding: 0;
overflow: hidden; line-height: 1.55;
}
.thread .msg.outbound { align-self: flex-end; }
.thread .msg.inbound { align-self: flex-start; }
/**/
.thread .msg.channel-email {
width: min(88%, 860px); max-width: 860px;
background: var(--card); border: 1px solid var(--border-2);
}
.thread .msg.channel-email.inbound { border-left: 3px solid var(--border-2); }
.thread .msg.channel-email.outbound { border-left: 3px solid var(--brass); }
.msg-head {
display: flex; align-items: center; justify-content: space-between;
gap: var(--sp-3); padding: var(--sp-2) var(--sp-3) 0;
}
.channel-email .msg-head {
padding-bottom: var(--sp-2); border-bottom: 1px solid var(--border);
}
.msg-head-main { display: flex; align-items: center; gap: var(--sp-2); min-width: 0; }
.msg-direction { font-size: var(--text-sm); color: var(--fg-soft); }
.msg-time { flex: 0 0 auto; font-size: var(--text-xs); color: var(--muted); }
.msg-content { padding: var(--sp-2) var(--sp-3) var(--sp-2-5); }
.channel-email .msg-content { padding-top: var(--sp-3); }
.msg-body { white-space: pre-wrap; overflow-wrap: anywhere; }
.msg-body a { color: var(--brass-2); text-decoration: underline; text-underline-offset: 2px; }
/**/
.msg-subject {
display: grid; gap: 2px; overflow-wrap: anywhere;
padding-bottom: var(--sp-2); margin-bottom: var(--sp-2);
border-bottom: 1px solid var(--border);
}
.msg-subject-label { font-size: var(--text-xs); color: var(--muted); }
.msg-subject strong { font-size: var(--text-base); font-weight: 600; color: var(--fg); }
/**/
.msg-meta {
display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-1-5) var(--sp-2-5);
margin-top: var(--sp-2); padding-top: var(--sp-2);
border-top: 1px solid var(--border); font-size: var(--text-xs); color: var(--muted);
}
.msg-meta-state, .msg-meta-item { display: inline-flex; align-items: center; }
/**/
.msg-link { color: inherit; text-decoration: none; }
.msg-link:hover, .msg-link:focus-visible { color: var(--fg); text-decoration: underline; }
/**/
.msg-media { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin-top: var(--sp-1-5); }
.msg-media img {
width: 132px; height: 132px; object-fit: cover; display: block;
border-radius: var(--radius-sm); border: 1px solid var(--border-2);
}
.msg-media-file { font-size: var(--text-xs); color: var(--brass-2); }
/**/
.msg-media-item { margin: 0; display: flex; flex-direction: column; gap: var(--sp-1); }
.msg-media-name {
font-size: var(--text-xs); max-width: 220px;
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.msg-media-name a { color: var(--brass-2); text-decoration: none; }
.msg-media-name a:hover, .msg-media-name a:focus-visible { text-decoration: underline; }
/**/
.msg-links { margin-top: var(--sp-1-5); font-size: var(--text-xs); }
.msg-links summary { color: var(--muted); cursor: pointer; }
.msg-links summary:hover { color: var(--fg); }
.msg-links a {
display: block; margin-top: var(--sp-1); color: var(--brass-2); overflow-wrap: anywhere;
}
/**/
.msg-media-video {
width: 220px; max-width: 100%; height: auto; display: block;
border-radius: var(--radius-sm); border: 1px solid var(--border-2);
/**/
background: var(--bg-2);
}
@media (max-width: 760px) {
.thread-head { align-items: center; }
/**/
.thread { padding-bottom: 68px; }
.thread .msg { width: 96%; max-width: 96%; }
.thread .msg.channel-email { width: 100%; max-width: 100%; }
.msg-head { align-items: flex-start; flex-wrap: wrap; }
.msg-head-main { flex-wrap: wrap; }
.msg-content { padding-right: var(--sp-2-5); padding-left: var(--sp-2-5); }
}
/**/
/**/
.composer { position: relative; }
.composer-input {
width: 100%; box-sizing: border-box; resize: none; overflow-y: auto;
min-height: 2.4em; max-height: 320px; line-height: 1.45;
}
.composer-bar {
display: flex; align-items: center; justify-content: space-between;
gap: var(--sp-2); flex-wrap: wrap;
}
/**/
.composer-attach {
display: inline-flex; align-items: center; gap: var(--sp-1-5); cursor: pointer;
padding: var(--sp-1) var(--sp-2-5); border: 1px solid var(--border); border-radius: var(--radius-md);
font-size: var(--text-sm); color: var(--muted); background: var(--card-2);
}
.composer-attach:hover { color: var(--fg); border-color: var(--brass); }
.composer-file {
position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
.composer-count { font-size: var(--text-xs); color: var(--muted); }
/**/
.composer-count-wide { color: var(--warn); }
.composer-files { font-size: var(--text-xs); color: var(--brass-2); }
.composer-files-bad { color: var(--error); }
/**/
/**/
.composer-chip {
display: inline-flex; align-items: center; gap: var(--sp-2); padding: var(--sp-1) var(--sp-1-5) var(--sp-1) var(--sp-1);
margin: var(--sp-1-5) var(--sp-1-5) 0 0; vertical-align: middle;
border: 1px solid var(--border); border-radius: var(--radius-md);
background: var(--card-2); max-width: 260px;
}
.composer-chip-thumb {
width: 40px; height: 40px; flex: 0 0 auto; object-fit: cover;
border-radius: var(--radius-sm); background: var(--bg-2); display: block;
}
.composer-chip-glyph {
display: flex; align-items: center; justify-content: center; font-size: var(--text-lg);
}
.composer-chip-text {
display: flex; flex-direction: column; min-width: 0; color: var(--fg);
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.composer-chip-text small { color: var(--muted); font-size: var(--text-2xs); }
/**/
.composer-chip-remove:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
flex: 0 0 auto; padding: 0; width: 22px; height: 22px; line-height: 1;
font-size: var(--text-md); border-radius: var(--radius-circle);
background: transparent; border: 1px solid transparent; color: var(--muted);
}
.composer-chip-remove:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip):hover {
color: var(--error); border-color: var(--border-2); background: var(--card);
}
/**/
.msg-media-gone {
display: inline-block; padding: 2px var(--sp-2); border-radius: var(--radius-sm);
border: 1px dashed var(--border-2); font-size: var(--text-xs); color: var(--muted);
}
/**/
.note-list { display: flex; flex-direction: column; gap: var(--sp-2); margin-bottom: var(--sp-4); }
.note-row {
display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sp-2);
padding-bottom: var(--sp-2); border-bottom: 1px solid var(--border); font-size: var(--text-base);
}
.note-row:last-child { border-bottom: 0; padding-bottom: 0; }
.note-author { color: var(--brass-2); }
/**/
.note-kind {
font-size: var(--text-xs); font-weight: 400; letter-spacing: 0;
text-transform: none; color: var(--muted);
}
.note-body { flex: 1 1 100%; color: var(--fg-soft); overflow-wrap: anywhere; }
.note-ts { font-size: var(--text-xs); color: var(--muted); margin-left: auto; }
/**/
.collapsed-card {
background: var(--card); border: 1px solid var(--border);
border-radius: var(--radius-lg); margin-bottom: var(--sp-3);
}
.collapsed-card > summary { cursor: pointer; padding: var(--sp-3) var(--sp-4); }
.collapsed-card > summary:hover { color: var(--brass-2); }
.collapsed-card[open] > summary { border-bottom: 1px solid var(--border); }
.collapsed-card > div { padding: var(--sp-4); }
/**/
.site-measure { display: flex; flex-direction: column; gap: var(--sp-3); }
.sm-head { display: flex; align-items: baseline; gap: var(--sp-3); flex-wrap: wrap; }
.sm-ver { font-weight: 700; }
.sm-src, .sm-date, .sm-muted { font-size: var(--text-sm); color: var(--muted); }
.sm-notes { margin: 0; font-size: var(--text-base); color: var(--fg-soft); }
.sm-brief > summary { cursor: pointer; font-size: var(--text-sm); color: var(--muted); }
.sm-photos, .sm-quotes { font-size: var(--text-base); }
.sm-thumbs { display: flex; gap: var(--sp-2); flex-wrap: wrap; margin-top: var(--sp-2); }
.sm-thumbs img {
width: 78px; height: 60px; object-fit: cover; border-radius: var(--radius-sm);
border: 1px solid var(--border-2); display: block;
}
.sm-quotes a { color: var(--brass-2); }
@media (max-width: 980px) {
/**/
.detail-grid { grid-template-columns: 1fr; }
}
/**/
@media (min-width: 761px) {
#kanban-board, .kanban-cards { scrollbar-width: thin; scrollbar-color: var(--border-2) transparent; }
}
/**/
body.kanban-dragging #kanban-board { scroll-snap-type: none; }
/**/
.kb-jump { display: none; margin: 0 0 var(--sp-2); }
.kb-crumbs {
display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-1-5);
margin: 0; padding: 0; list-style: none;
font-size: var(--text-base); color: var(--muted);
}
.kb-crumb-item, .kb-crumb-sep { display: inline-flex; align-items: center; }
.kb-crumb-item[hidden], .kb-crumb-sep[hidden] { display: none; }
.kb-crumb-sep svg { width: 14px; height: 14px; }
/**/
.kb-crumb-page { color: var(--fg); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kb-crumbs > .kb-crumb-item:last-child { min-width: 0; flex: 0 1 auto; }
.kb-crumb:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
margin: 0; padding: var(--sp-1) 0; min-height: 0; height: auto;
background: none; border: 0; border-radius: 0; box-shadow: none;
font: inherit; font-weight: 400; color: inherit; text-align: left;
cursor: pointer; transition: color .12s var(--ease);
}
.kb-crumb:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip):hover {
color: var(--fg); background: none;
}
/**/
.kb-crumb-more:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
display: inline-flex; align-items: center; justify-content: center;
width: 36px; height: 36px; padding: 0;
}
.kb-crumb-more svg { width: 16px; height: 16px; }
/**/
#kanban-jump-menu [aria-current]::after {
content: "Current"; margin-left: auto; padding-left: var(--sp-3);
font-size: var(--text-xs); color: var(--muted);
}
@media (max-width: 760px) {
/**/
.sidebar {
position: fixed; left: 0; top: var(--topbar-h);
height: calc(100vh - var(--topbar-h));
height: calc(100dvh - var(--topbar-h));
transform: translateX(-100%);
transition: transform .2s; box-shadow: var(--shadow); z-index: 50;
}
body.nav-open .sidebar { transform: none; }
/**/
#navToggle { display: none; }
/**/
.modal.kb-move {
width: 100%; max-width: 100%; margin: auto 0 0;
border-radius: var(--radius-lg) var(--radius-lg) 0 0; border-bottom: 0;
animation: kb-sheet-up .2s var(--ease);
}
.kb-move-body { padding-bottom: calc(var(--sp-5) + env(safe-area-inset-bottom, 0px)); }
/**/
body.nav-open .nav-backdrop {
display: block; position: fixed; inset: 0; background: rgba(0,0,0,.4);
z-index: 49; backdrop-filter: blur(2px);
}
/**/
#kanban-board { grid-template-columns: repeat(6, 85%); scroll-snap-type: x mandatory; }
.kanban-col { scroll-snap-align: start; }
.kb-jump { display: block; }
main { padding: var(--sp-4); }
/**/
.grid-2 { grid-template-columns: 1fr; }
.proposal-form .grid-2 { grid-template-columns: 1fr; }
.proposal-form label,
.proposal-form .card,
.proposal-form input,
.proposal-form select,
.proposal-form textarea { width: 100%; box-sizing: border-box; }
input, select, textarea, button { font-size: var(--text-touch); } /**/
/**/
.filter-bar select, .filter-select select { font-size: var(--text-touch); }
/**/
button, .btn-primary, .btn-secondary { min-height: 44px; padding: var(--sp-3) var(--sp-4); }
.icon-btn { padding: 0; width: 40px; height: 40px; min-height: 40px; }
/**/
main th, main td { padding: var(--sp-2-5) var(--sp-3); font-size: var(--text-base); }
.table-wrap table { min-width: max-content; }
/**/
#leads-results .table-wrap table { min-width: 560px; }
/**/
#leads-results th, #leads-results .sort-header { white-space: normal; }
/**/
#leads-results th:first-child,
#leads-results td:first-child {
position: sticky; left: 0; z-index: 2; min-width: 17ch;
background: var(--card); border-right: 1px solid var(--border);
}
#leads-results thead th:first-child { background: var(--card-2); }
/**/
#leads-results tbody tr:hover td:first-child,
#leads-results tbody tr:focus-within td:first-child,
#leads-results tbody tr:target td:first-child { background: var(--card-2); }
/**/
.table-stack { border: 0; background: transparent; overflow: visible; }
.table-stack table { min-width: 0; }
.table-stack thead {
position: absolute; width: 1px; height: 1px; overflow: hidden;
clip: rect(0 0 0 0); white-space: nowrap;
}
.table-stack tbody tr {
display: block; margin-bottom: var(--sp-2); padding: var(--sp-2) var(--sp-3);
background: var(--card); border: 1px solid var(--border); border-radius: var(--radius-md);
}
.table-stack tbody tr:hover td { background: transparent; }
.table-stack td {
display: flex; align-items: baseline; gap: var(--sp-3);
padding: var(--sp-1) 0; border: 0; font-size: var(--text-base);
/**/
height: auto;
}
.table-stack td::before {
content: attr(data-label); flex: 0 0 38%;
font-size: var(--text-xs); color: var(--muted);
}
/**/
.table-stack td:first-child {
display: block; padding-top: 0; padding-bottom: var(--sp-2);
font-size: var(--text-md); font-weight: 600;
border-bottom: 1px solid var(--border); margin-bottom: var(--sp-1);
}
.table-stack td:first-child::before { content: none; }
.table-stack td:last-child { padding-bottom: 0; }
/**/
.table-stack .cell-text { max-width: none; }
.table-stack td.empty-state { display: block; }
.table-stack td.empty-state::before { content: none; }
/**/
.table-stack .row-actions { justify-content: flex-end; width: auto; text-align: right; }
.table-stack .row-actions::before { content: none; }
/**/
.table-stack.table-centre td { text-align: left; }
/**/
.row-menu-btn { opacity: 1; border-color: var(--border-2); background: var(--card); }
/**/
.modal { width: 100%; max-width: 100%; padding: var(--sp-4); }
/**/
.kpi-row { flex-direction: column; gap: var(--sp-3); }
.kpi { width: 100%; }
/**/
.page-head { flex-direction: column; align-items: stretch; gap: var(--sp-3); }
.page-head-actions > * { flex: 1 1 auto; }
/**/
/**/
.page-head-actions > .icon-btn { flex: 0 0 auto; margin-left: auto; }
/**/
.actions-row { flex-direction: column; align-items: stretch; gap: var(--sp-2); }
.actions-row form, .actions-row a { display: block; width: 100%; }
.actions-row form button { width: 100%; }
/**/
.jarvis-panel {
position: fixed; inset: 0;
width: 100%; max-width: none; height: auto; max-height: none;
border-radius: 0;
padding-top: env(safe-area-inset-top, 0px);
}
.jarvis-grip, .jarvis-maximise { display: none; }
/**/
body.jarvis-maxed .jarvis-panel { display: flex; flex-direction: column; }
body.jarvis-maxed .jarvis-side { display: none; }
body.jarvis-maxed .jarvis-body { padding: 16px; }
.jarvis-fab { right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); }
.jarvis-input input { font-size: var(--text-touch); } /**/
/**/
.jarvis-mic { width: 64px; height: 64px; font-size: var(--text-2xl); }
.jarvis-voice { font-size: var(--text-touch); padding: var(--sp-3) var(--sp-4); }
/**/
.filter-bar { gap: var(--sp-2); }
.filter-bar label, .filter-bar input, .filter-bar input[type="search"],
.filter-bar select, .filter-bar button, .filter-bar .btn-secondary { flex: 1 1 100%; min-width: 0; }
.filter-bar .spacer { margin-left: 0; }
/**/
.filter-menu-panel { left: 0; right: auto; }
/**/
.gantt { --gantt-name-w: 132px; }
/**/
.setting-row { align-items: flex-start; }
.setting-updated { margin-left: 0; flex: 1 1 100%; }
/**/
.kbar { display: none; }
/**/
.account-name { display: none; }
.account-menu { right: calc(12px + var(--safe-area-right)); }
/**/
.topbar {
padding: calc(var(--sp-2) + var(--safe-area-top))
calc(var(--sp-3) + var(--safe-area-right))
var(--sp-2)
calc(var(--sp-3) + var(--safe-area-left));
gap: var(--sp-2); z-index: 51;
}
}
/**/
.job .jd-cl-empty {
text-align: center; padding: var(--sp-6) var(--sp-4);
display: flex; flex-direction: column; gap: var(--sp-2); align-items: center;
}
.job .jd-cl-empty-ico { font-size: var(--text-3xl); opacity: .8; }
.job .jd-cl-empty p { margin: 0; max-width: 46ch; }
.job .jd-cl-topbar {
display: flex; align-items: center; gap: var(--sp-3);
flex-wrap: wrap; margin-bottom: var(--sp-4);
}
.job .jd-cl-signed { font-size: var(--text-sm); }
/**/
.job .jd-sc-docx { margin-left: auto; }
.job .jd-cl-form { display: flex; flex-direction: column; gap: var(--sp-4); }
.job .jd-cl-sec {
border: 1px solid var(--border); border-radius: var(--radius-md);
padding: var(--sp-4); margin: 0;
display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3);
}
/**/
.job .jd-cl-sec legend {
grid-column: 1 / -1; padding: 0 var(--sp-2); color: var(--brass-2);
font-size: var(--text-xs); font-weight: 600; letter-spacing: .14em;
text-transform: uppercase;
}
.job .jd-cl-field { display: flex; flex-direction: column; gap: var(--sp-1); min-width: 0; }
.job .jd-cl-field.jd-cl-wide { grid-column: 1 / -1; }
/**/
.job .jd-cl-sec > .form-foot { grid-column: 1 / -1; }
.job .jd-cl-field input, .job .jd-cl-field select, .job .jd-cl-field textarea { width: 100%; }
.job .jd-req { color: var(--brass); }
/**/
.job .jd-cl-field[hidden] { display: none; }
.field[hidden] { display: none; }
.sched-range { display: flex; align-items: center; gap: var(--sp-2); }
.sched-range input { flex: 1 1 auto; min-width: 0; }
.sched-range .icon-btn { flex: 0 0 auto; }
/**/
body > .flatpickr-calendar {
background: var(--card); color: var(--fg);
border: 1px solid var(--border-2); border-radius: var(--radius-md);
box-shadow: var(--shadow);
}
/**/
body > .flatpickr-calendar.arrowTop::before, body > .flatpickr-calendar.arrowTop::after,
body > .flatpickr-calendar.arrowBottom::before, body > .flatpickr-calendar.arrowBottom::after {
display: none;
}
body > .flatpickr-calendar .flatpickr-months .flatpickr-month,
body > .flatpickr-calendar .flatpickr-current-month input.cur-year,
body > .flatpickr-calendar .flatpickr-current-month .flatpickr-monthDropdown-months {
color: var(--fg); fill: var(--fg);
}
body > .flatpickr-calendar .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
background: var(--card); color: var(--fg);
}
body > .flatpickr-calendar span.flatpickr-weekday { color: var(--muted); }
body > .flatpickr-calendar .flatpickr-months .flatpickr-prev-month svg,
body > .flatpickr-calendar .flatpickr-months .flatpickr-next-month svg { fill: var(--fg-soft); }
body > .flatpickr-calendar .flatpickr-months .flatpickr-prev-month:hover svg,
body > .flatpickr-calendar .flatpickr-months .flatpickr-next-month:hover svg { fill: var(--brass); }
body > .flatpickr-calendar .numInputWrapper span { border-color: var(--border); }
body > .flatpickr-calendar .numInputWrapper:hover,
body > .flatpickr-calendar .numInputWrapper span:hover { background: var(--card-2); }
/**/
body > .flatpickr-calendar .flatpickr-current-month .numInputWrapper span.arrowUp::after {
border-bottom-color: var(--fg-soft);
}
body > .flatpickr-calendar .flatpickr-current-month .numInputWrapper span.arrowDown::after {
border-top-color: var(--fg-soft);
}
/**/
body > .flatpickr-calendar .flatpickr-current-month .flatpickr-monthDropdown-months:hover {
background: var(--card-2);
}
/**/
body > .flatpickr-calendar .dayContainer + .dayContainer { box-shadow: -1px 0 0 var(--border); }
body > .flatpickr-calendar .flatpickr-day {
color: var(--fg-soft); border-color: transparent; border-radius: var(--radius-sm);
}
body > .flatpickr-calendar .flatpickr-day:hover,
body > .flatpickr-calendar .flatpickr-day:focus {
background: var(--card-2); border-color: var(--card-2); color: var(--fg);
}
body > .flatpickr-calendar .flatpickr-day.today:not(.selected) { border-color: var(--brass); }
body > .flatpickr-calendar .flatpickr-day.today:hover,
body > .flatpickr-calendar .flatpickr-day.today:focus { background: var(--card-2); color: var(--fg); }
body > .flatpickr-calendar .flatpickr-day.prevMonthDay,
body > .flatpickr-calendar .flatpickr-day.nextMonthDay,
body > .flatpickr-calendar .flatpickr-day.flatpickr-disabled,
body > .flatpickr-calendar .flatpickr-day.flatpickr-disabled:hover { color: var(--muted); }
/**/
body > .flatpickr-calendar .flatpickr-day.selected,
body > .flatpickr-calendar .flatpickr-day.startRange,
body > .flatpickr-calendar .flatpickr-day.endRange,
body > .flatpickr-calendar .flatpickr-day.selected:hover,
body > .flatpickr-calendar .flatpickr-day.startRange:hover,
body > .flatpickr-calendar .flatpickr-day.endRange:hover {
background: var(--brass); border-color: var(--brass); color: var(--on-brass);
border-radius: var(--radius-sm);
}
body > .flatpickr-calendar .flatpickr-day.inRange,
body > .flatpickr-calendar .flatpickr-day.inRange:hover {
background: var(--brass-soft); border-color: var(--brass-soft); color: var(--fg);
box-shadow: -5px 0 0 var(--brass-soft), 5px 0 0 var(--brass-soft);
}
/**/
body > .flatpickr-calendar .flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)) {
box-shadow: -10px 0 0 var(--brass);
}
body > .flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) {
box-shadow: -2px 0 0 var(--brass-soft), 5px 0 0 var(--brass-soft);
}
/**/
.job .crew-picker { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); }
.job .crew-picker input { width: auto; flex: 0 0 auto; }
.job .jd-cl-photorow {
grid-column: 1 / -1;
display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4);
}
.job .jd-cl-photoslot {
border: 1px dashed var(--border-2); border-radius: var(--radius-md);
padding: var(--sp-3); display: flex; flex-direction: column; gap: var(--sp-2);
}
.job .jd-cl-photoslot-h { font-size: var(--text-sm); color: var(--fg-soft); font-weight: 600; }
.job .jd-cl-thumbs { grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); }
.job .jd-cl-uploadform { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }
.job .jd-cl-uploadform input[type=file] { flex: 1 1 140px; min-width: 0; font-size: var(--text-sm); }
.job .jd-cl-signoff .jd-cl-confirm {
grid-column: 1 / -1; flex-direction: row; align-items: center; gap: var(--sp-2);
}
.job .jd-cl-confirm input { width: auto; }
.job .jd-cl-actions { display: flex; gap: var(--sp-3); justify-content: flex-end; }
/**/
.job .jd-cl-form > .jd-cl-actions {
align-items: center;
position: sticky; bottom: 0; z-index: 5;
margin: 0 calc(var(--sp-4) * -1) calc(var(--sp-4) * -1);
padding: var(--sp-3) var(--sp-4);
background: var(--card); border-top: 1px solid var(--border-2);
/**/
justify-content: flex-start;
}
/**/
.job .jd-cl-form > .jd-cl-actions::before {
content: "Unsaved changes"; margin-right: auto; display: none;
font-size: var(--text-xs); color: var(--warn);
}
.job .jd-cl-form > .jd-cl-actions.is-dirty::before { display: block; }
/**/
.job .jd-sc-index { margin-bottom: var(--sp-4); }
.job .jd-sc-index-hint { margin: 0 0 var(--sp-2); font-size: var(--text-sm); max-width: 62ch; }
/**/
.job .jd-sc-index ul {
list-style: none; margin: 0; padding: 0;
display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 2px var(--sp-3);
}
.job .jd-sc-index li {
display: flex; align-items: baseline; gap: var(--sp-2);
padding: var(--sp-1) var(--sp-2); border-radius: var(--radius-sm); min-height: 30px;
}
.job .jd-sc-index li:hover { background: var(--card-2); }
.job .jd-sc-index a { color: var(--fg-soft); font-size: var(--text-sm); flex: 1 1 auto; }
.job .jd-sc-index a:hover { color: var(--fg); }
.job .jd-sc-index li.is-empty a, .job .jd-sc-index li.is-fixed a { color: var(--muted); }
.job .jd-sc-index-n { font-size: var(--text-xs); font-variant-numeric: tabular-nums; flex: 0 0 auto; }
/**/
.job .jd-cl-sec { scroll-margin-top: var(--sp-4); }
@media (max-width: 680px) {
.job .jd-cl-sec, .job .jd-cl-photorow { grid-template-columns: 1fr; }
/**/
.job .jd-cl-signoff .jd-cl-confirm { min-height: 44px; }
.job .jd-cl-confirm input { width: 20px; height: 20px; flex: 0 0 auto; }
}
/**/
@media (max-width: 760px) {
.job .jd-cl-form > .jd-cl-actions { flex-wrap: wrap; }
.job .jd-cl-form > .jd-cl-actions.is-dirty::before { margin-right: 0; flex: 1 0 100%; }
}
/**/
.job .jd-sc-facts {
grid-column: 1 / -1; font-size: var(--text-base); color: var(--fg-soft);
margin-bottom: var(--sp-3);
}
/**/
.job .jd-sc-source { margin: 0 0 var(--sp-3); font-size: var(--text-sm); }
.job .jd-sc-toggles {
grid-column: 1 / -1; display: flex; flex-direction: column; gap: var(--sp-2);
}
.job .jd-sc-toggle { display: flex; align-items: center; gap: var(--sp-2); font-size: var(--text-base); }
.job .jd-sc-toggle input { width: auto; }
.job .jd-sc-note { grid-column: 1 / -1; margin: 0; font-size: var(--text-sm); color: var(--muted); }
/**/
.field-grid dd > .status-badge {
display: inline-block; margin-top: var(--sp-1); max-width: 100%;
/**/
white-space: normal; text-align: left;
}
/**/
@media (max-width: 760px) {
.job .jd-sc-toggle { min-height: 44px; }
.job .jd-sc-toggle input { width: 20px; height: 20px; flex: 0 0 auto; }
}
/**/
.job .jd-sc-narr { grid-template-columns: 1fr; }
/**/
.job .jd-sc-doc { display: flex; flex-direction: column; gap: var(--sp-3); }
/**/
.job .jd-sc-render {
max-width: 68ch; margin-inline: auto; padding: var(--sp-5) var(--sp-5);
background: var(--bg-2); border: 1px solid var(--border);
border-radius: var(--radius-md); box-shadow: var(--lift);
}
/**/
@media (max-width: 760px) {
.job .jd-sc-render { padding: var(--sp-3); }
}
.job .jd-sc-render h2 {
font-size: var(--text-md); margin: 0 0 var(--sp-2); color: var(--fg);
}
.job .jd-sc-render h3 {
/**/
font-size: var(--text-xs); font-weight: 600; letter-spacing: .08em;
color: var(--brass); margin: var(--sp-4) 0 var(--sp-2);
}
.job .jd-sc-render h2 + h3, .job .jd-sc-render h3:first-child { margin-top: 0; }
.job .jd-sc-render p { margin: 0 0 var(--sp-2); line-height: 1.55; }
.job .jd-sc-render ul { margin: 0 0 var(--sp-2); padding-left: var(--sp-4); }
.job .jd-sc-render li { margin: 0 0 var(--sp-1); line-height: 1.55; }
.job .jd-sc-render ul ul, .job .jd-sc-render ol ol,
.job .jd-sc-render ul ol, .job .jd-sc-render ol ul {
margin-top: var(--sp-1); margin-bottom: 0;
}
.job .jd-sc-render h4 {
font-size: var(--text-xs); font-weight: 600; letter-spacing: .06em;
color: var(--fg-soft); margin: var(--sp-3) 0 var(--sp-1);
}
/**/
.job .jd-sc-render blockquote {
margin: 0 0 var(--sp-2); padding: var(--sp-1) 0 var(--sp-1) var(--sp-3);
border-left: 2px solid var(--brass); color: var(--fg-soft);
}
.job .jd-sc-render code {
font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
font-size: var(--text-sm); background: var(--card-2); padding: 0 4px;
border-radius: var(--radius-sm);
}
.job .jd-sc-render hr { border: 0; border-top: 1px solid var(--border); margin: var(--sp-4) 0; }
/**/
.job .jd-sc-render img {
max-width: 100%; height: auto; display: block;
border-radius: var(--radius-sm); margin: var(--sp-2) 0;
}
.job .jd-sc-render .jd-sc-center { text-align: center; }
.job .jd-sc-render .jd-sc-center img { margin-inline: auto; }
/**/
.job .jd-sc-edit[hidden] { display: none; }
.job .jd-sc-render[hidden] { display: none; }
.job .jd-sc-edit textarea {
font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
font-size: var(--text-base); line-height: 1.55; resize: vertical;
}
/**/
.job .EasyMDEContainer .CodeMirror {
background: var(--bg-2); color: var(--fg);
border-color: var(--border); border-radius: 0 0 var(--radius-md) var(--radius-md);
font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
font-size: var(--text-base); line-height: 1.55;
}
.job .EasyMDEContainer .CodeMirror-cursor { border-left-color: var(--brass); }
.job .EasyMDEContainer .CodeMirror-selected { background: var(--card-2); }
.job .EasyMDEContainer .editor-toolbar {
background: var(--card-2); border-color: var(--border);
border-radius: var(--radius-md) var(--radius-md) 0 0; opacity: 1;
}
/**/
.job .EasyMDEContainer .editor-toolbar button:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) { color: var(--muted); }
.job .EasyMDEContainer .editor-toolbar button:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip):hover,
.job .EasyMDEContainer .editor-toolbar button:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip).active {
background: var(--bg-2); border-color: var(--border); color: var(--brass);
}
.job .EasyMDEContainer .editor-toolbar i.separator { border-color: var(--border); }
/**/
.job .EasyMDEContainer .cm-s-easymde .cm-header { color: var(--brass); }
.job .EasyMDEContainer .cm-s-easymde .cm-comment { background: var(--card-2); }
.job .EasyMDEContainer .cm-s-easymde .cm-link { color: var(--brass-2); }
/**/
.job .EasyMDEContainer .editor-preview,
.job .EasyMDEContainer .editor-preview-side {
background: var(--bg-2); color: var(--fg); border-color: var(--border);
}
.job .EasyMDEContainer .editor-preview h1,
.job .EasyMDEContainer .editor-preview h2,
.job .EasyMDEContainer .editor-preview-side h1,
.job .EasyMDEContainer .editor-preview-side h2 { color: var(--fg); }
/**/
.job .EasyMDEContainer .CodeMirror-fullscreen,
.job .EasyMDEContainer .editor-toolbar.fullscreen { background: var(--bg-2); z-index: 60; }
.job .EasyMDEContainer .editor-toolbar.fullscreen::before,
.job .EasyMDEContainer .editor-toolbar.fullscreen::after { display: none; }
/**/
.job .EasyMDEContainer .editor-toolbar button:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
width: auto; min-width: 0; padding: 0 var(--sp-2);
/**/
font-size: var(--text-sm); font-weight: 500; letter-spacing: 0; text-transform: none;
}
.job .EasyMDEContainer .editor-toolbar button::before { content: attr(data-label); }
.job .EasyMDEContainer .editor-toolbar button.heading-2::before { content: "Heading"; }
.job .EasyMDEContainer .editor-toolbar button.bold::before { content: "Bold"; }
.job .EasyMDEContainer .editor-toolbar button.italic::before { content: "Italic"; }
.job .EasyMDEContainer .editor-toolbar button.unordered-list::before { content: "Steps"; }
.job .EasyMDEContainer .editor-toolbar button.ordered-list::before { content: "Numbered"; }
.job .EasyMDEContainer .editor-toolbar button.preview::before { content: "Preview"; }
.job .EasyMDEContainer .editor-toolbar button.side-by-side::before { content: "Split"; }
.job .EasyMDEContainer .editor-toolbar button.fullscreen::before { content: "Full screen"; }
.job .EasyMDEContainer .editor-toolbar button.quote::before { content: "Quote"; }
.job .EasyMDEContainer .editor-toolbar button.link::before { content: "Link"; }
.job .EasyMDEContainer .editor-toolbar button.image::before { content: "Image"; }
.job .EasyMDEContainer .editor-toolbar button.centre::before { content: "Centre"; }
.job .EasyMDEContainer .editor-toolbar button.horizontal-rule::before { content: "Divider"; }
/**/
.job .EasyMDEContainer .editor-toolbar {
display: flex; flex-wrap: wrap; align-items: center;
gap: var(--sp-1); padding: var(--sp-2);
}
/**/
.job .EasyMDEContainer .editor-toolbar button > i,
.job .EasyMDEContainer .editor-toolbar button::after { display: none; }
/**/
.job .EasyMDEContainer .editor-toolbar button:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
height: auto; min-height: 30px; display: inline-flex; align-items: center;
border-radius: var(--radius-sm); white-space: nowrap;
}
/**/
.job .EasyMDEContainer .editor-toolbar i.separator {
width: 1px; height: 18px; margin: 0 var(--sp-1); text-indent: 0;
border: 0; background: var(--border); color: transparent; overflow: hidden;
}
@media (max-width: 760px) {
/**/
.job .EasyMDEContainer .editor-toolbar button:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
min-height: 40px; padding: 0 var(--sp-3);
}
/**/
.job .EasyMDEContainer .editor-toolbar button.no-mobile:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) { display: none; }
}
/**/
.job .EasyMDEContainer .editor-toolbar.fullscreen {
height: auto; min-height: 50px; padding: var(--sp-2);
}
/**/
.job .EasyMDEContainer .cm-s-easymde .cm-header-1 { font-size: var(--text-md); line-height: 1.5; }
.job .EasyMDEContainer .cm-s-easymde .cm-header-2 { font-size: var(--text-base); line-height: 1.5; }
.job .EasyMDEContainer .cm-s-easymde .cm-header-3,
.job .EasyMDEContainer .cm-s-easymde .cm-header { font-size: var(--text-base); line-height: 1.55; }
/**/
button[data-scope-toggle][hidden]:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
display: none;
}
/**/
.job .jd-sc-doc-actions { margin: 0; }
/**/
.job .jd-sc-import {
margin-top: var(--sp-5); padding-top: var(--sp-4);
border-top: 1px solid var(--border);
display: flex; flex-direction: column; gap: var(--sp-2); align-items: flex-start;
}
.job .jd-sc-import p { margin: 0; font-size: var(--text-sm); max-width: 68ch; }
/**/
.job .jd-sc-fixed { grid-template-columns: 1fr; }
.job .jd-sc-list { margin: 0; padding-left: var(--sp-4); font-size: var(--text-base); }
.job .jd-sc-list li { margin: 2px 0; }
.job .jd-sc-sched { width: 100%; border-collapse: collapse; font-size: var(--text-base); }
.job .jd-sc-sched th, .job .jd-sc-sched td {
text-align: left; padding: var(--sp-2); border-bottom: 1px solid var(--border);
}
.job .jd-sc-sched td:nth-child(2), .job .jd-sc-sched td:nth-child(3) { text-align: right; }
.job .jd-sc-sched th:nth-child(2), .job .jd-sc-sched th:nth-child(3) { text-align: right; }
/**/
.job .jd-sched-form { margin-bottom: var(--sp-5); }
.job .jd-sched-hint { grid-column: 1 / -1; margin: 0; font-size: var(--text-sm); }
/**/
.job .jd-ms { display: flex; flex-direction: column; gap: var(--sp-3); }
.job .jd-ms-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-2); }
.job .jd-ms-row { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; }
.job .jd-ms-tick { display: flex; }
.job .jd-ms-tick input { width: auto; }
.job .jd-ms-edit { display: flex; align-items: center; gap: var(--sp-2); flex: 1 1 auto; flex-wrap: wrap; min-width: 0; }
.job .jd-ms-edit input[type=text] { flex: 1 1 160px; min-width: 0; }
.job .jd-ms-edit input[type=date] { flex: 0 0 auto; }
/**/
.job .jd-ms-row.done .jd-ms-edit input[type=text] { text-decoration: line-through; color: var(--muted); }
.job .jd-ms-del { color: var(--error); }
.job .jd-ms-add { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap;
border-top: 1px solid var(--border); padding-top: var(--sp-3); }
.job .jd-ms-add input[type=text] { flex: 1 1 160px; min-width: 0; }
.job .jd-facts-edit {
background: none; border: none; padding: 0; margin-left: var(--sp-1);
color: var(--brass-2); font-size: var(--text-sm); cursor: pointer; text-decoration: underline;
}
/**/
/**/
.job .jd-cl-field small { font-size: var(--text-xs); line-height: 1.5; }
/**/
.job .jd-to-grid input, .job .jd-to-grid select { width: 100%; min-width: 0; }
.job .jd-to-grid td.num input {
font-variant-numeric: tabular-nums;
text-align: right;
}
/**/
.job .jd-cl-field.is-awaiting,
.job .jd-cl-slot.is-awaiting {
border-left: 2px solid var(--unknown);
padding-left: var(--sp-3);
}
/**/
.job .jd-cl-onsite {
font-style: normal; font-size: var(--text-xs); color: var(--unknown);
border: 1px solid var(--border-2); padding: 0 var(--sp-1);
border-radius: var(--radius-sm); white-space: nowrap;
}
/**/
.job .jd-cl-slot { min-width: 0; }
/**/
main table.cr td:nth-child(n+4), main table.cr th:nth-child(n+4) { text-align: right; }
main table.cr td.cr-untracked-cell {
text-align: left; font-style: italic; color: var(--muted); font-size: var(--text-sm);
}
main table.cr tr.cr-untracked td { background: var(--card-2); }
main table.cr tfoot td {
border-top: 1px solid var(--border-2); border-bottom: none;
font-weight: 700; background: var(--card-2);
}
/**/
.job { max-width: 1180px; }
/**/
.jd-tl { position: relative; padding-left: var(--sp-5); }
.jd-tl:before {
content: ""; position: absolute; left: 6px; top: var(--sp-1); bottom: var(--sp-1);
width: 2px; background: var(--border-2);
}
.jd-ev { position: relative; margin: 0 0 var(--sp-4); }
.jd-ev:last-child { margin-bottom: 0; }
.jd-ev:before {
content: ""; position: absolute; left: calc(var(--sp-5) * -1); top: var(--sp-1); width: 12px; height: 12px;
border-radius: var(--radius-circle); background: var(--card); border: 2px solid var(--muted);
}
.jd-ev.brass:before { border-color: var(--brass); }
.jd-ev.ok:before { border-color: var(--ok); }
.jd-ev.info:before { border-color: var(--info); }
.jd-when { color: var(--muted); font-size: var(--text-sm); }
.jd-what { margin: var(--sp-1) 0 0; }
.jd-msg {
background: var(--card-2); border: 1px solid var(--border); border-radius: var(--radius-md);
padding: var(--sp-2) var(--sp-3); margin-top: var(--sp-2); font-size: var(--text-base);
color: var(--fg-soft); white-space: pre-wrap;
}
.jd-who { color: var(--brass-2); margin-bottom: var(--sp-1); }
.jd-thumbrow { display: flex; gap: var(--sp-2); margin-top: var(--sp-2); flex-wrap: wrap; }
/**/
.jd-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-2); }
.jd-ph:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
position: relative; aspect-ratio: 4/3; border-radius: var(--radius-md); overflow: hidden;
border: 1px solid var(--border-2); cursor: zoom-in; padding: 0; background: var(--card-2);
}
.jd-ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
.jd-thumb:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
width: 78px; height: 60px; padding: 0; border-radius: var(--radius-sm); overflow: hidden;
border: 1px solid var(--border-2); cursor: zoom-in; background: var(--card-2);
}
.jd-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
/**/
.jd-thumb.jd-missing { position: relative; }
.jd-ph.jd-missing img, .jd-thumb.jd-missing img { display: none; }
.jd-ph.jd-missing::after, .jd-thumb.jd-missing::after {
content: "File not available"; position: absolute; inset: 0; display: grid; place-items: center;
font-size: var(--text-xs); color: var(--muted);
}
/**/
.jd-cap {
position: absolute; left: 0; right: 0; bottom: 0; padding: var(--sp-1) var(--sp-1-5); font-size: var(--text-2xs);
text-align: left; background: linear-gradient(transparent, var(--scrim)); color: var(--on-scrim);
}
.jd-docs { list-style: none; margin: var(--sp-3) 0 0; padding: 0; font-size: var(--text-base); }
.jd-docs li {
display: flex; align-items: center; gap: var(--sp-2); padding: var(--sp-1-5) 0;
border-top: 1px solid var(--border);
}
.jd-doc-ico { color: var(--muted); }
.jd-docs a { color: var(--info); }
.jd-none { margin: 0; }
/**/
.photo-pop {
border: 0; padding: var(--sp-4); background: transparent; max-width: 100%; max-height: 100%;
inset: 0; margin: auto; overflow: visible;
}
.photo-pop::backdrop { background: var(--scrim); }
.photo-pop:popover-open { display: flex; align-items: center; justify-content: center; }
.photo-pop figure {
margin: 0; display: flex; flex-direction: column; align-items: center; gap: var(--sp-2);
max-width: 100%; max-height: 100%;
}
.photo-pop img { max-width: 100%; max-height: 82vh; border-radius: var(--radius-lg); box-shadow: var(--shadow); }
.photo-pop figcaption { color: var(--on-scrim); font-size: var(--text-sm); }
/**/
.pv-arrow:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
/**/
position: fixed; top: 50%; transform: translateY(-50%); z-index: 1;
width: 44px; height: 44px; min-height: 44px; padding: 0; line-height: 1;
display: flex; align-items: center; justify-content: center;
font-size: var(--text-xl); border-radius: var(--radius-circle);
/**/
border: 1px solid var(--border-2); background: var(--scrim); color: var(--on-scrim);
}
.pv-prev:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) { left: var(--sp-3); }
.pv-next:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) { right: var(--sp-3); }
.pv-count { margin: 0; color: var(--on-scrim); font-size: var(--text-sm); }
/**/
.jd-upload { margin-top: var(--sp-4); display: flex; flex-direction: column; gap: var(--sp-3); }
.jd-drop {
position: relative; border: 1.5px dashed var(--border-2); border-radius: var(--radius-md);
padding: var(--sp-4); text-align: center; color: var(--muted); font-size: var(--text-base);
cursor: pointer; display: flex; flex-direction: column; gap: var(--sp-1);
}
.jd-drop input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.jd-drop-hint b { color: var(--brass-2); }
.jd-drop-sub { font-size: var(--text-xs); }
.jd-kind { font-size: var(--text-sm); display: flex; align-items: center; gap: var(--sp-2); }
.jd-upload .btn-primary { align-self: flex-start; }
/**/
.jd-drop-over { border-color: var(--brass); color: var(--brass-2); background: var(--brass-soft); }
/**/
.jd-picked {
list-style: none; margin: 0; padding: 0;
display: grid; gap: var(--sp-2);
grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
}
.jd-file {
position: relative; min-width: 0; padding: var(--sp-1);
display: flex; flex-direction: column; gap: 2px;
border: 1px solid var(--border); border-radius: var(--radius-md);
background: var(--card-2);
}
/**/
.jd-file-frame {
aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center;
overflow: hidden; background: var(--bg-2); border-radius: var(--radius-sm);
}
.jd-file-thumb { width: 100%; height: 100%; object-fit: cover; display: block; }
.jd-file-glyph { font-size: var(--text-2xl); color: var(--muted); }
.jd-file-name {
font-size: var(--text-xs); color: var(--fg); overflow: hidden;
text-overflow: ellipsis; white-space: nowrap;
}
.jd-file-size { font-size: var(--text-2xs); color: var(--muted); }
/**/
.jd-file-bar { height: 2px; background: var(--border); border-radius: var(--radius-pill); overflow: hidden; }
.jd-file-bar > i { display: block; height: 100%; width: 0; background: var(--brass); }
.jd-file-msg { margin: 0; font-size: var(--text-2xs); line-height: 1.3; color: var(--muted); }
.jd-file-msg:empty { display: none; }
.jd-file-ok { border-color: var(--ok); }
.jd-file-ok .jd-file-msg { color: var(--ok); }
.jd-file-ok .jd-file-bar > i { background: var(--ok); }
/**/
.jd-file-bad { border-color: var(--error); }
.jd-file-bad .jd-file-msg { color: var(--error); }
.jd-file-sending .jd-file-frame { opacity: 0.55; }
/**/
.jd-file-x:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip) {
position: absolute; top: 5px; right: 5px; z-index: 1;
/**/
width: 28px; height: 28px; min-height: 28px; padding: 0; line-height: 1; font-size: var(--text-lg);
display: flex; align-items: center; justify-content: center;
border-radius: var(--radius-circle); border: 1px solid transparent;
/**/
background: var(--scrim); color: var(--on-scrim);
}
.jd-file-x:not(.icon-btn):not(.jarvis-send):not(.health-refresh):not(.btn-primary):not(.btn-danger):not(.chip):hover {
background: var(--error); color: #fff; border-color: var(--error);
}
/**/
.jd-upload-sending .jd-drop, .jd-upload-sending .jd-file-x { pointer-events: none; opacity: 0.5; }
.jd-up-status { margin: 0; font-size: var(--text-xs); color: var(--brass-2); }
.jd-up-status-bad { color: var(--error); }
@media (max-width: 760px) {
/**/
.jd-picked { grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: var(--sp-1); }
}
/**/
/**/
.job .jd-doc-progress { font-size: var(--text-xs); margin-top: var(--sp-1); }
.jd-takeoff > summary { cursor: pointer; color: var(--brass-2); }
.jd-takeoff[open] { margin-top: var(--sp-3); }
/**/
.job .jd-sched-total td {
border-top: 1px solid var(--border-2); font-weight: 600;
/**/
white-space: nowrap;
}
.job .jd-sched-total:hover td { background: transparent; }
.job .jd-sched-total td:first-child::before { display: none; }
/**/
@media (max-width: 760px) {
.table-stack .jd-sched-total td:empty { display: none; }
}
/**/
.modal h4 {
font-size: var(--text-xs); font-weight: 600; letter-spacing: .06em;
color: var(--fg-soft); margin: var(--sp-5) 0 var(--sp-1);
}
.modal h4:first-of-type { margin-top: var(--sp-3); }
/**/
.job .row-actions form { display: inline-block; margin: 0; vertical-align: middle; }
.job .row-actions .row-menu-btn { vertical-align: middle; }
/**/
.ok-text { color: var(--ok); }
.jd-rail-add { margin-top: var(--sp-3); width: 100%; }
/**/
.job .jd-ms-tick button { min-width: 44px; }
.jd-note-input { max-width: 520px; }
@media (max-width: 880px) {
.jd-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/**/
.confirm-pop {
border: 1px solid var(--border-2); border-radius: var(--radius-lg);
background: var(--card); color: var(--fg); box-shadow: var(--shadow);
padding: var(--sp-4); max-width: 34ch; inset: 0; margin: auto;
/**/
white-space: normal;
}
.confirm-pop::backdrop { background: var(--scrim); }
.confirm-pop-msg { margin: 0 0 var(--sp-3); font-size: var(--text-base); }
/**/
.modal {
border: 1px solid var(--border-2); border-radius: var(--radius-lg);
background: var(--card); color: var(--fg); box-shadow: var(--shadow);
padding: var(--sp-5); width: min(560px, calc(100vw - var(--sp-5)));
max-height: calc(100vh - var(--sp-6)); overflow-y: auto;
}
.modal::backdrop { background: var(--scrim); }
/**/
.modal-title { margin: 0 0 var(--sp-4); font-size: var(--text-md); color: var(--fg); }
.modal-msg { margin: 0 0 var(--sp-3); font-size: var(--text-base); color: var(--fg-soft); }
/**/
.modal .form-foot { margin-top: var(--sp-4); padding-top: var(--sp-3); }
/**/
.job .jd-complaint { margin-top: var(--sp-5); }
.jd-complaint-hint { margin: var(--sp-1) 0 var(--sp-2); }
/**/
main:has(> .embed-frame) { display: flex; flex-direction: column; }
.embed-frame {
border: 1px solid var(--border); border-radius: var(--radius-lg);
background: var(--card); overflow: hidden;
flex: 1; min-height: 0;
}
.embed-frame iframe {
display: block; width: 100%; height: 100%; border: 0;
/**/
color-scheme: light;
filter: invert(1) hue-rotate(180deg);
}
/**/
.info { position: relative; display: inline-block; vertical-align: middle; }
.info-btn.icon-btn {
width: 17px; height: 17px; font-size: var(--text-xs); font-style: italic;
font-weight: 700; line-height: 1; border-radius: var(--radius-circle);
padding: 0; margin-left: var(--sp-1-5); color: var(--muted);
/**/
text-transform: none; letter-spacing: 0;
}
.info-btn.icon-btn:hover, .info:focus-within .info-btn.icon-btn { color: var(--fg); }
.info-pop {
display: none; position: absolute; z-index: 40; top: calc(100% + 6px); left: 0;
width: max-content; max-width: min(38ch, calc(100vw - 48px));
padding: var(--sp-2-5) var(--sp-3); text-align: left; white-space: normal;
font-size: var(--text-sm); font-weight: 400; font-style: normal; line-height: 1.5;
text-transform: none; letter-spacing: 0; color: var(--fg-soft);
background: var(--card-2); border: 1px solid var(--border-2);
border-radius: var(--radius-lg); box-shadow: var(--shadow);
}
.info:hover > .info-pop, .info:focus-within > .info-pop { display: block; }
.info-pop strong { color: var(--fg); }
@media (max-width: 760px) {
/**/
.info-btn.icon-btn { width: 40px; height: 40px; font-size: var(--text-base); }
/**/
.info-pop {
position: fixed; left: 12px; right: 12px; bottom: 12px;
top: auto; width: auto; max-width: none; z-index: 60;
}
}
/**/
.pricing-table td, .pricing-table th { vertical-align: middle; }
.pricing-table td:last-child, .pricing-table th:last-child { text-align: right; }
.pricing-table td small { display: block; font-size: var(--text-2xs); }
/**/
.pricing-table .group-row th, .pricing-table .group-row td {
background: var(--card-2); font-weight: 600; border-bottom: 1px solid var(--border);
text-align: left;
}
.pricing-table .group-row .group-meta { font-weight: 400; }
/**/
.nowrap-cell { white-space: nowrap; }
/**/
.pricing-grid td:last-child, .pricing-grid th:last-child { width: 130px; }
/**/
.pricing-grid td:last-child, .pricing-grid thead th:last-child { text-align: center; }
/**/
.pricing-grid.is-reading td:last-child,
.pricing-grid.is-reading thead th:last-child { text-align: right; }
.pricing-grid .group-row th { position: sticky; top: 0; z-index: 1; }
/**/
.rate-cell {
width: 100%; max-width: 110px; text-align: right;
font-variant-numeric: tabular-nums;
}
/**/
.pricing-foot .form-foot { justify-content: flex-end; align-items: center; }
/**/
/**/
.pricing-controls {
display: flex; align-items: flex-start; justify-content: space-between;
gap: var(--sp-3); flex-wrap: wrap; margin: 0 0 var(--sp-3);
}
.pricing-controls > form { margin: 0; }
.pricing-sheet { display: flex; align-items: center; gap: var(--sp-2); order: 2; margin-left: auto; }
.pricing-upload { display: flex; align-items: center; gap: var(--sp-2); }
.pricing-upload .field { margin: 0; }
.pricing-upload-note { flex-basis: 100%; order: 3; margin: 0; text-align: right; }
/**/
.pricing-pager { display: flex; flex-wrap: wrap; gap: var(--sp-1); align-items: center; margin-top: var(--sp-3); }
.pricing-page {
padding: var(--sp-1) var(--sp-2-5); font-size: var(--text-sm); color: var(--muted);
border: 1px solid var(--border); border-radius: var(--radius-md);
}
.pricing-page:hover { color: var(--fg); border-color: var(--border-2); }
.pricing-page.is-here { color: var(--fg); background: var(--card-2); border-color: var(--border-2); }
.pricing-page.is-off { opacity: 0.45; }
.pricing-pager-note { margin-top: var(--sp-2); font-size: var(--text-sm); }
/**/
.pricing-hint { display: block; margin-top: var(--sp-1); font-size: var(--text-sm); }
.pricing-narrow { max-width: 460px; }
.pricing-rates { margin-top: var(--sp-3); }
.pricing-back { margin: 0 0 var(--sp-4); }
.pricing-steps { margin: 0 0 var(--sp-4); padding-left: 1.25em; font-size: var(--text-base); }
/**/
.pricing-mode { order: 0; gap: var(--sp-3); }
/**/
.pricing-grid tr.is-changed td { background: var(--card-2); }
.pricing-grid tr.is-changed td:first-child { box-shadow: inset 2px 0 0 var(--border-2); }
/**/
.pricing-staged { list-style: none; margin: 0 0 var(--sp-2); padding: 0; }
.pricing-staged li {
display: flex; flex-direction: column; gap: 2px;
padding: var(--sp-2) 0; border-bottom: 1px solid var(--border);
font-size: var(--text-sm);
}
.pricing-staged-label { color: var(--fg); }
.pricing-staged-figures {
display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--sp-1);
color: var(--muted); font-variant-numeric: tabular-nums;
}
.pricing-staged-count { margin: 0 0 var(--sp-2); color: var(--muted); font-size: var(--text-sm); }
/**/
.pricing-rail-actions {
display: flex; align-items: center; gap: var(--sp-2); margin: var(--sp-3) 0 var(--sp-2);
}
/**/
.delta-up { color: var(--brass); }
.delta-down { color: var(--ok); }
/**/
.rate-changes { margin: var(--sp-2) 0 0; padding-left: var(--sp-4); font-size: var(--text-sm); }
.rate-changes li { margin: 2px 0; }
.rate-changes code { font-size: var(--text-xs); }
/**/
.card-foot { display: flex; justify-content: flex-end; margin-top: var(--sp-3); }
/**/
.crew-link-row { display: flex; gap: var(--sp-2); align-items: center; margin: var(--sp-3) 0; }
.crew-link-url {
flex: 1 1 auto; min-width: 0;
font-family: var(--font-mono, ui-monospace, monospace);
font-size: var(--text-sm);
}
.crew-link-row button { flex: 0 0 auto; }
/**/
.crew-link-state { margin: var(--sp-3) 0; display: flex; align-items: baseline;
flex-wrap: wrap; gap: var(--sp-2); }
/**/
.crew-send-how { white-space: nowrap; }
.crew-send-to { word-break: break-word; }
.crew-link-who { display: flex; flex-direction: column; gap: var(--sp-2);
margin: var(--sp-3) 0; }
.crew-link-actions { margin-top: var(--sp-3); }
@media (max-width: 760px) {
/**/
.crew-link-row { flex-direction: column; align-items: stretch; }
.crew-link-row button { width: 100%; }
}
/**/
.ps-pct { width: 5.5em; margin-right: var(--sp-1); text-align: right; }
.ps-pct-cell { white-space: nowrap; }
.card td input[type=text][form^="ps-"] { width: 100%; min-width: 0; }
.ps-absorb { display: block; margin-top: var(--sp-1); color: var(--muted); }
/**/
.ps-foot td { border-top: 2px solid var(--border-2); }
.proposal-payment-schedule td:first-child,
.proposal-payment-schedule td:nth-child(3),
.proposal-payment-schedule td:last-child { width: 1%; white-space: nowrap; }
.proposal-payment-schedule th:nth-child(3),
.proposal-payment-schedule td:nth-child(3) { text-align: right; }
.proposal-payment-schedule td:last-child { text-align: right; }
@media (max-width: 760px) {
.proposal-price-actions { grid-template-columns: minmax(0, 1fr); }
.proposal-price-actions > button, .proposal-line-adder > summary { width: 100%; }
.proposal-lines td[data-label="Qty"], .proposal-lines td.row-actions,
.proposal-payment-schedule td:first-child,
.proposal-payment-schedule td:nth-child(3),
.proposal-payment-schedule td:last-child { width: auto; white-space: normal; }
.proposal-lines .proposal-line-editor td { display: block; border: 0; margin: 0; font-weight: 400; }
.proposal-lines td[data-label="Item"] { display: block; }
.proposal-lines td[data-label="Item"]::before { display: block; margin-bottom: var(--sp-1); }
.proposal-payment-schedule td:nth-child(2) { flex-wrap: wrap; }
.proposal-payment-schedule td:nth-child(3) { text-align: left; }
.proposal-payment-schedule .ps-absorb { flex-basis: 100%; }
.proposal-payment-schedule td:last-child::before { content: none; }
.proposal-payment-schedule td:last-child { justify-content: flex-end; }
.proposal-payment-schedule .ps-foot td:empty { display: none; }
}
/**/
.cell-owner { white-space: nowrap; }
.owner-select { font-size: var(--text-sm); color: var(--fg); max-width: 14ch; }
.cell-owner [role="alert"] { display: block; margin-top: var(--sp-1); }
/**/
.promo-link { display: block; word-break: break-all;
font-family: var(--font-mono, ui-monospace, monospace); font-size: var(--text-sm); }
.promo-link-field { width: 100%;
font-family: var(--font-mono, ui-monospace, monospace); font-size: var(--text-sm); }
@keyframes kb-sheet-up { from { transform: translateY(100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) { .modal.kb-move { animation: none; } }