/* Focus Timer mission layer. It is intentionally isolated from the regular timer. */
.focus-overlay.focus-mission-mode {
  --mission-accent: #a855f7;
  --mission-success: #22c55e;
  --mission-warning: #f59e0b;
}

.focus-mission-badge {
  position: absolute;
  top: 24px;
  left: 34px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
  padding: 3px 10px;
  border: 1px solid rgba(168, 85, 247, 0.4);
  border-radius: 99px;
  background: rgba(88, 28, 135, 0.2);
  color: #d8b4fe;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.focus-mission-badge svg {
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
}

.review-recovery-active .recovery-active-badge {
  margin-left: auto;
  padding: 3px 7px;
  border: 1px solid rgba(168, 85, 247, .34);
  border-radius: 99px;
  color: #d8b4fe;
  font-size: 10px;
  font-weight: 550;
}

.focus-mission-shell {
  position: absolute;
  inset: 70px 34px 32px;
  display: grid;
  grid-template-columns: minmax(270px, 430px) minmax(500px, 0.9fr) minmax(270px, 430px);
  gap: 28px;
  pointer-events: none;
  justify-content: center;
}

.focus-mission-shell > *,
.focus-mission-top {
  pointer-events: auto;
}

.focus-mission-top {
  position: absolute;
  inset: 18px 92px auto 92px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: rgba(203, 213, 225, 0.72);
  font-size: 12px;
  font-weight: 500;
}

.focus-mission-top span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.focus-mission-top span i {
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border: 1px solid rgba(100, 116, 139, .4);
  border-radius: 50%;
  color: #64748b;
  font-style: normal;
  font-size: 11px;
}

.focus-mission-top > b {
  width: clamp(26px, 4vw, 68px);
  border-top: 1px dashed rgba(100, 116, 139, .38);
}

