.time-materials-page{
  --tm-bg:#070b10;
  --tm-surface:#0b121a;
  --tm-surface-2:#101923;
  --tm-border:#2d3b4b;
  --tm-border-soft:#213040;
  --tm-text:#f4f7fb;
  --tm-soft:#c5ced9;
  --tm-muted:#92a0b2;
  --tm-orange:#ff7a12;
  --tm-cyan:#22c7f2;
  --tm-purple:#a855f7;
  --tm-green:#31d17c;
  min-height:calc(100vh - 104px);
  background:var(--tm-bg);
  border:1px solid #182432;
  border-radius:10px;
  color:var(--tm-text);
  overflow:visible;
  font-family:Inter,"Segoe UI",Arial,sans-serif;
}
.time-materials-page *{box-sizing:border-box}
.time-materials-page button,.time-materials-page input,.time-materials-page select{font:inherit}
.time-materials-page svg{width:18px;height:18px;stroke-width:2}
.tm-page-header{
  position:relative!important;
  inset:auto!important;
  z-index:1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  padding:20px 24px!important;
  background:#080e15!important;
  border:0!important;
  border-bottom:1px solid var(--tm-border)!important;
  border-radius:10px 10px 0 0!important;
}
.tm-page-header>div:first-child{display:flex;align-items:center;gap:18px;min-width:0}
.tm-page-header>div:first-child>button{display:inline-flex;align-items:center;gap:7px;border:0;background:transparent;color:#a9c9e8;font-size:14px;font-weight:750;padding:6px 0;white-space:nowrap}
.tm-page-header>div:first-child>button:hover{color:var(--tm-orange)}
.tm-page-header h1{color:var(--tm-text)!important;font-size:27px!important;line-height:1.1!important;font-weight:760!important;margin:0!important;letter-spacing:-.02em}
.tm-header-actions{display:flex;align-items:center;gap:10px}
.tm-header-actions .btn,.tm-header-actions .primary{min-height:44px!important;padding:10px 17px!important;font-size:14px!important}
.tm-project-strip{display:grid;grid-template-columns:1fr 1.35fr 1fr auto;gap:12px;padding:14px 24px;background:#0a1119;border-bottom:1px solid var(--tm-border)}
.tm-project-strip>div{display:flex;align-items:center;gap:11px;min-width:0;padding:8px 12px;border-right:1px solid var(--tm-border-soft)}
.tm-project-strip>div>svg{flex:0 0 auto;color:var(--tm-cyan)}
.tm-project-strip>div:first-child>svg{color:var(--tm-purple)}
.tm-project-strip>div:nth-child(3)>svg{color:var(--tm-orange)}
.tm-project-strip span{display:grid;gap:3px;min-width:0}
.tm-project-strip small,.tm-project-strip span>small{color:var(--tm-muted)!important;font-size:12px!important;font-weight:650!important;text-transform:none!important;letter-spacing:0!important}
.tm-project-strip strong{color:var(--tm-text);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-project-strip>em{display:flex;align-items:center;gap:6px;color:var(--tm-green);font-size:13px;font-style:normal;font-weight:720;padding:0 6px;white-space:nowrap}
.tm-project-strip>em svg{width:16px;height:16px}
.tm-step-rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;padding:19px 28px;background:#080e15;border-bottom:1px solid var(--tm-border)}
.tm-step-rail button{position:relative;display:flex;align-items:center;gap:12px;border:0;background:transparent;color:var(--tm-muted);text-align:left;padding:0;min-width:0}
.tm-step-rail button:not(:last-child)::after{content:"";position:absolute;height:1px;background:#435064;left:calc(100% - 2px);width:30px;top:20px}
.tm-step-rail b{display:grid;place-items:center;flex:0 0 42px;height:42px;border:2px solid #667184;border-radius:50%;color:#dce3ec;font-size:17px}
.tm-step-rail span{display:grid;gap:3px;min-width:0}
.tm-step-rail strong{font-size:15px;color:#d3dae4;white-space:nowrap}
.tm-step-rail small{font-size:12px!important;color:var(--tm-muted)!important;text-transform:none!important;letter-spacing:0!important;font-weight:520!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm-step-rail button.active b{border-color:var(--tm-cyan);color:var(--tm-cyan);box-shadow:0 0 18px rgba(34,199,242,.16)}
.tm-step-rail button.active strong{color:var(--tm-cyan)}
.tm-step-rail button.complete b{border-color:var(--tm-green);color:var(--tm-green)}
.tm-step-rail button.complete strong{color:var(--tm-green)}
.tm-workspace{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px;padding:18px;background:#070b10;align-items:start}
.tm-workspace>main{min-width:0;background:transparent!important}
.tm-step-content{display:grid;gap:15px}
.tm-step-intro{display:flex;align-items:center;gap:14px;padding:17px 18px;background:var(--tm-surface);border:1px solid var(--tm-border);border-radius:9px}
.tm-step-intro>span{display:grid;place-items:center;flex:0 0 46px;height:46px;border:1px solid var(--tm-cyan);border-radius:9px;color:var(--tm-cyan);background:rgba(34,199,242,.07)}
.tm-step-intro>span.purple{border-color:var(--tm-purple);color:var(--tm-purple);background:rgba(168,85,247,.07)}
.tm-step-intro>span.green{border-color:var(--tm-green);color:var(--tm-green);background:rgba(49,209,124,.07)}
.tm-step-intro>span svg{width:23px;height:23px}
.tm-step-intro div{display:grid;gap:3px}
.tm-step-intro small{color:var(--tm-orange)!important;font-size:12px!important;font-weight:780!important;text-transform:none!important;letter-spacing:0!important}
.tm-step-intro h2{color:var(--tm-text)!important;font-size:21px!important;line-height:1.2!important;margin:0!important;font-weight:760!important}
.tm-step-intro p{margin:0;color:var(--tm-soft);font-size:13px;line-height:1.45}
.tm-mode-choice{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tm-mode-choice button{display:flex;align-items:center;gap:12px;min-height:82px;padding:14px 16px;border:1px solid var(--tm-border);border-radius:9px;background:var(--tm-surface);color:var(--tm-soft);text-align:left}
.tm-mode-choice button:hover{border-color:rgba(255,122,18,.75)}
.tm-mode-choice button.active{border-color:var(--tm-cyan);box-shadow:0 0 0 1px rgba(34,199,242,.16),0 12px 28px rgba(0,0,0,.2)}
.tm-mode-choice button>svg{flex:0 0 auto;width:25px;height:25px;color:var(--tm-purple)}
.tm-mode-choice button.active>svg{color:var(--tm-cyan)}
.tm-mode-choice span{display:grid;gap:4px}
.tm-mode-choice strong{color:var(--tm-text);font-size:14px}
.tm-mode-choice small{color:var(--tm-muted)!important;font-size:12px!important;line-height:1.35!important;text-transform:none!important;letter-spacing:0!important;font-weight:520!important}
.tm-pricing-section{background:var(--tm-surface);border:1px solid var(--tm-border);border-radius:9px;overflow:hidden}
.tm-pricing-section>header{position:relative!important;inset:auto!important;z-index:0!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:11px!important;padding:13px 15px!important;background:var(--tm-surface-2)!important;border:0!important;border-bottom:1px solid var(--tm-border)!important}
.tm-pricing-section>header>span{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--tm-cyan);border-radius:8px;color:var(--tm-cyan)}
.tm-pricing-section.materials>header>span{border-color:var(--tm-purple);color:var(--tm-purple)}
.tm-pricing-section.equipment>header>span{border-color:var(--tm-green);color:var(--tm-green)}
.tm-pricing-section>header>div{display:grid;gap:2px}
.tm-pricing-section h3{color:var(--tm-text)!important;font-size:16px!important;line-height:1.2!important;margin:0!important}
.tm-pricing-section header p{color:var(--tm-muted);font-size:12px;margin:0}
.tm-lines{display:grid}
.tm-line{display:grid;grid-template-columns:30px minmax(170px,1.65fr) 72px 78px 118px 118px 70px 118px 34px;gap:8px;align-items:end;padding:12px 12px;border-bottom:1px solid var(--tm-border-soft)}
.tm-line:hover{background:#0d1620}
.tm-line-kind{display:grid;place-items:center;align-self:center;width:30px;height:30px;border-radius:50%;color:var(--tm-cyan);background:rgba(34,199,242,.08)}
.tm-line-kind.materials{color:var(--tm-purple);background:rgba(168,85,247,.08)}
.tm-line-kind.equipment{color:var(--tm-green);background:rgba(49,209,124,.08)}
.tm-line label{display:grid;gap:5px;min-width:0;text-transform:none!important}
.tm-line label>span,.tm-line-markup small,.tm-line-total small{color:var(--tm-muted)!important;font-size:10px!important;font-weight:700!important;text-transform:none!important;letter-spacing:0!important;white-space:nowrap}
.tm-line input,.tm-line select{width:100%;height:38px!important;min-height:38px!important;padding:8px 9px!important;border:1px solid #3a4b5e!important;border-radius:7px!important;background:#0a1119!important;color:var(--tm-text)!important;font-size:13px!important;box-shadow:none!important}
.tm-line input:focus,.tm-line select:focus{border-color:var(--tm-orange)!important;box-shadow:0 0 0 2px rgba(255,122,18,.14)!important;outline:none!important}
.tm-line-description small{display:block;color:var(--tm-muted)!important;font-size:10px!important;line-height:1.25!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-transform:none!important;letter-spacing:0!important;font-weight:500!important}
.tm-money-input{display:flex;align-items:center;height:38px;border:1px solid #3a4b5e;border-radius:7px;background:#0a1119;overflow:hidden}
.tm-money-input:focus-within{border-color:var(--tm-orange);box-shadow:0 0 0 2px rgba(255,122,18,.14)}
.tm-money-input b{padding-left:9px;color:var(--tm-orange);font-size:12px}
.tm-money-input input{border:0!important;background:transparent!important;padding-left:6px!important;box-shadow:none!important}
.tm-line-markup,.tm-line-total{display:grid;gap:6px;align-self:center;min-width:0}
.tm-line-markup strong{color:var(--tm-purple);font-size:13px}
.tm-line-total strong{color:var(--tm-text);font-size:13px;white-space:nowrap}
.tm-line-remove{display:grid;place-items:center;width:34px;height:38px;border:1px solid transparent;background:transparent;color:#ff6672;border-radius:7px}
.tm-line-remove:hover{border-color:#ff6672;background:rgba(255,77,77,.08)}
.tm-add-line{display:flex;align-items:center;gap:8px;margin:11px 12px;padding:10px 12px;border:1px dashed #44566b;border-radius:7px;background:transparent;color:var(--tm-cyan);font-size:13px;font-weight:720}
.tm-add-line:hover{border-color:var(--tm-orange);color:var(--tm-orange)}
.tm-step-actions{display:flex;justify-content:flex-end;gap:10px;padding:2px 0}
.tm-step-actions .btn,.tm-step-actions .primary{min-height:44px!important;padding:10px 17px!important}
.tm-summary{position:sticky;top:86px;display:grid;gap:8px;padding:14px;background:var(--tm-surface);border:1px solid var(--tm-border);border-radius:9px;box-shadow:0 18px 36px rgba(0,0,0,.24)}
.tm-summary>header{position:relative!important;inset:auto!important;z-index:0!important;display:flex!important;align-items:center!important;justify-content:space-between!important;padding:0 0 11px!important;background:transparent!important;border:0!important;border-bottom:1px solid var(--tm-border-soft)!important}
.tm-summary header div{display:grid;gap:2px}
.tm-summary header small{color:var(--tm-muted)!important;font-size:11px!important;text-transform:none!important;letter-spacing:0!important}
.tm-summary header h3{color:var(--tm-text)!important;font-size:18px!important;margin:0!important}
.tm-summary header>span{color:var(--tm-green);font-size:12px;font-weight:750}
.tm-summary-metric{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:center;padding:9px 10px;background:#101923;border:1px solid transparent;border-radius:8px}
.tm-summary-metric>svg{width:30px;height:30px;padding:6px;border:1px solid currentColor;border-radius:50%}
.tm-summary-metric span{display:flex;align-items:center;justify-content:space-between;gap:8px}
.tm-summary-metric small{color:var(--tm-soft)!important;font-size:12px!important;text-transform:none!important;letter-spacing:0!important;font-weight:650!important}
.tm-summary-metric strong{color:var(--tm-text);font-size:14px;white-space:nowrap}
.tm-summary-metric.cyan{color:var(--tm-cyan)}.tm-summary-metric.purple{color:var(--tm-purple)}.tm-summary-metric.blue{color:#48a9ff}.tm-summary-metric.orange{color:var(--tm-orange)}.tm-summary-metric.green{color:var(--tm-green)}
.tm-summary>hr{width:100%;height:1px;border:0;background:var(--tm-border-soft);margin:2px 0}
.tm-profit-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:8px 10px}
.tm-profit-row span{display:grid;gap:3px}
.tm-profit-row small{color:var(--tm-muted)!important;font-size:11px!important;text-transform:none!important;letter-spacing:0!important}
.tm-profit-row strong{color:var(--tm-green);font-size:16px}
.tm-summary-toggle,.tm-summary-input{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 10px;color:var(--tm-soft)!important;text-transform:none!important}
.tm-summary-toggle>span{display:flex;align-items:center;gap:7px}
.tm-summary-toggle strong,.tm-summary-input>span{color:var(--tm-soft);font-size:12px;text-transform:none}
.tm-summary-toggle small{color:var(--tm-muted)!important;font-size:11px!important;text-transform:none!important;letter-spacing:0!important}
.tm-summary-toggle input{width:36px;height:20px;accent-color:var(--tm-cyan)}
.tm-summary-input>div{display:flex;align-items:center;width:104px;height:34px;border:1px solid #3a4b5e;border-radius:7px;background:#0a1119;overflow:hidden}
.tm-summary-input>div:focus-within{border-color:var(--tm-orange);box-shadow:0 0 0 2px rgba(255,122,18,.14)}
.tm-summary-input input{width:100%;height:32px!important;min-height:32px!important;border:0!important;background:transparent!important;color:var(--tm-text)!important;text-align:right;padding:6px!important;font-size:12px!important;box-shadow:none!important}
.tm-summary-input b{padding:0 8px;color:var(--tm-orange);font-size:12px}
.tm-summary-deposit{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;border-top:1px solid var(--tm-border-soft);color:var(--tm-soft);font-size:12px}
.tm-summary-deposit strong{color:var(--tm-text);font-size:14px}
.tm-summary>footer{position:relative!important;inset:auto!important;z-index:0!important;display:grid!important;gap:9px!important;padding:12px 0 0!important;background:transparent!important;border:0!important;border-top:1px solid var(--tm-border)!important}
.tm-summary footer>span{display:flex;align-items:end;justify-content:space-between;gap:10px}
.tm-summary footer small{color:var(--tm-soft)!important;font-size:12px!important;text-transform:none!important;letter-spacing:0!important}
.tm-summary footer>span>strong{color:var(--tm-text);font-size:23px;line-height:1}
.tm-summary footer .primary{width:100%;min-height:45px!important;background:var(--tm-orange)!important;border-color:var(--tm-orange)!important;color:#111318!important;font-size:13px!important}
.tm-save-exit{display:flex;align-items:center;justify-content:center;gap:7px;border:0;background:transparent;color:#8fbee9;font-size:12px;font-weight:720;padding:6px}
.tm-review-groups{display:grid;gap:11px}
.tm-review-group{background:var(--tm-surface);border:1px solid var(--tm-border);border-radius:9px;overflow:hidden}
.tm-review-group>header{position:relative!important;inset:auto!important;z-index:0!important;display:flex!important;align-items:center!important;justify-content:space-between!important;padding:12px 14px!important;background:var(--tm-surface-2)!important;border:0!important;border-bottom:1px solid var(--tm-border)!important}
.tm-review-group header h3{color:var(--tm-text)!important;font-size:15px!important;margin:0!important}
.tm-review-group header strong{color:var(--tm-cyan);font-size:16px}.tm-review-group.purple header strong{color:var(--tm-purple)}.tm-review-group.green header strong{color:var(--tm-green)}
.tm-review-group>div{display:grid;grid-template-columns:minmax(0,1fr) auto 120px;gap:12px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--tm-border-soft)}
.tm-review-group>div:last-child{border-bottom:0}
.tm-review-group>div>span{color:var(--tm-soft);font-size:13px}.tm-review-group>div>small{color:var(--tm-muted);font-size:11px}.tm-review-group>div>b{color:var(--tm-text);font-size:13px;text-align:right}
.tm-review-note,.tm-internal-note{display:flex;align-items:center;gap:10px;border:1px solid #31506c;border-radius:8px;background:#0b141d;color:#99c8ee;padding:12px 14px}
.tm-review-note span,.tm-internal-note span{display:grid;gap:3px}
.tm-review-note strong,.tm-internal-note strong{color:var(--tm-text);font-size:13px}
.tm-review-note small,.tm-internal-note small{color:var(--tm-muted)!important;font-size:11px!important;text-transform:none!important;letter-spacing:0!important;font-weight:520!important}
.tm-internal-note{margin:0 18px 18px}
@media(max-width:1320px){
  .tm-workspace{grid-template-columns:minmax(0,1fr) 292px}
  .tm-line{grid-template-columns:28px minmax(150px,1.5fr) 62px 70px 102px 102px 62px 104px 32px;gap:6px}
}
@media(max-width:1120px){
  .tm-workspace{grid-template-columns:1fr}
  .tm-summary{position:relative;top:auto;grid-template-columns:repeat(2,minmax(0,1fr))}
  .tm-summary>header,.tm-summary>hr,.tm-summary>footer,.tm-profit-row,.tm-summary-deposit{grid-column:1/-1}
  .tm-line{grid-template-columns:28px minmax(190px,1fr) 70px 74px 110px 110px 70px 110px 32px;overflow-x:auto}
}
@media(max-width:820px){
  .tm-page-header{align-items:flex-start!important;display:grid!important}
  .tm-page-header>div:first-child{display:grid}
  .tm-header-actions{width:100%}.tm-header-actions>*{flex:1}
  .tm-project-strip{grid-template-columns:1fr}.tm-project-strip>div{border-right:0;border-bottom:1px solid var(--tm-border-soft)}
  .tm-step-rail{gap:8px;padding:14px}.tm-step-rail button{display:grid;justify-items:center;text-align:center}.tm-step-rail button:not(:last-child)::after{display:none}.tm-step-rail small{display:none}
  .tm-mode-choice{grid-template-columns:1fr}
  .tm-line{grid-template-columns:28px minmax(180px,1fr) 66px 72px 105px 105px 66px 105px 32px;min-width:940px}
  .tm-lines{overflow-x:auto}
  .tm-summary{grid-template-columns:1fr}
  .tm-summary>*{grid-column:1!important}
  .tm-review-group>div{grid-template-columns:1fr auto}.tm-review-group>div>small{grid-column:1/-1}
}