.titletrack-header-link {
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .12em;
}

.strava-login-main {
  min-height: 710px;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  background: #f4f3ee;
}

.strava-login-copy {
  padding: clamp(55px, 8vw, 100px) clamp(28px, 7vw, 82px);
  border-right: 1px solid #050505;
}

.strava-login-copy h1 {
  margin: 8px 0 28px;
  font-family: var(--display);
  font-size: clamp(5.2rem, 10vw, 9rem);
  line-height: .82;
  letter-spacing: -.015em;
  text-transform: uppercase;
}

.strava-login-copy > p:not(.eyebrow):not(.strava-setup-note) {
  max-width: 570px;
  font-family: var(--editorial);
  font-size: 1.35rem;
  line-height: 1.45;
}

.strava-connect-button {
  width: min(100%, 390px);
  min-height: 67px;
  margin: 26px 0 19px;
  padding: 17px 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  border: 1px solid #050505;
  background: #fc4c02;
  color: #fff;
  font-weight: 950;
  letter-spacing: .06em;
  text-decoration: none;
  text-transform: uppercase;
  box-shadow: 5px 5px 0 #050505;
}

.strava-connect-button:hover,
.strava-connect-button:focus-visible { transform: translate(2px, 2px); box-shadow: 3px 3px 0 #050505; }
.strava-connect-button:disabled { background: #a9aaa5; cursor: not-allowed; box-shadow: none; }
.strava-login-copy > small { display: block; max-width: 590px; color: #62635f; line-height: 1.55; }
.strava-setup-note { max-width: 560px; padding: 12px 14px; border-left: 4px solid var(--green); background: #e5e4df; font-size: .83rem; line-height: 1.5; }

.strava-login-preview {
  padding: clamp(50px, 7vw, 82px) clamp(26px, 5vw, 55px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #263b31;
  color: #fff;
}

.strava-login-preview > p:first-child { color: #8eb5b7; font-size: .68rem; font-weight: 900; letter-spacing: .16em; }
.strava-login-preview article { margin-top: 16px; padding: clamp(25px, 4vw, 42px); border: 1px solid #75847c; border-radius: 12px; background: #30483b; }
.strava-login-preview h2 { margin: 25px 0 38px; font-family: var(--editorial); font-size: clamp(2.2rem, 5vw, 4.1rem); font-weight: 400; line-height: 1.02; }
.strava-login-preview dl { margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); }
.strava-login-preview dl div { padding-left: 15px; border-left: 1px solid #607369; }
.strava-login-preview dl div:first-child { padding-left: 0; border-left: 0; }
.strava-login-preview dt { color: #8ca49a; font-size: .58rem; font-weight: 850; letter-spacing: .09em; }
.strava-login-preview dd { margin: 6px 0 0; font-weight: 850; }
.strava-login-footnote { margin-top: 20px; color: #a7b5ae; font-size: .67rem; }

.tt-app-shell {
  --tt-paper: #f7f5ee;
  --tt-card: #fffdf7;
  --tt-ink: #252a26;
  --tt-muted: #747870;
  --tt-line: #d8d5ca;
  --tt-green: #416d70;
  --tt-green-dark: #263b3d;
  --tt-accent: #538083;
  min-height: 850px;
  display: grid;
  grid-template-columns: 218px minmax(0, 1fr);
  background: var(--tt-paper);
  color: var(--tt-ink);
}

.tt-sidebar {
  min-width: 0;
  padding: 34px 20px 24px;
  display: flex;
  flex-direction: column;
  background: var(--tt-green-dark);
  color: #eef1eb;
}

.tt-sidebar nav { display: grid; gap: 7px; }
.tt-nav-item { padding: 12px 13px; display: flex; align-items: center; gap: 11px; border-radius: 6px; color: #c6d0ca; font-size: .77rem; font-weight: 780; text-decoration: none; }
.tt-nav-item:hover, .tt-nav-item:focus-visible, .tt-nav-item.active { background: #385357; color: white; }
.tt-nav-icon { width: 20px; height: 20px; display: grid; place-items: center; color: #8fb5b7; font-size: 1rem; }
.tt-athlete-card { margin-top: auto; padding: 14px 10px; display: flex; gap: 10px; align-items: center; border-top: 1px solid #536567; }
.tt-athlete-card img, .tt-athlete-card > span { width: 34px; height: 34px; flex: 0 0 auto; border-radius: 50%; object-fit: cover; display: grid; place-items: center; background: var(--tt-accent); color: #071213; font-weight: 900; }
.tt-athlete-card strong, .tt-athlete-card small { display: block; }
.tt-athlete-card strong { overflow: hidden; text-overflow: ellipsis; font-size: .72rem; white-space: nowrap; }
.tt-athlete-card small { margin-top: 3px; color: #91a3a3; font-size: .53rem; letter-spacing: .09em; }
.tt-disconnect-button { width: 100%; padding: 9px; border: 1px solid #647576; border-radius: 5px; background: transparent; color: #b7c4c3; font-size: .61rem; cursor: pointer; }
.tt-disconnect-button:hover { border-color: #fff; color: #fff; }

.tt-content { min-width: 0; padding: 54px clamp(25px, 4vw, 58px) 70px; }
.tt-topbar { max-width: 1160px; margin: 0 auto 33px; display: flex; align-items: end; justify-content: space-between; gap: 28px; }
.tt-eyebrow { margin: 0 0 10px; color: var(--tt-accent); font-size: .64rem; font-weight: 900; letter-spacing: .17em; }
.tt-topbar h1 { margin: 0; font-family: var(--editorial); font-size: clamp(3rem, 5.4vw, 5.4rem); font-weight: 400; line-height: .95; letter-spacing: -.035em; }
.tt-intro { max-width: 750px; margin: 16px 0 0; color: var(--tt-muted); font-size: .78rem; line-height: 1.65; }
.tt-primary-button { padding: 13px 16px; border: 1px solid var(--tt-green-dark); border-radius: 6px; background: var(--tt-green-dark); color: white; font-size: .7rem; font-weight: 850; text-decoration: none; white-space: nowrap; }
.tt-primary-button:hover, .tt-primary-button:focus-visible { background: var(--tt-accent); color: #071213; }

.tt-automation-switcher { max-width: 1160px; margin: 0 auto 13px; overflow-x: auto; }
.tt-automation-tabs { width: max-content; min-width: 100%; display: flex; gap: 7px; }
.tt-automation-tab { min-width: 180px; padding: 11px 13px; display: flex; align-items: center; gap: 9px; border: 1px solid var(--tt-line); border-radius: 7px 7px 0 0; background: #ebe9e1; color: inherit; text-decoration: none; }
.tt-automation-tab.active { border-bottom-color: var(--tt-card); background: var(--tt-card); }
.tt-automation-tab > span:last-child { min-width: 0; }
.tt-automation-tab strong, .tt-automation-tab small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tt-automation-tab strong { font-size: .72rem; }
.tt-automation-tab small { margin-top: 3px; color: #979a93; font-size: .52rem; text-transform: uppercase; }
.tt-automation-status { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: #4b8e68; }
.tt-automation-status.off { background: #a2a49e; }

.tt-workspace { max-width: 1160px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.22fr) minmax(330px, .78fr); border: 1px solid var(--tt-line); border-radius: 0 11px 11px 11px; background: var(--tt-card); overflow: hidden; }
.tt-rule-panel { min-width: 0; padding: clamp(25px, 3vw, 40px); }
.tt-rule-name-row { margin-bottom: 33px; display: flex; align-items: end; gap: 15px; }
.tt-rule-name-field { flex: 1; }
.tt-rule-name-field span, .tt-field-label { display: block; margin-bottom: 7px; color: #8d9089; font-size: .56rem; font-weight: 900; letter-spacing: .13em; }
.tt-rule-name-field input, .tt-rule-panel textarea, .tt-rule-panel select, .tt-rule-panel input[type="text"], .tt-rule-panel input[type="number"], .tt-preview-panel select { width: 100%; min-height: 42px; padding: 10px 11px; border: 1px solid #cbc9bf; border-radius: 5px; background: #fff; color: var(--tt-ink); font-size: .72rem; }
.tt-rule-name-field input { font-family: var(--editorial); font-size: 1.2rem; }
.tt-rule-panel textarea { resize: vertical; line-height: 1.55; }
.tt-delete-automation { padding: 10px 6px; color: #9e563f; font-size: .66rem; text-underline-offset: 4px; }
.tt-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.tt-section-heading > div, .tt-preview-heading > div { display: flex; align-items: center; gap: 11px; }
.tt-section-heading h2, .tt-preview-heading h2 { margin: 0; font-family: var(--editorial); font-size: 1.7rem; font-weight: 400; }
.tt-section-heading.compact { justify-content: flex-start; }
.tt-step { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #d8e3e1; color: var(--tt-green); font-size: .58rem; font-weight: 900; }
.tt-enabled { display: flex; align-items: center; gap: 7px; color: var(--tt-green); font-size: .65rem; font-weight: 850; cursor: pointer; }
.tt-enabled input { position: absolute; opacity: 0; }
.tt-enabled i { width: 31px; height: 17px; position: relative; border-radius: 20px; background: var(--tt-accent); }
.tt-enabled i::after { content: ""; width: 11px; height: 11px; position: absolute; right: 3px; top: 3px; border-radius: 50%; background: white; }
.tt-enabled input:not(:checked) + i { background: #b8bbb4; }
.tt-enabled input:not(:checked) + i::after { right: 17px; }
.tt-match-mode { margin: 22px 0 13px; display: flex; align-items: center; gap: 9px; color: #8c9088; font-size: .67rem; }
.tt-match-mode select { width: auto; min-height: 34px; padding-block: 6px; }
.tt-conditions-list { display: grid; gap: 8px; }
.tt-logic-row { display: grid; grid-template-columns: 34px minmax(120px, 1.25fr) minmax(115px, 1fr) minmax(105px, .9fr) 31px; align-items: center; gap: 7px; }
.tt-logic-row select, .tt-logic-row input { min-width: 0; }
.tt-if-label { color: var(--tt-accent); font-size: .57rem; font-weight: 900; letter-spacing: .08em; }
.tt-condition-value { min-width: 0; }
.tt-icon-button { width: 31px; height: 31px; border: 0; border-radius: 50%; background: #ebeae4; color: #747870; cursor: pointer; }
.tt-icon-button:disabled { opacity: .35; cursor: not-allowed; }
.tt-text-button { margin: 12px 0 0 41px; padding: 5px 0; border: 0; background: transparent; color: var(--tt-green); font-size: .65rem; font-weight: 850; cursor: pointer; }
.tt-text-button:disabled { color: #aaa; }
.tt-divider { height: 1px; margin: 30px 0; background: #e1dfd6; }
.tt-template-meta { margin-top: 7px; display: flex; justify-content: space-between; gap: 15px; color: #9a9d96; font-size: .55rem; line-height: 1.4; }
.tt-template-meta code { color: var(--tt-green); }
.tt-token-target { margin-top: 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #8d9089; font-size: .53rem; font-weight: 900; letter-spacing: .1em; }
.tt-token-target > div { display: flex; }
.tt-token-target button { padding: 6px 10px; border: 1px solid #cbc9bf; background: white; color: #767a73; font-size: .57rem; cursor: pointer; }
.tt-token-target button:first-child { border-radius: 5px 0 0 5px; }
.tt-token-target button:last-child { border-left: 0; border-radius: 0 5px 5px 0; }
.tt-token-target button.active { background: var(--tt-green-dark); color: white; }
.tt-token-groups { margin-top: 15px; display: grid; gap: 13px; }
.tt-token-group > span { color: #93968f; font-size: .51rem; font-weight: 900; letter-spacing: .12em; }
.tt-token-row { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 5px; }
.tt-token-row button { padding: 5px 7px; border: 1px solid #d9d7ce; border-radius: 4px; background: #f1f0e9; color: #527477; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .53rem; cursor: pointer; }
.tt-token-row button:hover { border-color: var(--tt-accent); background: #e5eded; }
.tt-action-intro { margin: 13px 0 15px; color: var(--tt-muted); font-size: .65rem; line-height: 1.55; }
.tt-actions-list { display: grid; gap: 7px; }
.tt-action-row { min-height: 55px; padding: 10px 12px; display: grid; grid-template-columns: 20px minmax(0, 1fr) minmax(100px, 145px); gap: 10px; align-items: center; border: 1px solid #dddacf; border-radius: 6px; cursor: pointer; }
.tt-action-row input[type="checkbox"] { width: 17px; height: 17px; accent-color: var(--tt-accent); }
.tt-action-row strong, .tt-action-row small { display: block; }
.tt-action-row strong { font-size: .65rem; }
.tt-action-row small { margin-top: 3px; color: #90938c; font-size: .52rem; line-height: 1.35; }
.tt-action-row select { min-height: 34px; padding: 6px; }
.tt-save-button { width: 100%; min-height: 58px; margin-top: 30px; border: 1px solid var(--tt-green-dark); border-radius: 5px; background: var(--tt-green-dark); color: white; font-size: .68rem; font-weight: 900; letter-spacing: .09em; cursor: pointer; }
.tt-save-button:hover { background: var(--tt-accent); color: #071213; }

.tt-preview-panel { min-width: 0; padding: clamp(25px, 3vw, 38px); border-left: 1px solid var(--tt-line); background: #f0eee6; }
.tt-preview-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.tt-match-pill { padding: 6px 8px; border-radius: 20px; background: #d9eadc; color: #2e684e; font-size: .5rem; font-weight: 900; letter-spacing: .09em; white-space: nowrap; }
.tt-match-pill.no-match { background: #edddd7; color: #8b432c; }
.tt-preview-panel > .tt-field-label { margin-top: 27px; }
.tt-activity-card { margin-top: 16px; padding: 26px; border-radius: 9px; background: var(--tt-green-dark); color: #fff; }
.tt-activity-original { margin: 0; color: #87a4a4; font-size: .52rem; font-weight: 900; letter-spacing: .1em; }
.tt-activity-card h3 { margin: 24px 0 14px; font-family: var(--editorial); font-size: clamp(2.1rem, 3.4vw, 3.5rem); font-weight: 400; line-height: 1.02; }
.tt-description-preview { margin: 0 0 25px; padding-top: 14px; border-top: 1px solid #4d6365; color: #c9d4d2; font-size: .64rem; line-height: 1.55; white-space: pre-line; }
.tt-description-preview.empty { color: #819493; font-style: italic; }
.tt-activity-card dl { margin: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 17px 0; }
.tt-activity-card dl div { padding-left: 13px; border-left: 1px solid #506668; }
.tt-activity-card dl div:nth-child(odd) { padding-left: 0; border-left: 0; }
.tt-activity-card dt { color: #82999a; font-size: .5rem; font-weight: 900; letter-spacing: .08em; }
.tt-activity-card dd { margin: 5px 0 0; font-size: .68rem; font-weight: 800; }
.tt-how-it-runs { margin-top: 20px; padding: 22px; border: 1px solid #d5d2c7; border-radius: 8px; background: var(--tt-card); }
.tt-how-it-runs ol { margin: 15px 0; padding: 0; display: grid; gap: 12px; list-style: none; }
.tt-how-it-runs li { display: flex; align-items: center; gap: 9px; color: #4f554f; font-size: .61rem; }
.tt-how-it-runs li span { width: 21px; height: 21px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: #dce7e5; color: var(--tt-green); font-size: .51rem; font-weight: 900; }
.tt-how-it-runs > p:last-child { margin: 0; color: #90938c; font-size: .55rem; line-height: 1.55; }

@media (max-width: 1000px) {
  .tt-app-shell { grid-template-columns: 1fr; }
  .tt-sidebar { padding: 13px 18px; flex-direction: row; align-items: center; overflow-x: auto; }
  .tt-sidebar nav { display: flex; }
  .tt-nav-item { white-space: nowrap; }
  .tt-athlete-card { margin: 0 0 0 auto; padding: 0 12px; border: 0; }
  .tt-disconnect-button { width: auto; white-space: nowrap; }
  .tt-workspace { grid-template-columns: 1fr; }
  .tt-preview-panel { border-left: 0; border-top: 1px solid var(--tt-line); }
}

@media (max-width: 760px) {
  .strava-login-main { grid-template-columns: 1fr; }
  .strava-login-copy { border-right: 0; border-bottom: 1px solid #050505; }
  .strava-login-copy h1 { font-size: clamp(4.6rem, 20vw, 7rem); }
  .strava-login-preview { min-height: 520px; }
  .tt-content { padding: 34px 14px 48px; }
  .tt-topbar { align-items: flex-start; flex-direction: column; }
  .tt-new-automation-button { align-self: stretch; text-align: center; }
  .tt-rule-panel, .tt-preview-panel { padding: 22px 17px; }
  .tt-logic-row { grid-template-columns: 27px 1fr 32px; }
  .tt-logic-row > select, .tt-condition-value { grid-column: 2; }
  .tt-logic-row .tt-icon-button { grid-column: 3; grid-row: 1; }
  .tt-text-button { margin-left: 33px; }
  .tt-action-row { grid-template-columns: 20px minmax(0, 1fr); }
  .tt-action-row select { grid-column: 2; }
  .tt-sidebar { padding: 9px; }
  .tt-nav-item { padding: 9px; font-size: .65rem; }
  .tt-nav-item:nth-child(n+3), .tt-athlete-card, .tt-disconnect-button { display: none; }
}