.focus-mission-top .done { color: var(--mission-success); }
.focus-mission-top .active { color: #d8b4fe; }
.focus-mission-top .done i {
  border-color: rgba(34, 197, 94, .42);
  background: rgba(22, 101, 52, .2);
  color: #4ade80;
}
.focus-mission-top .active i {
  border-color: rgba(192, 132, 252, .76);
  background: linear-gradient(145deg, #7c3aed, #9333ea);
  color: #fff;
  box-shadow: 0 0 22px rgba(139, 92, 246, .48);
}

.focus-mission-top.mission-active,
.focus-mission-top.summary-active {
  inset: 18px auto auto 50%;
  width: min(650px, calc(100vw - 430px));
  gap: 14px;
  transform: translateX(-50%);
}

.focus-mission-top.mission-active span,
.focus-mission-top.summary-active span {
  gap: 9px;
  font-size: 14px;
}

.focus-mission-top.mission-active span i,
.focus-mission-top.summary-active span i {
  width: 34px;
  height: 34px;
  font-size: 13px;
}

.focus-mission-top.mission-active > b,
.focus-mission-top.summary-active > b {
  width: clamp(34px, 4vw, 64px);
}

.focus-mission-top.mission-active > b:nth-of-type(1) {
  border-color: rgba(34, 197, 94, .52);
}

.focus-mission-top.mission-active > b:nth-of-type(2) {
  border-image: linear-gradient(90deg, rgba(34,197,94,.5), rgba(168,85,247,.62)) 1;
}

.focus-mission-top.mission-active .active {
  position: relative;
  color: #f8fafc;
}

.focus-mission-top.summary-active > b:nth-of-type(1),
.focus-mission-top.summary-active > b:nth-of-type(2) {
  border-color: rgba(34, 197, 94, .52);
}

.focus-mission-top.summary-active > b:nth-of-type(3) {
  border-image: linear-gradient(90deg, rgba(34,197,94,.5), rgba(168,85,247,.62)) 1;
}

.focus-mission-top.summary-active .active {
  color: #f8fafc;
}


.focus-mission-column {
  display: flex;
  min-height: 0;
  flex-direction: column;
  gap: 12px;
  padding-top: 150px;
}

.focus-mission-panel {
  border: 1px solid rgba(139, 92, 246, 0.22);
  border-radius: 9px;
  background: rgba(5, 7, 18, 0.65);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
  padding: 17px;
}

.focus-mission-panel h3,
.focus-mission-panel h4,
.focus-mission-panel p { margin: 0; }
.focus-mission-panel h3,
.focus-mission-panel h4 { color: #f8fafc; font-size: 14px; font-weight: 560; }
.focus-mission-panel p { color: #94a3b8; font-size: 14px; line-height: 1.5; }

.focus-mission-review-head,
.focus-mission-next-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.focus-mission-progress {
  position: absolute;
  top: 91px;
  left: 50%;
  z-index: 3;
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  gap: 8px;
  width: min(190px, calc(100vw - 560px));
  color: #cbd5e1;
  font-size: 13px;
  transform: translateX(-50%);
}

.focus-mission-progress > span {
  white-space: nowrap;
}

.focus-mission-progress > span strong {
  font-size: inherit;
  font-weight: 600;
}

.focus-mission-segments {
  display: grid;
  grid-template-columns: repeat(var(--mission-total, 1), minmax(8px, 1fr));
  gap: 4px;
}
.focus-mission-segments i { height: 3px; border-radius: 99px; background: rgba(71, 85, 105, 0.5); }
.focus-mission-segments i.completed { background: #22c55e; box-shadow: 0 0 10px rgba(34, 197, 94, 0.35); }
.focus-mission-segments i.current { background: #a855f7; box-shadow: 0 0 10px rgba(168, 85, 247, 0.45); }
.focus-mission-segments i.skipped { background: rgba(245, 158, 11, 0.66); }

.focus-mission-current-card { padding: 0; overflow: hidden; }
.focus-mission-current { padding: 18px 18px 15px; }
.focus-mission-current h4 { margin-top: 10px; font-size: 18px; font-weight: 520; line-height: 1.25; }
.focus-mission-path { margin-top: 5px !important; }
.focus-mission-review-title { display: flex; align-items: center; gap: 12px; margin-top: 20px; }
.focus-mission-review-title > span { display: grid; place-items: center; flex: 0 0 46px; width: 46px; height: 46px; border: 1px solid rgba(168,85,247,.3); border-radius: 50%; background: rgba(88,28,135,.18); color: #c084fc; box-shadow: inset 0 0 18px rgba(168,85,247,.06); }
.focus-mission-review-title svg { width: 23px; height: 23px; }
.focus-mission-review-title h4 { margin-top: 0; }
.focus-mission-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 15px; }
.focus-mission-meta span { display: inline-flex; align-items: center; min-height: 26px; padding: 3px 10px; border: 1px solid rgba(139,92,246,.25); border-radius: 99px; color: #d8b4fe; font-size: 12px; font-weight: 530; }
.focus-mission-meta .critical { color: #fb7185; border-color: rgba(251, 113, 133, .42); }
.focus-mission-meta .high { color: #fb923c; border-color: rgba(251, 146, 60, .42); }
.focus-mission-meta .medium { color: #fde047; border-color: rgba(253, 224, 71, .34); }
.focus-mission-meta .low { color: #22d3ee; border-color: rgba(34, 211, 238, .34); }
.focus-mission-meta .focus-mission-review-type.daily { color: #22d3ee; border-color: rgba(6, 182, 212, .34); }
.focus-mission-meta .focus-mission-review-type.semanal { color: #c4b5fd; border-color: rgba(139, 92, 246, .34); }
.focus-mission-meta .focus-mission-review-type.mensal { color: #fbbf24; border-color: rgba(245, 158, 11, .38); }
.focus-mission-meta .focus-mission-review-type.livre { color: #4ade80; border-color: rgba(34, 197, 94, .34); }

.focus-mission-review-head small,
.focus-mission-next-head small { color: #c4b5fd; font-size: 13px; font-weight: 600; text-transform: uppercase; }
.focus-mission-review-head > span,
.focus-mission-next-head > span { font-size: 14px; font-weight: 600; }
.focus-mission-review-head > span.critical,
.focus-mission-next-head > span.critical { color: #fb7185; }
.focus-mission-review-head > span.high,
.focus-mission-next-head > span.high { color: #fb923c; }
.focus-mission-review-head > span.medium,
.focus-mission-next-head > span.medium { color: #fde047; }
.focus-mission-review-head > span.low,
.focus-mission-next-head > span.low { color: #22d3ee; }
.focus-mission-impact { margin-top: 13px !important; }
.focus-mission-impact strong { font-weight: 550; }
.focus-mission-impact strong.critical { color: #fb7185; }
.focus-mission-impact strong.high { color: #fb923c; }
.focus-mission-impact strong.medium { color: #fde047; }
.focus-mission-impact strong.low { color: #22d3ee; }

.focus-mission-reasons {
  margin: 0 12px 12px;
  border: 1px solid rgba(139, 92, 246, .24);
  border-radius: 8px;
  background: rgba(7, 10, 19, .62);
  box-shadow: 0 0 22px rgba(76, 29, 149, .08), inset 0 1px 0 rgba(255,255,255,.02);
}
.focus-mission-reasons summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 11px 14px; color: #f8fafc; cursor: pointer; list-style: none; }
.focus-mission-reasons summary::-webkit-details-marker { display: none; }
.focus-mission-reasons summary strong { font-size: 14px; font-weight: 400; }
.focus-mission-reasons summary > span { width: 8px; height: 8px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); transition: transform 180ms ease; }
.focus-mission-reasons[open] summary > span { transform: rotate(45deg); }
.focus-mission-reasons[open] .focus-mission-reasons-body,
.focus-mission-reasons[open] .focus-mission-learn {
  animation: focus-mission-reasons-reveal 220ms ease-out both;
}
.focus-mission-reasons-body { padding: 0 14px 12px; }
.focus-mission-reasons-body > p { margin: 0; color: #a8b3c4; font-size: 13px; }
.focus-mission-factors { display: grid; gap: 10px; margin: 13px 0 0; padding: 0; list-style: none; }
.focus-mission-factors li { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 10px; color: #cbd5e1; }
.focus-mission-factors li > span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: color-mix(in srgb, currentColor, transparent 88%); box-shadow: 0 0 13px color-mix(in srgb, currentColor, transparent 78%); }
.focus-mission-factors li svg { width: 20px; height: 20px; }
.focus-mission-factors li p { color: #cbd5e1; font-size: 13px; font-weight: 350; line-height: 1.45; }
.focus-mission-factors li.factor-danger { color: #fb7185; }
.focus-mission-factors li.factor-purple { color: #c084fc; }
.focus-mission-factors li.factor-green { color: #4ade80; }
.focus-mission-factors li.factor-amber { color: #f59e0b; }
.focus-mission-factors li.factor-cyan { color: #22d3ee; }
.focus-mission-learn { display: grid; grid-template-columns: 24px 1fr auto; align-items: center; gap: 9px; width: calc(100% - 28px); min-height: 48px; margin: 0 14px; padding: 0 7px 0 0; border: 0; border-top: 1px solid rgba(139,92,246,.16); background: transparent; color: #e2e8f0; font-size: 13px; font-weight: 450; text-align: left; cursor: pointer; transition: background-color 180ms ease, color 180ms ease; }
.focus-mission-learn:hover { background: rgba(255, 255, 255, .035); color: #f8fafc; }
.focus-mission-learn span { display: grid; place-items: center; }
.focus-mission-learn svg { width: 20px; height: 20px; }
.focus-mission-learn-arrow { color: #c4b5fd; font-size: 22px; font-style: normal; line-height: 1; transition: transform 180ms ease; }
.focus-mission-learn:hover .focus-mission-learn-arrow { transform: translateX(2px); }

@keyframes focus-mission-reasons-reveal {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

.focus-mission-iur-backdrop {
  position: absolute;
  inset: 0;
  z-index: 12;
  background: rgba(3, 5, 13, .54);
  backdrop-filter: blur(3px);
  animation: focus-mission-iur-backdrop-in 220ms ease-out both;
}
.focus-mission-iur-drawer {
  position: absolute;
  top: 75px;
  bottom: 75px;
  left: 50px;
  display: flex;
  width: min(500px, calc(100vw - 36px));
  flex-direction: column;
  border: 1px solid rgba(139, 92, 246, .3);
  border-radius: 10px;
  background: rgba(7, 10, 19, .97);
  box-shadow: 20px 0 60px rgba(0, 0, 0, .42), 8px 0 30px rgba(88, 28, 135, .1);
  overflow: hidden;
  animation: focus-mission-iur-drawer-in 230ms ease-out both;
}
.focus-mission-iur-drawer > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 22px 24px 18px; border-bottom: 1px solid rgba(139, 92, 246, .16); }
.focus-mission-iur-drawer > header span { color: #a78bfa; font-size: 11px; font-weight: 550; text-transform: uppercase; }
.focus-mission-iur-drawer > header h2 { margin: 4px 0 0; color: #f8fafc; font-size: 22px; font-weight: 520; }
.focus-mission-iur-drawer > header button { display: grid; place-items: center; flex: 0 0 36px; width: 36px; height: 36px; border: 1px solid rgba(139, 92, 246, .22); border-radius: 50%; background: rgba(255, 255, 255, .025); color: #cbd5e1; font-size: 23px; cursor: pointer; transition: border-color 180ms ease, color 180ms ease, box-shadow 180ms ease; }
.focus-mission-iur-drawer > header button:hover { border-color: rgba(192, 132, 252, .52); color: #fff; box-shadow: 0 0 16px rgba(139, 92, 246, .16); }
.focus-mission-iur-content { display: grid; gap: 14px; flex: 1 1 auto; overflow-y: auto; padding: 18px 24px 20px; }
.focus-mission-iur-content section { display: grid; gap: 11px; }
.focus-mission-iur-content h3 { margin: 0; color: #e2e8f0; font-size: 14px; font-weight: 450; }
.focus-mission-iur-intro { margin: 0; color: #a8b3c4; font-size: 14.5px; line-height: 1.55; }
.focus-mission-iur-factors-section { gap: 6px !important; padding-bottom: 15px; border-bottom: 1px solid rgba(139, 92, 246, .14); }
.focus-mission-iur-factors-section > p { margin: 0; color: #a8b3c4; font-size: 13px; line-height: 1.55; }
.focus-mission-iur-factors { display: grid; gap: 7px; margin: 0; padding: 0; list-style: none; }
.focus-mission-iur-factors li { display: grid; grid-template-columns: 26px minmax(0, 1fr); align-items: center; gap: 9px; color: #cbd5e1; font-size: 13px; }
.focus-mission-iur-factors i { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: rgba(139, 92, 246, .1); color: #c084fc; font-style: normal; }
.focus-mission-iur-factors svg { width: 17px; height: 17px; }
.focus-mission-iur-scale-section { padding-bottom: 15px; border-bottom: 1px solid rgba(139, 92, 246, .14); }
.focus-mission-iur-scale-section > h3 { text-align: center; font-weight: 450; }
.focus-mission-iur-current { display: flex !important; align-items: center; justify-content: space-between; gap: 16px; min-height: 58px; padding: 8px 12px; border: 1px solid rgba(139, 92, 246, .22); border-radius: 8px; background: rgba(88, 28, 135, .1); }
.focus-mission-iur-current div { display: grid; gap: 4px; }
.focus-mission-iur-current div span { color: #94a3b8; font-size: 12px; }
.focus-mission-iur-current div strong { color: #f8fafc; font-size: 20px; font-weight: 520; }
.focus-mission-iur-current > b { display: inline-flex; align-items: center; min-height: 27px; padding: 3px 10px; border: 1px solid currentColor; border-radius: 99px; font-size: 11px; font-weight: 550; text-transform: uppercase; }
.focus-mission-iur-current > b.critical { color: #fb7185; }
.focus-mission-iur-current > b.high { color: #fb923c; }
.focus-mission-iur-current > b.medium { color: #fde047; }
.focus-mission-iur-current > b.low { color: #22d3ee; }
.focus-mission-iur-levels { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.focus-mission-iur-levels span { display: grid; justify-items: center; gap: 3px; padding: 5px 2px; font-size: 12px; text-align: center; }
.focus-mission-iur-levels span > i { width: 11px; height: 11px; margin-bottom: 2px; border-radius: 50%; background: currentColor; box-shadow: 0 0 10px color-mix(in srgb, currentColor, transparent 40%); }
.focus-mission-iur-levels b { font-weight: 580; }
.focus-mission-iur-levels small { color: #94a3b8; font-size: 10px; white-space: nowrap; }
.focus-mission-iur-levels .critical { color: #fb7185; }
.focus-mission-iur-levels .high { color: #fb923c; }
.focus-mission-iur-levels .medium { color: #fde047; }
.focus-mission-iur-levels .low { color: #22d3ee; }
.focus-mission-iur-context { gap: 10px !important; }
.focus-mission-iur-reasons { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.focus-mission-iur-reasons li { display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: center; gap: 9px; color: #cbd5e1; font-size: 12px; line-height: 1.45; }
.focus-mission-iur-reasons svg { width: 18px; height: 18px; color: #c084fc; }
.focus-mission-iur-drawer > footer { display: flex; justify-content: flex-end; padding: 14px 24px 16px; border-top: 1px solid rgba(139, 92, 246, .16); }
.focus-mission-iur-drawer > footer button { min-width: 132px; min-height: 38px; padding: 8px 18px; border: 1px solid rgba(168, 85, 247, .46); border-radius: 7px; background: linear-gradient(135deg, rgba(76, 29, 149, .9), rgba(126, 34, 206, .9)); color: #fff; font-size: 13px; font-weight: 520; cursor: pointer; box-shadow: 0 0 18px rgba(139, 92, 246, .18); transition: transform 180ms ease, box-shadow 180ms ease; }
.focus-mission-iur-drawer > footer button:hover { transform: translateY(-1px); box-shadow: 0 0 23px rgba(139, 92, 246, .28); }

@keyframes focus-mission-iur-backdrop-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes focus-mission-iur-drawer-in {
  from { opacity: 0; transform: translateX(-22px); }
  to { opacity: 1; transform: translateX(0); }
}

.focus-mission-center { display: grid; grid-template-rows: minmax(0, 1fr) auto; place-items: center; min-height: 0; gap: 12px; }
.focus-mission-center .focus-stage { position: relative; width: min(100%, 640px); height: min(68vh, 610px); }
.focus-mission-center .focus-circle { width: min(100%, 440px); height: min(100%, 440px); }
.focus-mission-center .focus-controls { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); }
.focus-mission-center .focus-settings-panel { z-index: 4; }

.focus-mission-plan { display: flex; min-height: 0; flex-direction: column; overflow: auto; }
.focus-mission-plan-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.focus-mission-plan-head h3 { color: #c4b5fd; font-size: 13px; font-weight: 600; text-transform: uppercase; }
.focus-mission-plan-head span { color: #8290a4; font-size: 12px; white-space: nowrap; }
.focus-mission-plan-list { position: relative; display: grid; gap: 2px; margin-top: 16px; }
.focus-mission-plan-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 10px;
  padding-top: 10px;
  margin-bottom: -6px;
  border-top: 1px solid rgba(139, 92, 246, 0.14);
}
.focus-mission-plan-footer button {
  min-height: 36px;
  padding: 7px 13px;
  border-radius: 7px;
  color: #fbbf24;
  font-size: 12px;
  text-transform: uppercase;
}
.focus-mission-plan-list::before {
  content: "";
  position: absolute;
  top: 18px;
  bottom: 18px;
  left: 12px;
  width: 1px;
  background: repeating-linear-gradient(
    to bottom,
    rgba(148, 163, 184, 0.42) 0 3px,
    transparent 3px 7px
  );
}.focus-mission-plan-item { position: relative; display: grid; grid-template-columns: 26px minmax(0, 1fr) auto 24px; align-items: center; gap: 8px; min-height: 39px; border: 1px solid transparent; border-radius: 7px; padding: 5px 7px 5px 0; background: transparent; color: #8290a4; text-align: left; }
.focus-mission-plan-item.current {
  border: 1px solid transparent;
  background: linear-gradient(
    90deg,
    rgba(88, 28, 135, .44),
    rgba(88, 28, 135, .18)
  );
  background-clip: padding-box;
  color: #f8fafc;
  box-shadow: 0 0 18px rgba(126, 34, 206, .1);
  margin-left: -8px;
  padding-left: 8px;
}
.focus-mission-plan-item.completed { color: #a7b6c8; }
.focus-mission-plan-item.skipped { color: #9aa7b8; opacity: 1; }
.focus-mission-plan-item strong { min-width: 0; overflow: hidden; font-size: 13px; font-weight: 450; text-overflow: ellipsis; white-space: nowrap; }
.focus-mission-plan-item small { overflow: hidden; color: inherit; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.focus-mission-plan-mark { position: relative; z-index: 1; display: grid; place-items: center; width: 24px; height: 24px; border: 1px solid rgba(148,163,184,.38); border-radius: 50%; background: #050712; color: #cbd5e1; font-size: 11px; }
.focus-mission-plan-item.current .focus-mission-plan-mark {
  border-color: #c084fc;
  background: rgba(22, 12, 40, 0.38);
  color: #f0abfc;
  box-shadow: 0 0 12px rgba(168, 85, 247, 0.35);
}
.focus-mission-plan-duration { justify-self: end; color: #cbd5e1 !important; }
.focus-mission-plan-state { display: grid; place-items: center; width: 20px; height: 20px; border: 1px solid rgba(100,116,139,.4); border-radius: 50%; color: #64748b; }
.focus-mission-plan-state:empty { background: rgba(7,10,19,.52); }
.focus-mission-plan-state svg { width: 15px; height: 15px; }
.focus-mission-plan-item.completed .focus-mission-plan-state { border-color: #22c55e; color: #4ade80; }
.focus-mission-plan-item.skipped .focus-mission-plan-state { border-color: #f59e0b; color: #fbbf24; }
.focus-mission-plan-item.current .focus-mission-plan-state { border-color: #a855f7; background: #a855f7; color: #050712; box-shadow: 0 0 12px rgba(168,85,247,.4); }

.focus-mission-next { margin-top: 0; }
.focus-mission-next .focus-mission-review-title { margin-top: 20px; }
.focus-mission-next h4 { margin-top: 0; font-size: 17px; }
.focus-mission-tip { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: min(100%, 550px); min-height: 60px; padding: 10px 12px 10px 16px; border: 1px solid rgba(139,92,246,.2); border-radius: 9px; background: rgba(5,7,18,.5); }
.focus-mission-tip span { display: grid; gap: 3px; min-width: 0; }
.focus-mission-tip b { color: #c084fc; font-size: 14px; font-weight: 500; }
.focus-mission-tip small { overflow: hidden; color: #94a3b8; font-size: 13px; font-weight: 500; text-overflow: ellipsis; white-space: normal; }
.focus-mission-tip button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; flex: 0 0 auto; min-height: 36px; padding: 7px 13px; border: 1px solid rgba(139,92,246,.24); border-radius: 7px; color: #e2e8f0; font-size: 14px; font-weight: 350; }
.focus-mission-skip-icon { display: inline-flex; width: 20px; height: 20px; color: currentColor; }
.focus-mission-skip-icon svg { width: 100%; height: 100%; }

.focus-mission-summary {
  --summary-color: #c084fc;
  --summary-rgb: 192, 132, 252;
  position: absolute;
  inset: 0;
  z-index: 6;
  display: grid;
  place-items: center;
  overflow: auto;
  padding: 72px 24px 26px;
  background:
    radial-gradient(circle at 50% 32%, rgba(var(--summary-rgb), .1), transparent 38%),
    radial-gradient(circle at 50% 100%, rgba(var(--summary-rgb), .035), transparent 34%),
    rgba(3,5,13,.992);
  color: var(--summary-color);
  animation: focus-mission-summary-in 360ms ease-out both;
}
.focus-mission-summary.success { --summary-color: #4ade80; --summary-rgb: 74, 222, 128; }
.focus-mission-summary.dedication,
.focus-mission-summary.paused { --summary-color: #c084fc; --summary-rgb: 192, 132, 252; }
.focus-mission-summary.early { --summary-color: #38bdf8; --summary-rgb: 56, 189, 248; }
.focus-mission-summary.warning { --summary-color: #f59e0b; --summary-rgb: 245, 158, 11; }
.focus-mission-summary .focus-mission-top { z-index: 2; color: rgba(203,213,225,.72); }
.focus-mission-summary-layout {
  display: grid;
  grid-template-columns: minmax(24px, 1fr) minmax(0, 900px) minmax(24px, 1fr);
  align-items: center;
  width: 100%;
}
.focus-mission-summary-layout .focus-mission-summary-card { grid-column: 2; }
.focus-mission-summary-card {
  position: relative;
  display: grid;
  justify-items: center;
  width: min(900px, calc(100vw - 40px));
  padding: 12px 0 0;
  text-align: center;
}
.focus-mission-summary-eyebrow {
  position: absolute;
  top: 24px;
  left: 0;
  display: grid;
  justify-items: start;
  gap: 5px;
  margin: 0;
  max-width: 300px;
  color: var(--summary-color);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .045em;
  text-align: left;
  text-transform: uppercase;
}
.focus-mission-summary-eyebrow small {
  color: #94a3b8;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0;
  text-transform: none;
}
.focus-mission-summary-icon {
  position: relative;
  display: grid;
  place-items: center;
  width: 165px;
  height: 165px;
  margin: -6px auto 19px;
  border: 4px solid currentColor;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(var(--summary-rgb), .09), transparent 68%);
  color: var(--summary-color);
  box-shadow:
    0 0 20px rgba(var(--summary-rgb), .48),
    0 0 52px rgba(var(--summary-rgb), .22),
    inset 0 0 26px rgba(var(--summary-rgb), .09);
  animation: focus-mission-summary-reward 620ms cubic-bezier(.2,.78,.24,1) both;
}
.focus-mission-summary-icon::before {
  content: "";
  position: absolute;
  inset: -13px;
  border: 1px solid rgba(var(--summary-rgb), .12);
  border-radius: 50%;
  filter: blur(.2px);
}
.focus-mission-summary-icon svg { width: 90px; height: 90px; }
.focus-mission-summary-card h2 { margin: 0; color: #f8fafc; font-size: 36px; font-weight: 540; line-height: 1.12; }
.focus-mission-summary-subtitle { margin: 10px 0 25px; color: #cbd5e1; font-size: 17px; line-height: 1.45; }
.focus-mission-summary-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; width: 100%; margin: 0 0 20px; }
.focus-mission-summary-metric {
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  min-height: 104px;
  border: 1px solid rgba(139,92,246,.2);
  border-radius: 8px;
  padding: 15px;
  background: rgba(7,10,19,.62);
  text-align: left;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.018);
}
.focus-mission-summary-metric > i {
  display: grid;
  place-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: color-mix(in srgb, currentColor, transparent 88%);
  color: currentColor;
  box-shadow: 0 0 18px color-mix(in srgb, currentColor, transparent 82%);
}
.focus-mission-summary-metric > i svg { width: 28px; height: 28px; }
.focus-mission-summary-metric > span { display: grid; grid-template-rows: auto auto 14px; align-content: center; min-width: 0; }
.focus-mission-summary-metric strong { color:#f8fafc; font-size:28px; font-weight:520; line-height:1.05; }
.focus-mission-summary-metric b { margin-top:5px; color:#a8b3c4; font-size:12.5px; font-weight:450; line-height:1.25; }
.focus-mission-summary-metric small { min-height: 14px; margin-top:4px; color:#38bdf8; font-size:11px; line-height: 1.2; }
.focus-mission-summary-metric.reviews { color: #c084fc; }
.focus-mission-summary-metric.time { color: #38bdf8; }
.focus-mission-summary-metric.disciplines { color: #4ade80; }
.focus-mission-summary-metric.trophy { color: #fbbf24; }
.focus-mission-summary-metric.progress { color: #fb923c; }
.focus-mission-summary-metric.calendar { color: #d946ef; }
.focus-mission-summary-warning {
  width: 100%;
  margin: 0 0 12px;
  border: 1px solid rgba(245,158,11,.38);
  border-radius: 8px;
  padding: 11px 16px;
  background: rgba(245,158,11,.06);
  color: #fbbf24;
  font-size: 13px;
  line-height: 1.45;
}
.focus-mission-summary-note {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  width: min(100%, 760px);
  min-height: 70px;
  margin: 0 0 23px;
  border: 1px solid rgba(var(--summary-rgb), .4);
  border-radius: 8px;
  padding: 13px 17px;
  background: rgba(var(--summary-rgb), .055);
  color: var(--summary-color);
  text-align: left;
  box-shadow: 0 0 22px rgba(var(--summary-rgb), .055);
}
.focus-mission-summary-note > i {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: rgba(var(--summary-rgb), .09);
  color: var(--summary-color);
  box-shadow: 0 0 15px rgba(var(--summary-rgb), .12);
}
.focus-mission-summary-note svg { width: 24px; height: 24px; }
.focus-mission-summary-note p { display: grid; gap: 4px; margin: 0; }
.focus-mission-summary-note strong { color: var(--summary-color); font-size: 15px; font-weight: 520; line-height: 1.3; }
.focus-mission-summary-note span { color: #cbd5e1; font-size: 14px; line-height: 1.35; }
.focus-mission-summary-actions { display:flex; justify-content:center; gap:12px; }
.focus-mission-summary-actions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 230px;
  min-height: 48px;
  padding: 10px 24px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 450;
}
.focus-mission-summary-actions button i { display: inline-flex; width: 24px; height: 24px; }
.focus-mission-summary-actions button svg { width: 100%; height: 100%; }
.focus-mission-summary-actions .primary {
  box-shadow: 0 0 24px rgba(139,92,246,.2);
}
.focus-mission-summary-foot { display: block; margin-top: 17px; color: #94a3b8; font-size: 12px; line-height: 1.4; }

.focus-mission-distribution {
  grid-column: 3;
  justify-self: start;
  align-self: center;
  width: min(300px, calc(100% - 106px));
  margin: 0 0 60px 106px;
  border: 1px solid rgba(139,92,246,.22);
  border-radius: 9px;
  padding: 18px 18px 17px;
  background: rgba(7,10,19,.66);
  color: #e2e8f0;
  text-align: left;
  box-shadow: 0 18px 44px rgba(0,0,0,.22), 0 0 24px rgba(139,92,246,.045);
}
.focus-mission-distribution h3 {
  margin: 0 0 18px;
  color: #e9d5ff;
  font-size: 15px;
  font-weight: 560;
  line-height: 1.3;
}
.focus-mission-distribution-list { display: grid; gap: 14px; }
.focus-mission-distribution-item { display: grid; gap: 7px; min-width: 0; }
.focus-mission-distribution-item > span:not(.sr-only) {
  overflow: hidden;
  color: #cbd5e1;
  font-size: 12.5px;
  font-weight: 450;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.focus-mission-distribution .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
}
.focus-mission-distribution-track {
  width: 100%;
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(63,72,102,.28);
  box-shadow: inset 0 1px 2px rgba(0,0,0,.28);
}
.focus-mission-distribution-track i {
  display: block;
  width: var(--mission-fill);
  height: 100%;
  border-radius: inherit;
  background: #9b5cf6;
  box-shadow: 0 0 9px rgba(155,92,246,.34);
  transform-origin: left center;
  animation: focus-mission-distribution-fill 560ms cubic-bezier(.2,.72,.25,1) both;
  animation-delay: var(--mission-delay);
}
.focus-mission-distribution-more,
.focus-mission-distribution-single {
  display: block;
  margin: 15px 0 0;
  color: #7f8ca3;
  font-size: 11.5px;
  font-weight: 430;
  line-height: 1.4;
}
.focus-mission-distribution-single { max-width: 240px; }

@keyframes focus-mission-distribution-fill {
  from { opacity: .55; transform: scaleX(0); }
  to { opacity: 1; transform: scaleX(1); }
}

@keyframes focus-mission-summary-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes focus-mission-summary-reward {
  0% { opacity: 0; transform: scale(.78); filter: blur(3px); }
  70% { opacity: 1; transform: scale(1.035); filter: blur(0); }
  100% { opacity: 1; transform: scale(1); filter: blur(0); }
}

@media (min-width: 851px) and (max-height: 760px) {
  .focus-mission-summary { padding-block: 68px 14px; }
  .focus-mission-summary-card { padding-top: 4px; }
  .focus-mission-summary-eyebrow { margin-bottom: 6px; }
  .focus-mission-summary-icon { width: 148px; height: 148px; margin-bottom: 12px; }
  .focus-mission-summary-icon svg { width: 81px; height: 81px; }
  .focus-mission-summary-card h2 { font-size: 33px; }
  .focus-mission-summary-subtitle { margin: 7px 0 16px; font-size: 16px; }
  .focus-mission-summary-metrics { margin-bottom: 14px; }
  .focus-mission-summary-metric { min-height: 86px; padding-block: 10px; }
  .focus-mission-summary-warning { margin-bottom: 9px; padding-block: 8px; }
  .focus-mission-summary-note { min-height: 62px; margin-bottom: 14px; padding-block: 8px; }
  .focus-mission-summary-actions button { min-height: 45px; }
  .focus-mission-summary-foot { margin-top: 12px; }
}

@media (max-width: 1120px) {
  .focus-mission-shell { inset: 70px 20px 28px; grid-template-columns: minmax(210px,260px) minmax(400px,1fr) minmax(210px,260px); gap: 14px; }
  .focus-mission-badge { left: 20px; }
  .focus-mission-column { padding-top: 94px; }
  .focus-mission-center .focus-circle { width: min(100%, 440px); height: min(100%, 440px); }
  .focus-mission-summary-card { width: min(820px, calc(100vw - 40px)); }
  .focus-mission-summary-icon { width: 152px; height: 152px; }
  .focus-mission-summary-icon svg { width: 83px; height: 83px; }
  .focus-mission-summary-card h2 { font-size: 34px; }
}

@media (max-width: 1680px) {
  .focus-mission-summary-layout {
    grid-template-columns: minmax(0, 900px);
    justify-content: center;
    gap: 22px;
  }
  .focus-mission-summary-layout .focus-mission-summary-card,
  .focus-mission-distribution { grid-column: 1; }
  .focus-mission-distribution {
    justify-self: center;
    width: min(900px, calc(100vw - 40px));
    margin: 0;
  }
}

@media (max-width: 850px) {
  /* justify-content: flex-start: the desktop "center" survives into this column, and content taller than the screen
     then overflows upward, above the scroll origin, where the timer circle and its controls become unreachable. */
  .focus-mission-shell { position: relative; inset: auto; display: flex; flex-direction: column; justify-content: flex-start; overflow-x: hidden; overflow-y: auto; padding: 136px 16px 80px; }
  /* Header in three bands so nothing stacks: [badge … settings/close] / [steps] / [progress]. The ::before band sits
     over the scrolling shell so content never runs underneath the fixed controls. */
  .focus-mission-mode::before { content: ""; position: absolute; inset: 0 0 auto; z-index: 2; height: 124px; background: linear-gradient(180deg, var(--bg) 80%, transparent); pointer-events: none; }
  .focus-mission-badge { top: 14px; left: 14px; }
  .focus-mission-top { inset: 58px 14px auto; z-index: 3; justify-content: center; overflow: hidden; white-space: nowrap; }
  .focus-mission-top.mission-active,
  .focus-mission-top.summary-active { inset: 58px 14px auto; width: auto; transform: none; }
  .focus-mission-progress { top: 92px; width: min(520px, calc(100vw - 32px)); }
  .focus-mission-shell > * { min-width: 0; max-width: 100%; }
  .focus-mission-center { order: -1; width: 100%; min-height: 440px; }
  .focus-mission-center .focus-stage { width: 100% !important; min-width: 0; min-height: 0 !important; max-width: 100% !important; height: auto !important; aspect-ratio: 1; }
  .focus-mission-center .focus-circle { width: 100% !important; max-width: 100%; height: 100% !important; max-height: 100%; }
  .focus-mission-column { display: grid; flex: 0 0 auto; min-height: auto; overflow: visible; padding-top: 0; }
  .focus-mission-panel { min-width: 0; }
  .focus-mission-left { order: 0; }
  .focus-mission-right { order: 1; }
  .focus-mission-summary-metrics { grid-template-columns: repeat(2, 1fr); }
  .focus-mission-summary { padding: 84px 16px 24px; }
  .focus-mission-summary-card { width: min(680px, 100%); }
  .focus-mission-summary-layout { width: min(680px, 100%); }
  .focus-mission-distribution { width: 100%; }
  .focus-mission-summary-eyebrow { position: static; justify-items: center; max-width: none; margin-bottom: 8px; text-align: center; }
  .focus-mission-summary-icon { width: 140px; height: 140px; margin-top: 0; }
  .focus-mission-summary-icon svg { width: 77px; height: 77px; }
}

@media (max-width: 560px) {
  .focus-mission-badge { left: 14px; }
  .focus-mission-top { inset-inline: 14px; justify-content: center; gap: 4px; overflow: visible; font-size: 9px; }
  .focus-mission-top.mission-active,
  .focus-mission-top.summary-active { inset: 58px 14px auto; }
  .focus-mission-top.mission-active span,
  .focus-mission-top.summary-active span { gap: 3px; font-size: 9px; }
  .focus-mission-top span { gap: 3px; }
  .focus-mission-top span i { width: 19px; height: 19px; font-size: 8px; }
  .focus-mission-top > b { width: 7px; }
  .focus-mission-progress { top: 92px; grid-template-columns: 1fr; gap: 6px; justify-items: center; font-size: 11px; }
  .focus-mission-center { min-height: 400px; }
  .focus-mission-tip { width: 100%; }
  .focus-mission-summary-card { width: 100%; }
  .focus-mission-summary-eyebrow { gap: 8px; font-size: 11px; }
  .focus-mission-summary-eyebrow small { padding-left: 8px; font-size: 10px; }
  .focus-mission-summary-icon { width: 121px; height: 121px; border-width: 4px; }
  .focus-mission-summary-icon svg { width: 66px; height: 66px; }
  .focus-mission-summary-card h2 { font-size: 28px; }
  .focus-mission-summary-subtitle { margin-bottom: 18px; font-size: 15px; }
  .focus-mission-summary-metrics { grid-template-columns: 1fr 1fr; }
  .focus-mission-summary-metric { grid-template-columns: 38px minmax(0, 1fr); gap: 9px; min-height: 88px; padding: 10px; }
  .focus-mission-summary-metric > i { width: 38px; height: 38px; }
  .focus-mission-summary-metric > i svg { width: 21px; height: 21px; }
  .focus-mission-summary-metric strong { font-size: 22px; }
  .focus-mission-summary-metric b { font-size: 10px; }
  .focus-mission-summary-note { grid-template-columns: 38px minmax(0, 1fr); gap: 10px; padding: 10px 12px; }
  .focus-mission-summary-note > i { width: 36px; height: 36px; }
  .focus-mission-summary-note strong { font-size: 13px; }
  .focus-mission-summary-note span { font-size: 12px; }
  .focus-mission-summary-actions { flex-direction: column; }
  .focus-mission-summary-actions button { width: 100%; min-width: 0; }
  .focus-mission-distribution { padding: 15px; }
  .focus-mission-distribution h3 { margin-bottom: 15px; }
  .focus-mission-distribution-list { gap: 13px; }
  .focus-mission-iur-drawer { inset: 8px; width: auto; }
  .focus-mission-iur-levels { grid-template-columns: repeat(2, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .focus-mission-panel, .focus-mission-summary, .focus-mission-summary-icon, .focus-mission-iur-backdrop, .focus-mission-iur-drawer { animation: none !important; transition: none !important; }
  .focus-mission-distribution-track i { animation: none !important; }
}

.recovery-mission-confirm-backdrop {
  z-index: 110;
  background: rgba(3, 5, 13, 0.78);
  backdrop-filter: blur(10px);
}

.recovery-mission-confirm-modal {
  width: min(480px, 100%);
  border: 1px solid rgba(244, 63, 94, 0.28);
  border-radius: 8px;
  background: #0d1020;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.5), 0 0 28px rgba(244, 63, 94, 0.08);
  color: #f8fafc;
}

.recovery-mission-confirm-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-bottom: 12px;
  border: 1px solid rgba(244, 63, 94, 0.42);
  border-radius: 50%;
  background: rgba(244, 63, 94, 0.08);
  color: #fb7185;
  font-size: 17px;
  font-weight: 600;
}

.recovery-mission-confirm-modal h2 {
  margin: 0;
  font-size: 20px;
  font-weight: 560;
}

.recovery-mission-confirm-modal p {
  margin: 10px 0 0;
  color: #cbd5e1;
  font-size: 14px;
  line-height: 1.6;
}

.recovery-mission-confirm-modal .dialog-actions {
  justify-content: flex-end;
  margin-top: 22px;
}

.recovery-mission-confirm-action {
  min-height: 38px;
  border: 1px solid rgba(244, 63, 94, 0.48);
  border-radius: 8px;
  background: rgba(244, 63, 94, 0.14);
  color: #fecdd3;
  cursor: pointer;
}

.recovery-mission-confirm-action:hover,
.recovery-mission-confirm-action:focus-visible {
  background: rgba(244, 63, 94, 0.22);
  box-shadow: 0 0 18px rgba(244, 63, 94, 0.16);
}

.recovery-mission-confirm-action:disabled {
  cursor: wait;
  opacity: 0.62;
}

/* ==========================================================================
   Tema claro — Modo Missão (Recovery Mission)
   Escopado em html[data-theme="light"]; o tema escuro não é afetado. Só cor, via tokens de design-system.css.
   Severidade: crítica = danger, alta = laranja, média = warning, baixa = cyan (mesma lógica das Revisões).
   ========================================================================== */
html[data-theme="light"] .focus-overlay.focus-mission-mode { --mission-accent: #7c3aed; --mission-success: #168a50; --mission-warning: #a16207; }
html[data-theme="light"] .focus-mission-badge,
html[data-theme="light"] .review-recovery-active .recovery-active-badge { border-color: rgba(124, 58, 237, 0.38); background: var(--primary-2); color: var(--primary); }

/* Trilha de etapas */
html[data-theme="light"] .focus-mission-top,
html[data-theme="light"] .focus-mission-summary .focus-mission-top { color: var(--muted); }
html[data-theme="light"] .focus-mission-top span i { border-color: rgba(57, 44, 89, 0.28); color: var(--text-muted); }
html[data-theme="light"] .focus-mission-top > b { border-top-color: rgba(57, 44, 89, 0.28); }
html[data-theme="light"] .focus-mission-top .active,
html[data-theme="light"] .focus-mission-top.mission-active .active,
html[data-theme="light"] .focus-mission-top.summary-active .active { color: var(--primary); }
html[data-theme="light"] .focus-mission-top .done i { border-color: rgba(22, 138, 80, 0.45); background: rgba(22, 138, 80, 0.1); color: var(--success); }
html[data-theme="light"] .focus-mission-top .active i { border-color: rgba(124, 58, 237, 0.7); background: linear-gradient(145deg, #7c3aed, #6d28d9); color: #fff; box-shadow: 0 6px 14px rgba(124, 58, 237, 0.3); }

/* Painel da missão e revisão atual */
html[data-theme="light"] .focus-mission-panel { border-color: var(--card-border); background: var(--card-1); box-shadow: 0 10px 28px rgba(57, 44, 89, 0.08); }
html[data-theme="light"] .focus-mission-panel h3,
html[data-theme="light"] .focus-mission-panel h4,
html[data-theme="light"] .focus-mission-reasons summary,
html[data-theme="light"] .focus-mission-summary-card h2,
html[data-theme="light"] .focus-mission-summary-metric strong,
html[data-theme="light"] .focus-mission-iur-drawer > header h2,
html[data-theme="light"] .focus-mission-iur-current div strong,
html[data-theme="light"] .focus-mission-tip button,
html[data-theme="light"] .recovery-mission-confirm-modal { color: var(--ink); }
html[data-theme="light"] .focus-mission-panel p,
html[data-theme="light"] .focus-mission-reasons-body > p,
html[data-theme="light"] .focus-mission-iur-intro,
html[data-theme="light"] .focus-mission-iur-factors-section > p,
html[data-theme="light"] .focus-mission-iur-current div span,
html[data-theme="light"] .focus-mission-iur-levels small,
html[data-theme="light"] .focus-mission-plan-head span,
html[data-theme="light"] .focus-mission-plan-item,
html[data-theme="light"] .focus-mission-tip small,
html[data-theme="light"] .focus-mission-summary-eyebrow small,
html[data-theme="light"] .focus-mission-summary-metric b,
html[data-theme="light"] .focus-mission-summary-foot,
html[data-theme="light"] .focus-mission-distribution-more,
html[data-theme="light"] .focus-mission-distribution-single { color: var(--muted); }
html[data-theme="light"] .focus-mission-progress,
html[data-theme="light"] .focus-mission-factors li,
html[data-theme="light"] .focus-mission-factors li p,
html[data-theme="light"] .focus-mission-learn,
html[data-theme="light"] .focus-mission-iur-content h3,
html[data-theme="light"] .focus-mission-iur-factors li,
html[data-theme="light"] .focus-mission-iur-reasons li,
html[data-theme="light"] .focus-mission-summary-subtitle,
html[data-theme="light"] .focus-mission-summary-note span,
html[data-theme="light"] .focus-mission-distribution,
html[data-theme="light"] .focus-mission-distribution-item > span:not(.sr-only),
html[data-theme="light"] .recovery-mission-confirm-modal p { color: var(--text-secondary); }
html[data-theme="light"] .focus-mission-segments i { background: rgba(57, 44, 89, 0.16); }
html[data-theme="light"] .focus-mission-segments i.completed { background: var(--success); box-shadow: none; }
html[data-theme="light"] .focus-mission-segments i.current { background: var(--primary); box-shadow: none; }
html[data-theme="light"] .focus-mission-segments i.skipped { background: rgba(161, 98, 7, 0.6); }
html[data-theme="light"] .focus-mission-review-title > span { border-color: rgba(124, 58, 237, 0.32); background: var(--primary-2); color: var(--primary); box-shadow: none; }
html[data-theme="light"] .focus-mission-meta span { border-color: rgba(124, 58, 237, 0.28); color: var(--primary); }
html[data-theme="light"] .focus-mission-review-head small,
html[data-theme="light"] .focus-mission-next-head small,
html[data-theme="light"] .focus-mission-plan-head h3,
html[data-theme="light"] .focus-mission-learn-arrow,
html[data-theme="light"] .focus-mission-iur-drawer > header span,
html[data-theme="light"] .focus-mission-tip b,
html[data-theme="light"] .focus-mission-distribution h3,
html[data-theme="light"] .focus-mission-factors li.factor-purple,
html[data-theme="light"] .focus-mission-iur-factors i,
html[data-theme="light"] .focus-mission-iur-reasons svg { color: var(--primary); }

/* Severidade */
html[data-theme="light"] .focus-mission-meta .critical,
html[data-theme="light"] .focus-mission-review-head > span.critical,
html[data-theme="light"] .focus-mission-next-head > span.critical,
html[data-theme="light"] .focus-mission-impact strong.critical,
html[data-theme="light"] .focus-mission-iur-current > b.critical,
html[data-theme="light"] .focus-mission-iur-levels .critical,
html[data-theme="light"] .focus-mission-factors li.factor-danger { color: var(--danger); border-color: rgba(217, 45, 78, 0.4); }
html[data-theme="light"] .focus-mission-meta .high,
html[data-theme="light"] .focus-mission-review-head > span.high,
html[data-theme="light"] .focus-mission-next-head > span.high,
html[data-theme="light"] .focus-mission-impact strong.high,
html[data-theme="light"] .focus-mission-iur-current > b.high,
html[data-theme="light"] .focus-mission-iur-levels .high,
html[data-theme="light"] .focus-mission-summary-metric.progress { color: #c2570c; border-color: rgba(194, 87, 12, 0.4); }
html[data-theme="light"] .focus-mission-meta .medium,
html[data-theme="light"] .focus-mission-review-head > span.medium,
html[data-theme="light"] .focus-mission-next-head > span.medium,
html[data-theme="light"] .focus-mission-impact strong.medium,
html[data-theme="light"] .focus-mission-iur-current > b.medium,
html[data-theme="light"] .focus-mission-iur-levels .medium,
html[data-theme="light"] .focus-mission-factors li.factor-amber,
html[data-theme="light"] .focus-mission-meta .focus-mission-review-type.mensal,
html[data-theme="light"] .focus-mission-plan-footer button,
html[data-theme="light"] .focus-mission-summary-metric.trophy,
html[data-theme="light"] .focus-mission-summary-warning { color: var(--warning); border-color: rgba(161, 98, 7, 0.38); }
html[data-theme="light"] .focus-mission-meta .low,
html[data-theme="light"] .focus-mission-review-head > span.low,
html[data-theme="light"] .focus-mission-next-head > span.low,
html[data-theme="light"] .focus-mission-impact strong.low,
html[data-theme="light"] .focus-mission-iur-current > b.low,
html[data-theme="light"] .focus-mission-iur-levels .low,
html[data-theme="light"] .focus-mission-factors li.factor-cyan,
html[data-theme="light"] .focus-mission-meta .focus-mission-review-type.daily,
html[data-theme="light"] .focus-mission-summary-metric small,
html[data-theme="light"] .focus-mission-summary-metric.time { color: var(--cyan); border-color: rgba(8, 145, 178, 0.36); }
html[data-theme="light"] .focus-mission-meta .focus-mission-review-type.semanal { color: var(--primary); border-color: rgba(124, 58, 237, 0.34); }
html[data-theme="light"] .focus-mission-meta .focus-mission-review-type.livre,
html[data-theme="light"] .focus-mission-factors li.factor-green,
html[data-theme="light"] .focus-mission-summary-metric.disciplines { color: var(--success); border-color: rgba(22, 138, 80, 0.36); }
html[data-theme="light"] .focus-mission-summary-metric.reviews { color: var(--primary); }
html[data-theme="light"] .focus-mission-summary-metric.calendar { color: var(--magenta); }

/* Razões, tip e "aprender mais" */
html[data-theme="light"] .focus-mission-reasons { border-color: var(--card-border); background: var(--surface-soft); box-shadow: none; }
html[data-theme="light"] .focus-mission-learn { border-top-color: var(--card-border); }
html[data-theme="light"] .focus-mission-learn:hover { background: var(--primary-2); color: var(--primary); }
html[data-theme="light"] .focus-mission-tip { border-color: var(--card-border); background: var(--surface-soft); }
html[data-theme="light"] .focus-mission-tip button { border-color: var(--card-border); }

/* Drawer explicativo do IUR */
html[data-theme="light"] .focus-mission-iur-backdrop { background: var(--drawer-backdrop); }
html[data-theme="light"] .focus-mission-iur-drawer { border-color: var(--drawer-border); background: var(--drawer-1); box-shadow: 20px 0 50px rgba(57, 44, 89, 0.2); }
html[data-theme="light"] .focus-mission-iur-drawer > header,
html[data-theme="light"] .focus-mission-iur-factors-section,
html[data-theme="light"] .focus-mission-iur-scale-section,
html[data-theme="light"] .focus-mission-iur-drawer > footer { border-color: var(--card-border); }
html[data-theme="light"] .focus-mission-iur-drawer > header button { border-color: var(--card-border); background: var(--surface-soft); color: var(--text-secondary); }
html[data-theme="light"] .focus-mission-iur-drawer > header button:hover { border-color: rgba(124, 58, 237, 0.5); color: var(--primary); box-shadow: none; }
html[data-theme="light"] .focus-mission-iur-factors i { background: var(--primary-2); }
html[data-theme="light"] .focus-mission-iur-current { border-color: var(--card-border); background: var(--primary-2); }
html[data-theme="light"] .focus-mission-iur-drawer > footer button { border-color: rgba(124, 58, 237, 0.5); background: linear-gradient(135deg, #7c3aed, #6d28d9); box-shadow: 0 8px 18px rgba(124, 58, 237, 0.24); }

/* Plano da missão */
html[data-theme="light"] .focus-mission-plan-footer { border-top-color: var(--card-border); }
html[data-theme="light"] .focus-mission-plan-list::before { background: repeating-linear-gradient(to bottom, rgba(57, 44, 89, 0.3) 0 3px, transparent 3px 7px); }
html[data-theme="light"] .focus-mission-plan-item.current { background: linear-gradient(90deg, rgba(124, 58, 237, 0.14), rgba(124, 58, 237, 0.05)); color: var(--ink); box-shadow: none; }
html[data-theme="light"] .focus-mission-plan-item.completed { color: var(--text-secondary); }
html[data-theme="light"] .focus-mission-plan-item.skipped { color: var(--muted); }
html[data-theme="light"] .focus-mission-plan-mark { border-color: rgba(57, 44, 89, 0.28); background: var(--panel); color: var(--text-secondary); }
html[data-theme="light"] .focus-mission-plan-item.current .focus-mission-plan-mark { border-color: var(--primary); background: var(--primary-2); color: var(--primary); box-shadow: none; }
html[data-theme="light"] .focus-mission-plan-duration { color: var(--text-secondary) !important; }
html[data-theme="light"] .focus-mission-plan-state { border-color: rgba(57, 44, 89, 0.28); color: var(--text-muted); }
html[data-theme="light"] .focus-mission-plan-state:empty { background: var(--surface-soft); }
html[data-theme="light"] .focus-mission-plan-item.completed .focus-mission-plan-state { border-color: var(--success); color: var(--success); }
html[data-theme="light"] .focus-mission-plan-item.skipped .focus-mission-plan-state { border-color: var(--warning); color: var(--warning); }
html[data-theme="light"] .focus-mission-plan-item.current .focus-mission-plan-state { border-color: var(--primary); background: var(--primary); color: #fff; box-shadow: none; }

/* Resumo final */
html[data-theme="light"] .focus-mission-summary.success { --summary-color: #168a50; }
html[data-theme="light"] .focus-mission-summary.dedication,
html[data-theme="light"] .focus-mission-summary.paused { --summary-color: #7c3aed; }
html[data-theme="light"] .focus-mission-summary.early { --summary-color: #0284c7; }
html[data-theme="light"] .focus-mission-summary.warning { --summary-color: #a16207; }
html[data-theme="light"] .focus-mission-summary-icon { box-shadow: 0 0 18px rgba(var(--summary-rgb), .22), inset 0 0 18px rgba(var(--summary-rgb), .07); }
html[data-theme="light"] .focus-mission-summary-metric { border-color: var(--card-border); background: var(--card-1); box-shadow: none; }
html[data-theme="light"] .focus-mission-summary-warning { background: rgba(161, 98, 7, 0.07); }
html[data-theme="light"] .focus-mission-summary-note { box-shadow: none; }
html[data-theme="light"] .focus-mission-summary-note > i { box-shadow: none; }
html[data-theme="light"] .focus-mission-summary-actions .primary { box-shadow: 0 8px 20px rgba(124, 58, 237, 0.26); }
html[data-theme="light"] .focus-mission-distribution { border-color: var(--card-border); background: var(--card-1); box-shadow: 0 10px 28px rgba(57, 44, 89, 0.08); }
html[data-theme="light"] .focus-mission-distribution-track { background: var(--progress-track-bg); box-shadow: none; }
html[data-theme="light"] .focus-mission-distribution-track i { box-shadow: none; }

/* Confirmação de encerramento */
html[data-theme="light"] .recovery-mission-confirm-backdrop { background: var(--modal-backdrop); }
html[data-theme="light"] .recovery-mission-confirm-modal { border-color: rgba(217, 45, 78, 0.3); background: var(--panel); box-shadow: 0 24px 60px rgba(57, 44, 89, 0.24); }
html[data-theme="light"] .recovery-mission-confirm-icon { border-color: rgba(217, 45, 78, 0.4); background: rgba(217, 45, 78, 0.08); color: var(--danger); }
html[data-theme="light"] .recovery-mission-confirm-action { border-color: rgba(217, 45, 78, 0.48); background: rgba(217, 45, 78, 0.1); color: var(--danger); }
html[data-theme="light"] .recovery-mission-confirm-action:hover,
html[data-theme="light"] .recovery-mission-confirm-action:focus-visible { background: rgba(217, 45, 78, 0.18); box-shadow: none; }

/* Resumo da missão: fundo claro e acentos aprofundados (as cores do escuro são tons claros de 300-400) */
html[data-theme="light"] .focus-mission-summary {
  --summary-color: #7c3aed;
  --summary-rgb: 124, 58, 237;
  background:
    radial-gradient(circle at 50% 32%, rgba(var(--summary-rgb), .1), transparent 40%),
    radial-gradient(circle at 50% 100%, rgba(var(--summary-rgb), .05), transparent 36%),
    rgba(246, 243, 251, .995);
}
html[data-theme="light"] .focus-mission-summary.success { --summary-color: #168a50; --summary-rgb: 22, 138, 80; }
html[data-theme="light"] .focus-mission-summary.dedication,
html[data-theme="light"] .focus-mission-summary.paused { --summary-color: #7c3aed; --summary-rgb: 124, 58, 237; }
html[data-theme="light"] .focus-mission-summary.early { --summary-color: #0284c7; --summary-rgb: 2, 132, 199; }
html[data-theme="light"] .focus-mission-summary.warning { --summary-color: #a16207; --summary-rgb: 161, 98, 7; }
html[data-theme="light"] .focus-mission-summary-actions .ghost,
html[data-theme="light"] .focus-mission-summary-actions .secondary { border-color: rgba(124, 58, 237, 0.4); background: var(--card-1); color: var(--primary); }
