@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,300&family=DM+Mono:wght@400;500&display=swap');

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

:root {
  --black:    #0A0A0A;
  --offwhite: #F5F3EE;
  --mid:      #8A8680;
  --rule:     #D8D4CC;
  --accent:   #C9A96E;
  --tile-bg:  #FFFFFF;
  --locked:   #F0EEE9;
  --danger:   #C0392B;
  --success:  #27AE60;
}

html { font-size: 16px; }
body { font-family: 'DM Sans', sans-serif; background: var(--offwhite); color: var(--black); min-height: 100vh; }

a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; display: block; }
button, input, select, textarea { font-family: inherit; }

/* ── LOGIN ───────────────────────────────────── */
body.login-body {
  background: var(--black);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
}

.login-wrap { width: 100%; max-width: 400px; padding: 48px 40px; }

.login-logo { margin-bottom: 48px; }
.wordmark { font-family: 'DM Mono', monospace; font-size: 28px; font-weight: 500; letter-spacing: 0.14em; color: #fff; text-transform: uppercase; }
.logo-sub  { font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--mid); margin-top: 6px; }

.login-error { background: rgba(192,57,43,0.15); border: 1px solid rgba(192,57,43,0.4); color: #e07b6e; border-radius: 4px; padding: 11px 14px; font-size: 13px; margin-bottom: 20px; }

.login-field { margin-bottom: 16px; }
.login-field label { display: block; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--mid); margin-bottom: 8px; }
.login-field input { width: 100%; background: #161616; border: 1px solid #2A2A2A; border-radius: 4px; padding: 13px 16px; font-size: 15px; color: #fff; outline: none; transition: border-color 0.2s; }
.login-field input:focus { border-color: var(--accent); }

.login-btn { width: 100%; margin-top: 8px; background: var(--accent); color: var(--black); border: none; border-radius: 4px; padding: 14px; font-size: 13px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; transition: opacity 0.2s; }
.login-btn:hover { opacity: 0.85; }

.login-footer { margin-top: 32px; font-size: 12px; color: #333; text-align: center; }

/* ── TOPBAR ──────────────────────────────────── */
.topbar { background: var(--black); padding: 0 48px; height: 56px; display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; position: sticky; top: 0; z-index: 100; }
.topbar-logo { font-family: 'DM Mono', monospace; font-size: 15px; font-weight: 500; letter-spacing: 0.16em; color: #fff; text-transform: uppercase; }
.topbar-right { display: flex; align-items: center; gap: 24px; }
.user-pill { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--mid); }
.user-dot { width: 28px; height: 28px; border-radius: 50%; background: var(--accent); display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 600; color: var(--black); flex-shrink: 0; }
.logout-btn { font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: #444; background: none; border: none; cursor: pointer; transition: color 0.2s; }
.logout-btn:hover { color: #fff; }

/* ── HUB ─────────────────────────────────────── */
body.hub-body { display: flex; flex-direction: column; }
.hub-main { flex: 1; padding: 56px 48px; max-width: 1080px; width: 100%; margin: 0 auto; }

.hub-header { margin-bottom: 48px; }
.eyebrow { font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--mid); font-weight: 400; margin-bottom: 10px; }
.hub-header h1 { font-size: 30px; font-weight: 300; letter-spacing: -0.02em; }
.hub-header h1 strong { font-weight: 600; }

.tile-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }

.tile { background: var(--tile-bg); border-radius: 6px; padding: 32px 28px 28px; transition: transform 0.18s, box-shadow 0.18s; border: 1px solid var(--rule); position: relative; overflow: hidden; display: block; }
a.tile:hover { transform: translateY(-3px); box-shadow: 0 12px 36px rgba(0,0,0,0.08); }
.tile.locked { background: var(--locked); opacity: 0.55; cursor: default; }

.tile-bar { width: 28px; height: 3px; background: var(--accent); border-radius: 2px; margin-bottom: 22px; }
.tile.locked .tile-bar { background: var(--mid); }

.tile-icon { width: 32px; height: 32px; margin-bottom: 14px; background: var(--accent); border-radius: 4px; opacity: 0.7; }
.tile-name { font-size: 17px; font-weight: 600; color: var(--black); margin-bottom: 8px; }
.tile-desc { font-size: 13px; color: var(--mid); line-height: 1.65; }

.tile-badge { position: absolute; top: 14px; right: 14px; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; background: var(--black); color: #fff; padding: 3px 8px; border-radius: 2px; font-family: 'DM Mono', monospace; }
.tile.locked .tile-badge { background: var(--mid); }

.role-bar { margin-top: 40px; padding: 18px 24px; background: #fff; border-radius: 6px; border: 1px solid var(--rule); display: flex; align-items: center; gap: 14px; }
.role-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); flex-shrink: 0; }
.role-bar p { font-size: 13px; color: var(--mid); line-height: 1.5; }
.role-bar p strong { color: var(--black); }

/* ── INNER PAGE LAYOUT ───────────────────────── */
body.inner-body { display: flex; flex-direction: column; min-height: 100vh; }
.page-main { flex: 1; padding: 40px 48px; max-width: 1080px; width: 100%; margin: 0 auto; }

.breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--mid); margin-bottom: 32px; }
.breadcrumb a { color: var(--mid); transition: color 0.15s; }
.breadcrumb a:hover { color: var(--black); }
.breadcrumb span { opacity: 0.4; }

