.washdoc-line-icon{display:block;width:24px;height:24px;object-fit:contain;flex:none}
.breadcrumb-icon .washdoc-line-icon,.workspace-shortcut .washdoc-line-icon{width:16px;height:16px}
.heading-icon .washdoc-line-icon{width:36px;height:36px}
/* Keep breathing room inside the white graph surface, scaled by personal line spacing. */
.washdoc-chart{position:relative;display:flex;flex-direction:column;min-width:0;height:100%;overflow:hidden;background:#fff;color:#2e2d2b;padding:calc(12px * var(--portal-line-spacing,1));box-sizing:border-box}
.washdoc-chart:focus-visible{outline:2px solid var(--brand-focus,#4765ee);outline-offset:-3px}
.washdoc-chart-panels{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:10px;width:100%;flex:1;min-width:0;min-height:0}
.washdoc-chart-band{display:flex;flex-direction:column;min-width:0;min-height:0}
.washdoc-chart-band h3{font:inherit;font-size:12px;font-weight:400;line-height:18px;margin:0 0 3px;padding-left:54px}
.washdoc-chart-canvas{position:relative;flex:1;min-width:0;min-height:0}
.washdoc-chart-canvas>canvas{position:absolute;inset:0;display:block;width:100%;height:100%;cursor:crosshair;touch-action:pan-y}
.washdoc-chart-phases,.washdoc-chart-overlay{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}
.washdoc-chart-phases{z-index:2}.washdoc-chart-overlay{z-index:3}.washdoc-chart-overlay[hidden]{display:none}
.washdoc-chart-cursor{position:absolute;top:0;bottom:0;border-left:1px dashed #45413bcc}
.washdoc-chart-now{position:absolute;top:0;bottom:0;width:0;border-left:1.5px solid #2e2d2b;z-index:3;pointer-events:none}
.washdoc-chart-now[hidden]{display:none}
.washdoc-chart-now-label{position:absolute;top:0;padding:2px 6px;border-radius:4px;background:#2e2d2b;color:#fff;font-size:11px;line-height:16px;white-space:nowrap}
.washdoc-chart-tooltip{position:absolute;box-sizing:border-box;max-width:calc(100% - 8px);max-height:calc(100% - 8px);overflow-y:auto;overscroll-behavior:contain;pointer-events:auto;background:#fffffff5;color:#403d38;border:1px solid #e9e6e1;border-radius:var(--portal-card-radius);padding:10px 12px;box-shadow:0 3px 12px #2e2d2b0a;font-size:11px;line-height:1.5}
.washdoc-chart-tooltip:focus-visible{outline:2px solid var(--brand-focus,#4765ee);outline-offset:-2px}
.washdoc-chart-tooltip>div{display:flex;justify-content:space-between;gap:16px;margin:3px 0}.washdoc-chart-tooltip span{color:#807a73}.washdoc-chart-tooltip b{font-weight:400;font-variant-numeric:tabular-nums;text-align:right;overflow-wrap:anywhere}
.washdoc-chart>[data-graph-status]{padding:1rem}.washdoc-chart>[data-graph-retry]{margin:0 1rem}
.washdoc-chart[data-graph-ready="true"]>[data-graph-status]:not([hidden]){position:absolute;z-index:4;bottom:4px;left:8px;right:8px;margin:0;padding:6px 10px;background:#fffffff2;border:1px solid #ddd;border-radius:6px;font-size:.8rem}
.washdoc-chart-legend{display:flex;flex-wrap:wrap;gap:14px;padding:6px 12px 2px 54px;font-size:10px;color:#807a73;flex-shrink:0}.washdoc-chart-legend>span{display:flex;align-items:center;gap:5px}.washdoc-chart-legend i{display:block;width:8px;height:8px;border-radius:2px}
@media(max-width:600px){.washdoc-chart{padding-inline:calc(8px * var(--portal-line-spacing,1))}.washdoc-chart-tooltip{font-size:10px;padding:7px}.washdoc-chart-tooltip>div{gap:9px}.washdoc-chart-panels{gap:6px}}

/* Optional standalone host: the graph itself uses the same rules as the portal. */
.washdoc-component{--portal-card-radius:8px;display:grid;grid-template-columns:minmax(0,1fr) clamp(240px,28%,300px);height:var(--cycle-component-height,clamp(420px,65vh,760px));min-width:0;min-height:0;overflow:hidden;color:#2e2d2b;background:#fff}
.washdoc-component>.washdoc-chart{height:100%;min-height:0}
.washdoc-component-controls{display:flex;flex-direction:column;gap:24px;min-width:0;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;border-left:1px solid #e5e0d8;padding:16px;font-size:12px;line-height:1.5}
.washdoc-component-controls>section{flex:none;min-width:0}
.washdoc-component-controls:focus-visible{outline:2px solid var(--brand-focus,#4765ee);outline-offset:-3px}
.washdoc-component-controls h3{font-size:13px;margin:0 0 10px}.washdoc-component-controls p{color:#706b64;margin:0}
.washdoc-component [data-graph-states-options]{display:grid;gap:4px}
.washdoc-component [data-graph-states-options] label{display:flex;gap:8px;align-items:center;min-height:26px;cursor:pointer;overflow-wrap:anywhere}
.washdoc-component [data-graph-states-options] input{min-height:0;width:16px;height:16px;margin:0;accent-color:#5b7222}
.washdoc-component [data-graph-details-rows]>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:8px;padding:4px 0;overflow-wrap:anywhere}
.washdoc-component [data-graph-details-rows] span{color:#706b64}.washdoc-component [data-graph-details-rows] b{font-weight:400;text-align:right;font-variant-numeric:tabular-nums}
@media(min-width:960px){.washdoc-component [data-graph-details-rows]>div{grid-template-columns:minmax(0,1fr);gap:0;padding:6px 0}.washdoc-component [data-graph-details-rows] b{text-align:left}}
@media(max-width:959px){.washdoc-component{display:block;height:auto;overflow:visible}.washdoc-component>.washdoc-chart{height:clamp(360px,60vh,540px)}.washdoc-component-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);overflow:visible;border-left:0;border-top:1px solid #e5e0d8}}
@media(max-width:550px){.washdoc-component-controls{grid-template-columns:1fr}.washdoc-component>.washdoc-chart{height:540px}}
