.ej { --ej-blue:var(--brand-700,#1967d2); color:var(--text,#202124); min-width:0; }
.ej *, .ej *::before, .ej *::after { box-sizing:border-box; }
.ej header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:14px; }
.ej h2 { font-size:1.25rem; margin:0 0 4px; }
.ej h3 { font-size:1.1rem; margin:0 0 8px; }
.ej p { margin:8px 0; line-height:1.5; }
.ej .ej-muted { color:var(--text-muted,#5f6368); font-size:.9rem; }
.ej .ej-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.ej button, .ej input, .ej select { font:inherit; min-height:44px; }
.ej button { border:1px solid var(--border,#dadce0); background:var(--bg-panel,#fff); color:var(--text,#202124); border-radius:12px; padding:9px 14px; cursor:pointer; }
.ej button:hover { border-color:var(--ej-blue); }
.ej button:focus-visible, .ej input:focus-visible, .ej select:focus-visible, .ej summary:focus-visible { outline:3px solid #7fb5fc; outline-offset:2px; }
.ej button.ej-primary { background:var(--ej-blue); color:white; border-color:var(--ej-blue); }
.ej button:disabled { opacity:.55; cursor:wait; }
.ej nav { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:5px; margin:12px 0 20px; }
.ej nav button { text-align:left; padding:12px 8px; border:0; border-bottom:3px solid transparent; border-radius:8px 8px 0 0; background:var(--surface-2,#f1f3f4); font-size:.95rem; }
.ej nav button[aria-selected=true] { color:var(--ej-blue); border-bottom-color:var(--ej-blue); background:#e8f0fe; font-weight:700; }
.ej nav button span { display:inline-grid; place-items:center; width:24px; height:24px; margin-right:5px; background:white; border-radius:50%; font-size:.8rem; }
.ej .ej-card { background:var(--bg-panel,#fff); border:1px solid var(--border,#dadce0); border-radius:16px; padding:20px; margin:12px 0; }
.ej .ej-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; align-items:start; }
.ej .ej-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.ej label.ej-field { display:flex; flex-direction:column; gap:7px; font-size:.9rem; font-weight:600; min-width:0; }
.ej label small { font-weight:400; color:var(--text-muted,#5f6368); line-height:1.4; }
.ej input:not([type=checkbox]), .ej select, .ej textarea { width:100%; min-width:0; padding:10px; font-size:16px; color:inherit; border:1px solid var(--border,#dadce0); background:var(--bg-panel,#fff); border-radius:9px; }
.ej input[type=checkbox] { width:22px; height:22px; min-height:22px; flex:0 0 22px; }
.ej .ej-check { display:flex; align-items:flex-start; gap:12px; padding:12px 0; min-height:44px; line-height:1.5; }
.ej details { margin-top:15px; border-top:1px solid var(--border,#dadce0); padding-top:10px; }
.ej summary { cursor:pointer; padding:8px 0; min-height:44px; font-weight:600; }
.ej .ej-note { padding:12px 16px; border-radius:10px; background:#edf4ff; color:#254b77; line-height:1.5; margin:12px 0; }
.ej .ej-alert { border-left:4px solid #b45309; padding:12px 16px; background:#fff7e6; color:#713f12; border-radius:8px; margin:12px 0; }
.ej .ej-error { color:#a61d24; background:#fff0f0; border-left:4px solid #b3261e; padding:12px 16px; border-radius:8px; margin:12px 0; white-space:pre-line; }
.ej [aria-invalid=true] { border-color:#b3261e !important; }
.ej .ej-total { padding:15px 20px; background:#edf4ff; border-radius:12px; margin:14px 0; }
.ej .ej-total strong { font-size:1.25rem; }
.ej footer { display:flex; justify-content:space-between; gap:12px; margin-top:18px; padding:12px 0; }
.ej .ej-row { display:grid; grid-template-columns:1fr 1fr 1fr auto; gap:10px; align-items:end; margin:12px 0; }
.ej .ej-row.window { grid-template-columns:1fr 1fr auto; }
/* CB-164: native time controls; compact summary and read-only 24 h timeline. */
.ej .ej-time-row { border:1px solid var(--border,#dadce0); border-radius:12px; padding:16px; margin:12px 0; }
.ej .ej-time-heading { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:6px 16px; font-size:.9rem; }
.ej .ej-time-duration { color:var(--text-muted,#5f6368); font-size:.85rem; }
.ej .ej-time-duration.invalid { color:#a61d24; }
.ej .ej-time-row .ej-row { align-items:start; }
.ej .ej-time-row .ej-row > button { margin-top:25px; }
.ej .ej-time-field { min-width:0; font-size:.9rem; }
.ej .ej-time-field > label { display:block; margin-bottom:7px; font-weight:600; }
.ej .ej-time-control { display:flex; align-items:stretch; gap:6px; min-width:0; }
.ej .ej-time-control input { flex:1; width:0; min-height:48px; font-variant-numeric:tabular-nums; }
.ej .ej-time-control input[readonly] { background:var(--surface-2,#f1f3f4); }
.ej .ej-time-control button { flex:0 0 44px; padding:0; display:grid; place-items:center; color:var(--ej-blue); }
.ej .ej-time-control button:disabled { cursor:default; }
.ej .ej-time-control input::-webkit-calendar-picker-indicator { display:none; }
.ej label.ej-time-end { display:flex; align-items:center; gap:8px; min-height:44px; margin:2px 0 0; cursor:pointer; font-size:.8rem; font-weight:400; }
.ej .ej-time-shortcuts { display:flex; flex-wrap:wrap; gap:6px; align-items:center; font-size:.85rem; color:var(--text-muted,#5f6368); }
.ej .ej-time-shortcuts button { font-size:.85rem; color:var(--ej-blue); }
.ej .ej-time-overview { padding:14px; margin:14px 0; border-radius:12px; background:#edf4ff; color:#254b77; }
.ej .ej-clock-fallback { font-size:24px; line-height:1; }
.ej .ej-time-track { display:block; position:relative; width:100%; height:22px; margin:12px 0 6px; overflow:hidden; border-radius:6px; background:#d8e3f2; }
.ej .ej-time-track-fill { position:absolute; top:0; bottom:0; background:var(--ej-blue); }
.ej .ej-time-scale { display:flex; justify-content:space-between; gap:4px; font-size:.75rem; font-variant-numeric:tabular-nums; }
.ej .ej-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.ej .ej-metrics div { padding:16px; border:1px solid var(--border,#dadce0); border-radius:12px; }
.ej .ej-metrics strong { display:block; font-size:1.65rem; color:var(--ej-blue); margin:8px 0; }
.ej .ej-status { padding:18px; border-radius:12px; background:#edf4ff; margin:14px 0; }
.ej .ej-status.good { background:#e9f6ee; color:#156534; }
.ej .ej-status.bad { background:#fff0f0; color:#a61d24; }
.ej .ej-status h3 { color:inherit; }
.ej .ej-small-list { padding-left:22px; line-height:1.6; }
.ej a { color:var(--ej-blue); text-underline-offset:3px; }
.ej [hidden] { display:none !important; }
.ej .ej-study-row { display:flex; gap:12px; align-items:center; justify-content:space-between; padding:12px 0; border-top:1px solid var(--border,#dadce0); }
.ej .ej-study-row span { overflow-wrap:anywhere; }
.ej .ej-stale { color:#9a5200; font-size:.9rem; }
@media(max-width:900px) {
  .ej nav { grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; }
  .ej .ej-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:540px) {
  .ej h2 { font-size:1.12rem; }
  .ej .ej-card { padding:14px; border-radius:12px; }
  .ej .ej-grid, .ej .ej-grid.two, .ej .ej-metrics { grid-template-columns:1fr; }
  .ej nav { display:none; }
  .ej .ej-mobile-nav { display:block !important; margin:10px 0 16px; padding:6px 0; position:sticky; top:0; z-index:4; background:var(--surface,#f7f9fc); }
  .ej .ej-mobile-nav label.ej-field { display:flex; flex-direction:row; align-items:center; white-space:nowrap; gap:8px; font-size:.78rem; }
  .ej .ej-mobile-nav select { flex:1; width:auto; }
  .ej [role=tabpanel] { scroll-margin-top:68px; }
  .ej .ej-row { grid-template-columns:1fr 1fr; }
  .ej .ej-row.window { grid-template-columns:1fr 1fr; }
  .ej .ej-row button { grid-column:1/-1; justify-self:start; }
  .ej .ej-time-row { padding:12px; }
  .ej .ej-time-row .ej-row, .ej .ej-time-row .ej-row.window { grid-template-columns:1fr; gap:8px; }
  .ej .ej-time-row .ej-row > button { margin-top:0; }
  .ej .ej-time-control button { grid-column:auto; justify-self:auto; }
  .ej .ej-time-shortcuts > span { flex-basis:100%; }
  .ej .ej-actions { gap:6px; }
  .ej button { padding:9px 11px; }
  .ej header { gap:8px; }
  .ej .ej-metrics strong { font-size:1.4rem; }
}
@media print {
  .ej nav, .ej footer, .ej button, .ej .ej-mobile-nav { display:none !important; }
  .ej .ej-card, .ej .ej-status { break-inside:avoid; }
}