.page-header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 32px; gap: 16px; }
.page-header h2 { font-size: 24px; font-weight: 300; letter-spacing: -0.02em; }
.page-header h2 strong { font-weight: 600; }

/* ── BUTTONS ─────────────────────────────────── */
.btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 20px; border-radius: 4px; font-size: 13px; font-weight: 500; cursor: pointer; border: 1px solid transparent; transition: all 0.15s; text-decoration: none; white-space: nowrap; }
.btn-primary   { background: var(--black); color: #fff; border-color: var(--black); }
.btn-primary:hover { background: #222; }
.btn-accent    { background: var(--accent); color: var(--black); border-color: var(--accent); font-weight: 600; }
.btn-accent:hover { opacity: 0.85; }
.btn-secondary { background: #fff; color: var(--black); border-color: var(--rule); }
.btn-secondary:hover { border-color: #aaa; }
.btn-danger    { background: #fff; color: var(--danger); border-color: #e8b4b0; }
.btn-danger:hover { background: var(--danger); color: #fff; border-color: var(--danger); }
.btn-sm        { padding: 7px 14px; font-size: 12px; }
.pw-strength   { margin-top: 8px; }

/* ── NOTICES ─────────────────────────────────── */
.notice { padding: 12px 16px; border-radius: 4px; font-size: 13px; margin-bottom: 24px; }
.notice-success { background: #eafaf1; border: 1px solid #a9dfbf; color: #1e8449; }
.notice-error   { background: #fdf2f0; border: 1px solid #e8b4b0; color: var(--danger); }
.notice-info    { background: #eef4ff; border: 1px solid #b3ccf5; color: #2c5fb5; }

/* ── Daily Log mobile cards ─────────────────────── */
.log-mobile-row { display: none; }
.log-card { padding: 16px; border-bottom: 1px solid var(--rule); }
.log-card-top { margin-bottom: 4px; }
.log-card-date { font-family: 'DM Mono', monospace; font-size: 12px; color: var(--mid); }
.log-card-project { font-size: 14px; font-weight: 600; margin-bottom: 2px; }
.log-card-wo { font-size: 11px; margin-bottom: 8px; }
.log-card-notes { font-size: 13px; color: var(--mid); margin-bottom: 10px; line-height: 1.5; }
.log-card-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; }
.log-card-meta > div { font-size: 13px; }
.log-card-label { display: block; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--mid); margin-bottom: 2px; }
.log-card-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }

@media (max-width: 640px) {
  .log-desktop-row { display: none; }
  .log-mobile-row  { display: table-row; }
  .table-wrap { overflow-x: visible; }
  .data-table thead { display: none; }
}

/* ── Admin Tabs ─────────────────────────────────── */
.tab-nav { display: flex; gap: 0; border-bottom: 2px solid var(--rule); margin-bottom: 32px; }
.tab-link { padding: 10px 24px; font-size: 13px; font-weight: 500; color: var(--mid); border-bottom: 2px solid transparent; margin-bottom: -2px; text-decoration: none; transition: color 0.15s; }
.tab-link:hover { color: var(--black); }
.tab-link.active { color: var(--black); border-bottom-color: var(--accent); }

/* ── Project Cards ──────────────────────────────── */
.project-card { background: #fff; border: 1px solid var(--rule); border-radius: 6px; padding: 24px; margin-bottom: 16px; }
.project-card-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 16px; }
.project-card-name { font-size: 15px; font-weight: 600; }
.project-card-address { font-size: 12px; color: var(--mid); margin-top: 3px; }
.wo-list { display: flex; flex-direction: column; gap: 8px; }
.wo-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; background: var(--offwhite); border-radius: 4px; gap: 12px; }
.wo-row--closed { opacity: 0.55; }
.wo-info { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; }
.wo-name { font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wo-badge { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 600; padding: 2px 8px; border-radius: 20px; white-space: nowrap; }
.wo-badge--permanent { background: rgba(201,169,110,0.15); color: var(--accent); }
.wo-badge--open      { background: rgba(39,174,96,0.12); color: #1e8449; }
.wo-badge--closed    { background: var(--rule); color: var(--mid); }

/* ── TABLE ───────────────────────────────────── */
.data-table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 6px; overflow: hidden; border: 1px solid var(--rule); }
.data-table th { font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--mid); background: #faf9f7; padding: 12px 16px; text-align: left; border-bottom: 1px solid var(--rule); font-weight: 500; }
.data-table td { padding: 14px 16px; font-size: 14px; border-bottom: 1px solid var(--rule); vertical-align: middle; }
.data-table tr:last-child td { border-bottom: none; }
.data-table tr:hover td { background: #faf9f7; }
.data-table .td-actions { display: flex; gap: 8px; align-items: center; }

.table-wrap { background: #fff; border-radius: 6px; border: 1px solid var(--rule); overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-toolbar { padding: 16px 20px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--rule); flex-wrap: wrap; }

/* ── FORMS ───────────────────────────────────── */
.form-card { background: #fff; border: 1px solid var(--rule); border-radius: 6px; padding: 32px; }
.form-group { margin-bottom: 24px; }
.form-group label { display: block; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--mid); margin-bottom: 8px; font-weight: 500; }
.form-group input[type=text],
.form-group input[type=date],
.form-group input[type=email],
.form-group input[type=password],
.form-group select,
.form-group textarea { width: 100%; background: var(--offwhite); border: 1px solid var(--rule); border-radius: 4px; padding: 11px 14px; font-size: 14px; color: var(--black); outline: none; transition: border-color 0.2s; }
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus { border-color: var(--accent); background: #fff; }
.form-group textarea { resize: vertical; min-height: 120px; line-height: 1.6; }
.form-group select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%238A8680'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 36px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.form-actions { display: flex; gap: 12px; align-items: center; padding-top: 8px; }
.form-hint { font-size: 12px; color: var(--mid); margin-top: 6px; }

/* ── WEATHER WIDGET ──────────────────────────── */
.weather-widget { background: var(--offwhite); border: 1px solid var(--rule); border-radius: 6px; padding: 16px 20px; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.weather-icon { font-size: 32px; line-height: 1; }
.weather-main { font-size: 24px; font-weight: 300; color: var(--black); }
.weather-main span { font-size: 14px; color: var(--mid); }
.weather-meta { display: flex; gap: 20px; font-size: 13px; color: var(--mid); }
.weather-meta strong { color: var(--black); }
.weather-empty { color: var(--mid); font-size: 13px; font-style: italic; }
.weather-fetch-btn { background: none; border: 1px solid var(--rule); border-radius: 4px; padding: 8px 14px; font-size: 12px; color: var(--mid); cursor: pointer; transition: all 0.15s; white-space: nowrap; }
.weather-fetch-btn:hover { border-color: var(--accent); color: var(--black); }

/* ── PHOTO UPLOAD ────────────────────────────── */
.photo-section { background: #fff; border: 1px solid var(--rule); border-radius: 6px; padding: 28px; }
.photo-section h3 { font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--mid); margin-bottom: 20px; }

.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; margin-bottom: 20px; }
.photo-thumb { position: relative; aspect-ratio: 4/3; border-radius: 4px; overflow: hidden; background: var(--offwhite); border: 1px solid var(--rule); }
.photo-thumb img { width: 100%; height: 100%; object-fit: cover; }
.photo-thumb .photo-delete { position: absolute; top: 6px; right: 6px; width: 24px; height: 24px; background: rgba(0,0,0,0.6); color: #fff; border: none; border-radius: 50%; cursor: pointer; font-size: 14px; line-height: 24px; text-align: center; display: none; }
.photo-thumb:hover .photo-delete { display: block; }

.upload-zone { border: 2px dashed var(--rule); border-radius: 6px; padding: 32px; text-align: center; cursor: pointer; transition: all 0.2s; margin-top: 16px; display: block; }
.upload-zone:hover, .upload-zone.drag-over { border-color: var(--accent); background: rgba(201,169,110,0.04); }
.upload-zone input[type=file] { display: none; }
.upload-zone p { font-size: 14px; color: var(--mid); margin-top: 8px; }
.upload-zone .upload-cta { font-size: 13px; font-weight: 600; color: var(--black); }
.upload-progress { margin-top: 12px; font-size: 12px; color: var(--mid); min-height: 18px; }

.photo-thumb--loading { background: #f0ede8; }
.photo-skeleton { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.photo-spinner {
  width: 28px; height: 28px;
  border: 3px solid var(--rule);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── FILTER BAR ──────────────────────────────── */
.filter-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.filter-bar input, .filter-bar select { background: #fff; border: 1px solid var(--rule); border-radius: 4px; padding: 8px 12px; font-size: 13px; color: var(--black); outline: none; }
.filter-bar input:focus, .filter-bar select:focus { border-color: var(--accent); }
.filter-bar select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%238A8680'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; padding-right: 28px; }

/* ── EMPTY STATE ─────────────────────────────── */
.empty-state { text-align: center; padding: 64px 32px; }
.empty-state p { color: var(--mid); font-size: 15px; margin-bottom: 20px; }

/* ── PDF EXPORT FORM ─────────────────────────── */
.export-card { background: #fff; border: 1px solid var(--rule); border-radius: 6px; padding: 32px; max-width: 540px; }
.export-card h3 { font-size: 16px; font-weight: 600; margin-bottom: 6px; }
.export-card .desc { font-size: 13px; color: var(--mid); margin-bottom: 28px; line-height: 1.6; }

/* ── MOBILE ──────────────────────────────────── */
@media (max-width: 768px) {
  .topbar { padding: 0 20px; }
  .hub-main, .page-main { padding: 28px 20px; }
  .tile-grid { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .page-header { flex-direction: column; }
  .table-toolbar { flex-direction: column; align-items: stretch; }
  .filter-bar { flex-direction: column; }
  .filter-bar input, .filter-bar select { width: 100%; }
  .photo-grid { grid-template-columns: repeat(2, 1fr); }
  .login-wrap { padding: 40px 24px; }
  .data-table { font-size: 13px; }
  .data-table th, .data-table td { padding: 10px 12px; }
  .weather-meta { gap: 12px; }
}

@media (max-width: 480px) {
  .hub-main, .page-main { padding: 20px 16px; }
  .form-card { padding: 20px; }
  .photo-section { padding: 20px; }
}

/* ── P&L APP ─────────────────────────────────── */

/* Summary strip */
.pl-summary-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 24px; }
.pl-summary-card { background: #fff; border: 0.5px solid #e2ddd6; border-radius: 8px; padding: 14px 16px; }
.pl-summary-label { font-size: 11px; color: var(--mid); margin-bottom: 5px; }
.pl-summary-value { font-size: 20px; font-weight: 500; color: var(--black); font-variant-numeric: tabular-nums; }
.pl-summary-sub { font-size: 11px; color: #9ca3af; margin-top: 3px; }
.pl-summary-profit .pl-summary-value { color: #27500A; }
.pl-summary-loss   .pl-summary-value { color: #B85400; }

/* Project block (dashboard card) */
.pl-project-block { display: block; background: #fff; border: 0.5px solid #e2ddd6; border-radius: 8px; overflow: hidden; text-decoration: none; color: inherit; transition: box-shadow .15s; }
.pl-project-block:hover { box-shadow: 0 4px 20px rgba(0,0,0,.07); }
.pl-project-header { padding: 14px 16px; display: flex; justify-content: space-between; align-items: flex-start; border-bottom: 0.5px solid #ede9e2; }
.pl-ph-left { flex: 1; }
.pl-ph-num  { font-size: 11px; color: var(--mid); margin-bottom: 2px; }
.pl-ph-name { font-size: 14px; font-weight: 600; }
.pl-ph-client { font-size: 12px; color: var(--mid); margin-top: 2px; }
.pl-ph-right { text-align: right; flex-shrink: 0; margin-left: 12px; }
.pl-ph-profit { font-size: 16px; font-weight: 500; font-variant-numeric: tabular-nums; }
.pl-ph-margin { font-size: 11px; color: #9ca3af; margin-top: 3px; }
.pl-pos { color: #27500A; }
.pl-neg { color: #B85400; }
.pl-warn { color: #92400e; }
.pl-project-metrics { display: grid; grid-template-columns: repeat(4, 1fr); padding: 12px 16px; gap: 12px; border-bottom: 0.5px solid #ede9e2; }
.pl-pm-label { font-size: 11px; color: var(--mid); margin-bottom: 3px; }
.pl-pm-value { font-size: 15px; font-weight: 500; font-variant-numeric: tabular-nums; }
.pl-pm-sub { font-size: 11px; color: #9ca3af; margin-top: 2px; }
.pl-project-footer { padding: 8px 16px; display: flex; justify-content: space-between; align-items: center; font-size: 11px; color: #9ca3af; }
.pl-footer-cta { font-size: 12px; font-weight: 500; color: var(--accent); }

/* Badge */
.pl-badge { display: inline-block; padding: 2px 8px; border-radius: 20px; font-size: 10px; font-weight: 600; }

/* Metrics row (detail page) */
.pl-metrics-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 16px; }
.pl-metric-card { background: #fff; border: 0.5px solid #e2ddd6; border-radius: 8px; padding: 12px 14px; }
.pl-metric-label { font-size: 11px; color: var(--mid); margin-bottom: 5px; }
.pl-metric-value { font-size: 17px; font-weight: 500; font-variant-numeric: tabular-nums; }
.pl-metric-sub { font-size: 11px; color: #9ca3af; margin-top: 3px; }

/* Tabs */
.pl-tab { padding: 5px 13px; border-radius: 4px; font-size: 12px; font-weight: 500; color: var(--mid); text-decoration: none; transition: all .15s; }
.pl-tab:hover { background: var(--offwhite); color: var(--black); }
.pl-tab-active { background: #EFF6FF; color: #2563eb; }

/* Category block */
.pl-cat-block { background: #fff; border: 0.5px solid #e2ddd6; border-radius: 8px; overflow: hidden; margin-bottom: 10px; }
.pl-cat-header { padding: 10px 14px; display: flex; align-items: center; gap: 10px; cursor: pointer; border-bottom: 0.5px solid #ede9e2; transition: filter .15s; }
.pl-cat-header:hover { filter: brightness(.97); }
.pl-cat-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
.pl-cat-name { font-size: 13px; font-weight: 600; flex: 1; }
.pl-cat-toggle { font-size: 14px; color: #9ca3af; width: 16px; text-align: center; transition: transform .2s; flex-shrink: 0; }

/* Variance badges */
.pl-bdg-under { background: #EAF3DE; color: #27500A; font-size: 10px; padding: 2px 8px; border-radius: 20px; font-weight: 600; white-space: nowrap; }
.pl-bdg-over  { background: #FAEEDA; color: #B85400; font-size: 10px; padding: 2px 8px; border-radius: 20px; font-weight: 600; white-space: nowrap; }
.pl-bdg-even  { background: #f3f4f6; color: var(--mid); font-size: 10px; padding: 2px 8px; border-radius: 20px; font-weight: 600; white-space: nowrap; }

/* Line item table */
.pl-line-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.pl-line-table th { background: #faf9f7; color: var(--mid); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; padding: 7px 12px; text-align: left; border-bottom: 0.5px solid #ede9e2; }
.pl-line-table td { padding: 8px 12px; border-bottom: 0.5px solid #ede9e2; vertical-align: middle; }
.pl-line-table tr:last-child td { border-bottom: none; }
.pl-line-table tr:hover td { background: #faf9f7; }
.pl-line-table tfoot td { background: #faf9f7; font-weight: 600; font-size: 12px; color: var(--mid); padding: 8px 12px; border-top: 0.5px solid #e2ddd6; }

/* Progress bars */
.pl-prog-wrap { height: 4px; background: #e2ddd6; border-radius: 2px; margin-top: 5px; overflow: hidden; }
.pl-prog-fill { height: 100%; border-radius: 2px; }
.pl-prog-green { background: #27ae60; }
.pl-prog-warn  { background: #d97706; }
.pl-prog-red   { background: #B85400; }

/* Modals */
.pl-modal-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 1000; align-items: center; justify-content: center; }
.pl-modal { background: #fff; border-radius: 8px; padding: 24px; width: 100%; max-width: 500px; max-height: 88vh; overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,.2); margin: 0 16px; }
.pl-modal-title { font-size: 15px; font-weight: 600; margin-bottom: 18px; }
.pl-modal-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 20px; padding-top: 14px; border-top: 0.5px solid #ede9e2; }

@media (max-width: 768px) {
  .pl-summary-strip  { grid-template-columns: repeat(2, 1fr); }
  .pl-metrics-row    { grid-template-columns: repeat(2, 1fr); }
  .pl-project-metrics { grid-template-columns: repeat(2, 1fr); }
}

/* ── BIDDING APP ──────────────────────────────────────────────────────────── */

/* Status badges */
.bid-badge { display: inline-block; padding: 3px 9px; border-radius: 20px; font-size: 10px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; font-family: 'DM Mono', monospace; }
.bid-status-draft  { background: #f3f4f6; color: #6b7280; }
.bid-status-sent   { background: #eff6ff; color: #2563eb; }
.bid-status-won    { background: #f0fdf4; color: #16a34a; }
.bid-status-lost   { background: #fef2f2; color: #dc2626; }
.bid-entity-kink   { background: rgba(201,169,110,0.15); color: var(--accent); }
.bid-entity-umpa   { background: rgba(37,99,235,0.10); color: #2563eb; }

/* Entity toggle (index page) */
.bid-entity-toggle { display: flex; background: var(--offwhite); border: 1px solid var(--rule); border-radius: 4px; overflow: hidden; }
.bid-entity-btn { padding: 7px 14px; font-size: 12px; font-weight: 500; color: var(--mid); text-decoration: none; transition: all 0.15s; white-space: nowrap; }
.bid-entity-btn:hover { color: var(--black); background: #ece9e2; }
.bid-entity-btn.active { background: var(--black); color: #fff; }

/* Expiry pill */
.bid-expiry-pill { display: inline-block; font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 20px; margin-top: 3px; }
.bid-expiry-pill.warning { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }
.bid-expiry-pill.expired { background: #fef2f2; color: #dc2626; border: 1px solid #fca5a5; }

/* Notice variant */
.notice-bid-expiry { background: #fffbeb; border: 1px solid #fde68a; color: #92400e; padding: 12px 16px; border-radius: 4px; font-size: 13px; margin-bottom: 24px; }

/* Bid meta strip */
.bid-meta-strip { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; background: #fff; border: 1px solid var(--rule); border-radius: 6px; overflow: hidden; margin-bottom: 24px; }
.bid-meta-item { padding: 14px 16px; border-right: 1px solid var(--rule); }
.bid-meta-item:last-child { border-right: none; }
.bid-meta-label { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--mid); margin-bottom: 5px; }
.bid-meta-value { font-size: 13px; font-weight: 500; color: var(--black); line-height: 1.3; }

/* Cost type pills */
.ct-bid         { background: rgba(39,174,96,0.1);  color: #1e7e34; font-size: 10px; padding: 2px 8px; border-radius: 20px; font-weight: 600; white-space: nowrap; display: inline-block; }
.ct-allowance   { background: rgba(37,99,235,0.1);  color: #2563eb; font-size: 10px; padding: 2px 8px; border-radius: 20px; font-weight: 600; white-space: nowrap; display: inline-block; }
.ct-excluded    { background: rgba(220,38,38,0.1);  color: #dc2626; font-size: 10px; padding: 2px 8px; border-radius: 20px; font-weight: 600; white-space: nowrap; display: inline-block; }
.ct-contingency { background: rgba(217,119,6,0.1);  color: #d97706; font-size: 10px; padding: 2px 8px; border-radius: 20px; font-weight: 600; white-space: nowrap; display: inline-block; }
.ct-profit      { background: rgba(124,58,237,0.1); color: #7c3aed; font-size: 10px; padding: 2px 8px; border-radius: 20px; font-weight: 600; white-space: nowrap; display: inline-block; }

/* Line item table */
.bid-table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--rule); border-radius: 6px; overflow: hidden; font-size: 13px; }
.bid-table th { background: #faf9f7; color: var(--mid); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--rule); white-space: nowrap; }
.bid-table td { padding: 11px 12px; border-bottom: 1px solid var(--rule); vertical-align: middle; }
.bid-table tr.item-row:hover td { background: #faf9f7; }
.bid-table tfoot td { background: #faf9f7; border-top: 2px solid var(--rule); border-bottom: none; }

/* Bid list (index) mobile cards */
.bid-desktop-row { }
.bid-mobile-row  { display: none; }
.bid-card { padding: 16px; border-bottom: 1px solid var(--rule); }
.bid-card-top { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 6px; }
.bid-card-name { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.bid-card-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 12px; font-size: 13px; }

/* Bid modal */
.bid-modal-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 1000; align-items: center; justify-content: center; }
.bid-modal-overlay.open { display: flex; }
.bid-modal { background: #fff; border-radius: 8px; width: 100%; max-width: 640px; max-height: 92vh; overflow-y: auto; padding: 28px; box-shadow: 0 20px 60px rgba(0,0,0,.25); margin: 0 16px; }
.bid-modal-title { font-size: 15px; font-weight: 600; margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid var(--rule); }
.bid-modal-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--rule); }

/* Internal notes accordion */
.notes-item { border: 1px solid var(--rule); border-radius: 6px; overflow: hidden; background: #fff; }
.notes-item-header { padding: 14px 16px; display: flex; align-items: center; gap: 10px; cursor: pointer; transition: background 0.15s; user-select: none; }
.notes-item-header:hover { background: #faf9f7; }
.notes-item-num  { font-family: 'DM Mono', monospace; font-size: 11px; color: var(--mid); flex-shrink: 0; }
.notes-item-desc { font-size: 13px; font-weight: 500; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notes-item-toggle { font-size: 14px; color: var(--mid); flex-shrink: 0; transition: transform 0.2s; }
.notes-item-body { display: none; padding: 20px; border-top: 1px solid var(--rule); }
.notes-item-body.open { display: block; }
.notes-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.notes-field label { display: block; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--mid); margin-bottom: 6px; font-weight: 500; }
.notes-field textarea { width: 100%; background: var(--offwhite); border: 1px solid var(--rule); border-radius: 4px; padding: 9px 12px; font-size: 13px; font-family: inherit; resize: vertical; min-height: 80px; outline: none; transition: border-color 0.2s; line-height: 1.5; }
.notes-field textarea:focus { border-color: var(--accent); background: #fff; }
.notes-locked { background: #faf9f7; border-radius: 4px; padding: 12px 16px; font-size: 12px; color: var(--mid); font-style: italic; border: 1px solid var(--rule); }

/* New bid entity choice */
.bid-entity-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.entity-opt { display: block; border: 2px solid var(--rule); border-radius: 6px; padding: 14px 16px; cursor: pointer; transition: all 0.15s; }
.entity-opt input[type=radio] { display: none; }
.entity-opt:hover { border-color: #aaa; }
.entity-opt.active { border-color: var(--accent); background: rgba(201,169,110,0.06); }
.entity-opt-name { display: block; font-size: 14px; font-weight: 600; color: var(--black); margin-bottom: 3px; }
.entity-opt-sub  { display: block; font-size: 12px; color: var(--mid); }

/* Bid list table */
.bid-list-table { min-width: 700px; }

@media (max-width: 768px) {
  .bid-meta-strip { grid-template-columns: repeat(2, 1fr); }
  .bid-meta-item  { border-right: none; border-bottom: 1px solid var(--rule); }
  .bid-meta-item:nth-child(even)  { border-right: none; }
  .bid-desktop-row { display: none; }
  .bid-mobile-row  { display: table-row; }
  .notes-grid { grid-template-columns: 1fr; }
  .bid-entity-choice { grid-template-columns: 1fr; }
  .bid-modal { padding: 20px 16px; max-height: 96vh; }
}