/* Clear workspace. Screen-only presentation keeps printed invoice rules intact. */
.mobile-navigation{display:none}
@media screen {
  body[data-workspace-appearance="clear"] {
    color-scheme:light;
    --bg-primary:#f3f6fa;--bg-secondary:#fff;--bg-tertiary:#edf2f7;
    --text-primary:#182d43;--text-secondary:#53697f;--text-muted:#637488;
    --accent-primary:#2f648e;--accent-hover:#234f74;--accent-secondary:#527597;
    --border-color:#dfe7ef;--border-subtle:#cbd7e2;--danger-color:#b42336;--danger-hover:#901c2c;
    --success-color:#247051;--warning-color:#805c0e;
    --surface-background:var(--bg-secondary);--canvas-background:var(--bg-primary);
    --muted-text:var(--text-muted);--secondary-text:var(--text-secondary);
    --primary-text:var(--text-primary);
    --typo-workspaceBody-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    --typo-workspaceBody-size:15px;--typo-workspaceBody-weight:400;--typo-workspaceBody-style:normal;--typo-workspaceBody-spacing:0;--typo-workspaceBody-line:1.5;--typo-workspaceBody-transform:none;
    --typo-workspaceHeadings-family:var(--typo-workspaceBody-family);--typo-workspaceHeadings-size:30px;--typo-workspaceHeadings-weight:600;--typo-workspaceHeadings-style:normal;--typo-workspaceHeadings-spacing:-.035em;--typo-workspaceHeadings-line:1.18;--typo-workspaceHeadings-transform:none;
    --typo-workspaceLabels-family:var(--typo-workspaceBody-family);--typo-workspaceLabels-size:12px;--typo-workspaceLabels-weight:500;--typo-workspaceLabels-style:normal;--typo-workspaceLabels-spacing:.015em;--typo-workspaceLabels-line:1.4;--typo-workspaceLabels-transform:none;
    --typo-workspaceButtons-family:var(--typo-workspaceBody-family);--typo-workspaceButtons-size:14px;--typo-workspaceButtons-weight:500;--typo-workspaceButtons-style:normal;--typo-workspaceButtons-spacing:0;--typo-workspaceButtons-line:1.3;--typo-workspaceButtons-transform:none;
    --typo-workspaceMetrics-family:var(--typo-workspaceBody-family);--typo-workspaceMetrics-size:32px;--typo-workspaceMetrics-weight:500;--typo-workspaceMetrics-style:normal;--typo-workspaceMetrics-spacing:-.04em;--typo-workspaceMetrics-line:1.2;--typo-workspaceMetrics-transform:none;
  }
  .app-layout{max-width:1720px;margin:auto}
  .sidebar{width:228px;padding:30px 18px;position:sticky;top:0;height:100vh;max-height:100vh;overflow:auto}
  .workspace-wordmark{color:var(--text-primary);font-size:25px;font-weight:600;letter-spacing:-1.2px;margin-bottom:14px}
  .workspace-wordmark small{display:block;font-size:10px;font-weight:500;letter-spacing:3.5px;margin-top:2px}
  .brand{padding:0 10px;margin-bottom:14px}
  .brand-title{color:var(--text-secondary);font-size:13px;font-weight:500;letter-spacing:0;overflow-wrap:anywhere}
  .brand-subtitle{display:none}
  .sidebar-status-container{padding:0 10px;margin-bottom:28px}
  .network-status-pill{background:transparent;border:0;padding:0;font-weight:400}
  .sidebar-nav{gap:6px}
  .nav-item{border-radius:10px;font-size:13px;font-weight:500;min-height:44px;padding:11px 12px}
  .nav-item.active{background:color-mix(in srgb,var(--accent-primary) 10%,var(--bg-secondary));color:var(--accent-primary)}
  .nav-item svg,.mobile-navigation svg{width:19px;height:19px;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
  .sidebar-footer{margin-top:32px;border-top:1px solid var(--border-color);padding:16px 8px 0}
  .appearance-control{display:grid;gap:7px;font-size:11px;color:var(--text-secondary);margin-bottom:13px}
  [data-workspace-appearance-picker]{font-size:12px;padding:8px;border-radius:7px;width:100%;color:var(--text-primary);background:var(--bg-secondary);border:1px solid var(--border-color)}
  .version-label{font-size:10px}
  .main-content{min-width:0;width:100%;padding:40px 42px;overflow-x:clip;max-width:none}
  .view-header{gap:18px;align-items:center;margin-bottom:30px}
  .view-title,.section-title,.modal-title,.metric-value,.empty-state h3,.client-name{color:var(--text-primary)}
  .view-title{max-width:850px}
  .view-subtitle{color:var(--text-secondary);font-size:13px;max-width:620px;margin-top:9px}
  .workspace-eyebrow{font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:var(--text-muted);margin-bottom:10px}
  .metrics-grid{gap:16px;margin-bottom:22px}
  #view-dashboard>.metrics-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .metric-card{border-radius:16px;padding:22px;background:var(--bg-secondary);box-shadow:0 3px 10px #182d4303}
  .metric-label{text-transform:none;letter-spacing:0;color:var(--text-secondary)}
  .metric-value{margin:9px 0 7px;font-variant-numeric:tabular-nums}
  .metric-footnote{font-size:11px;color:var(--text-muted)}
  #view-dashboard>.metrics-grid>.metric-card:last-child{grid-column:1/-1;background:color-mix(in srgb,var(--accent-primary) 6%,var(--bg-secondary));padding:20px 24px}
  .dashboard-punch-status-wrapper{margin-top:10px}
  .dash-punch-timer{font-variant-numeric:tabular-nums}
  .section-card,.client-card{border-radius:16px;box-shadow:none;padding:24px;margin-bottom:22px}
  .section-title{font-size:18px;font-weight:600;letter-spacing:-.025em}
  .section-description{font-size:12px;color:var(--text-secondary)}
  .data-table th{background:transparent;color:var(--text-secondary);font-size:10px;font-weight:500;letter-spacing:.07em;border-bottom:1px solid var(--border-color);padding:15px 12px}
  .data-table td{padding:18px 12px;border-color:var(--border-color);font-size:13px}
  .data-table tbody tr:hover{background:color-mix(in srgb,var(--accent-primary) 3%,var(--bg-secondary))}
  .btn{border-radius:9px;padding:11px 16px;min-height:42px;box-shadow:none}
  .btn-sm{padding:8px 11px;min-height:34px;font-size:12px}
  .btn-xs{padding:6px 9px;min-height:30px;font-size:11px}
  .btn-secondary{background:var(--bg-secondary);border-color:var(--border-subtle)}
  .btn-secondary:hover:not(:disabled){background:var(--bg-tertiary)}
  .form-input,.form-select{background:var(--bg-secondary);border-color:var(--border-subtle);color:var(--text-primary);border-radius:9px;padding:11px 12px;min-height:43px}
  .form-input:focus,.form-select:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-primary) 14%,transparent)}
  .form-hint{color:var(--text-secondary)}
  .modal-backdrop{background:#14243966;backdrop-filter:blur(4px)}
  .modal-dialog{box-shadow:0 24px 80px #14243926;border-radius:18px}
  .modal-header{padding:22px 24px}
  .modal-title{font-size:22px}
  .empty-state{padding:38px 18px}
  .empty-state p{color:var(--text-secondary);font-size:13px}
  .empty-state .btn{margin-top:16px}
  .workspace-sync-details{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:14px;margin-bottom:18px;padding:18px 20px}
  .workspace-sync-details>summary{cursor:pointer;color:var(--text-primary);font-size:14px;font-weight:500;list-style-position:inside}
  #workspace-sync-summary{float:right;color:var(--text-secondary);font-size:12px;font-weight:400}
  .workspace-sync-details>#sync-foundation-panel{border:0;padding:22px 0 0;margin:0}
  #offline-panel{padding:18px 20px}
  #offline-panel summary{cursor:pointer;font-size:14px;font-weight:500}
  #offline-panel p,#offline-panel .header-actions{margin-top:14px}
  .theme-appearance-note{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:12px;padding:16px;margin-bottom:20px;font-size:13px;color:var(--text-secondary)}
  .punch-google-card{background:var(--bg-secondary);border:1px solid var(--border-color);box-shadow:none;border-radius:20px}
  .punch-google-clock-shell{background:var(--bg-tertiary)}
  .punch-google-idle-time,.punch-google-title{color:var(--text-primary)}
  .toast-container{max-width:min(420px,calc(100vw - 24px))}
  body[data-workspace-appearance="clear"] .text-success{color:#247051}
  body[data-workspace-appearance="clear"] .network-status-pill.online{color:#247051}
  body[data-workspace-appearance="clear"] .network-status-pill.offline{color:#a8333c}
  body[data-workspace-appearance="clear"] .badge-draft{background:#eaf0f5;color:#53697f}
  body[data-workspace-appearance="clear"] .badge-sent{background:#e7effa;color:#315f98}
  body[data-workspace-appearance="clear"] .badge-paid,body[data-workspace-appearance="clear"] .badge-project-active{background:#e6f2eb;color:#247051}
  body[data-workspace-appearance="clear"] .badge-overdue{background:#fbe9e9;color:#a8333c}
  body[data-workspace-appearance="clear"] .badge-void{background:#edf0f3;color:#687381}
  body[data-workspace-appearance="clear"] .badge-project-on-hold{background:#fcf1d8;color:#805c0e}
  body[data-workspace-appearance="clear"] .badge-project-completed{background:#e7effa;color:#315f98}
  body[data-workspace-appearance="clear"] .badge-project-archived{background:#edf0f3;color:#687381}
  body[data-workspace-appearance="clear"] .client-card-header h3{color:var(--text-primary)}
  @media(max-width:1000px){.sidebar{width:196px;padding:24px 12px}.main-content{padding:30px 24px}.metrics-grid{gap:12px}.metric-card{padding:18px}}
  @media(max-width:800px){
    .app-layout{display:block}
    .sidebar{position:static;width:100%;height:auto;max-height:none;padding:18px 20px;border-right:0;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;overflow:visible}
    .brand{padding:0;margin:0}.workspace-wordmark{font-size:23px;margin:0}.workspace-wordmark small,.brand-title,.sidebar .sidebar-nav,.sidebar .sidebar-footer{display:none}
    .sidebar-status-container{padding:0;margin:0}.network-status-pill{font-size:11px}
    .main-content{padding:26px 16px calc(100px + env(safe-area-inset-bottom));overflow-x:clip}
    .view-header{align-items:flex-start;flex-direction:column;gap:16px;margin-bottom:24px}
    .view-title{font-size:28px}.view-subtitle{font-size:12px}.workspace-eyebrow{font-size:10px}
    #view-dashboard>.metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
    #view-dashboard>.metrics-grid>.metric-card:nth-child(3){grid-column:1/-1;display:grid;grid-template-columns:1fr auto;gap:2px 8px;align-items:center}
    #view-dashboard>.metrics-grid>.metric-card:nth-child(3) .metric-value{grid-column:2;grid-row:1/3;margin:0}
    .metric-card{padding:17px 15px;border-radius:14px}.metric-label{font-size:11px}.metric-value{font-size:28px}.metric-footnote{font-size:10px}
    .section-card,.client-card{padding:18px 15px}.data-table td{padding:15px 10px}.table-responsive{overflow:auto}
    .header-actions{gap:8px}.form-input,.form-select{font-size:16px}.btn{min-height:44px}
    .mobile-navigation{position:fixed;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));bottom:0;left:0;right:0;padding:8px 12px calc(8px + env(safe-area-inset-bottom));border-top:1px solid var(--border-color);background:var(--bg-secondary);z-index:100;box-shadow:0 -4px 20px #182d4308}
    .mobile-navigation>.nav-item,.mobile-more>summary{min-height:52px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:5px;color:var(--text-secondary);font-size:10px;cursor:pointer;border-radius:9px;text-decoration:none}
    .mobile-navigation>.nav-item.active{color:var(--accent-primary);background:var(--bg-tertiary)}
    .mobile-more>summary{list-style:none}.mobile-more>summary::-webkit-details-marker{display:none}
    .mobile-more[open]>summary{color:var(--accent-primary);background:var(--bg-tertiary)}
    .mobile-more-menu{position:absolute;bottom:calc(100% + 8px);right:12px;width:min(300px,calc(100vw - 24px));max-height:65vh;overflow:auto;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:16px;box-shadow:0 12px 48px #182d4326;padding:12px}
    .mobile-more-menu .nav-item{font-size:14px}.mobile-more-menu .appearance-control{padding:12px 10px 4px;margin-bottom:0}.mobile-more-menu select{font-size:16px;min-height:44px}
    #workspace-sync-summary{display:block;float:none;margin:6px 0 0 17px}
    .toast-container{bottom:calc(88px + env(safe-area-inset-bottom))}
    .punch-google-card{padding:24px 16px}.punch-google-title{font-size:23px}.punch-google-idle-time{font-size:48px}
  }
}
@media print {.mobile-navigation,.workspace-eyebrow,.theme-appearance-note{display:none!important}}

/* Phase J v5: Daylo identity. Screen-only; invoice branding is independent. */
@media screen {
  .workspace-wordmark{display:flex;align-items:center;gap:10px;font-size:28px;letter-spacing:-1px}
  .daylo-mark{display:block;flex-shrink:0;border-radius:11px;width:38px;height:38px}
  @media(max-width:800px){.workspace-wordmark{font-size:25px;gap:9px}.daylo-mark{width:32px;height:32px;border-radius:9px}}
}