:root {
  --v2-color-primary: #ff6814;
  --v2-color-primary-strong: #e95508;
  --v2-color-bg: #fffcf7;
  --v2-color-surface: #ffffff;
  --v2-color-secondary: #7357cf;
  --v2-color-secondary-soft: #f0ecff;
  --v2-color-ink: #27212d;
  --v2-color-muted: #807987;
  --v2-color-line: #eee8df;
  --v2-radius-card: 24px;
  --v2-touch-target: 44px;
  --v2-bottom-nav-height: 68px;
  --v2-shadow-card: 0 10px 28px rgba(82, 55, 32, .08);
}

.v2-only { display: none !important; }

html.v2-shell { scrollbar-gutter: auto; color-scheme: light; background: var(--v2-color-bg); }
html.v2-shell .v2-only:not(.hidden) { display: flex !important; }
html.v2-shell .legacy-only { display: none !important; }
html.v2-shell body {
  min-width: 0;
  background:
    radial-gradient(circle at 94% 2%, rgba(255, 213, 173, .28), transparent 18rem),
    var(--v2-color-bg);
  color: var(--v2-color-ink);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
}
html.v2-shell #siteHeader { display: none !important; }
html.v2-shell main {
  width: min(100%, 520px);
  max-width: none;
  min-height: 100dvh;
  margin: 0 auto;
  padding: 20px 18px calc(var(--v2-bottom-nav-height) + env(safe-area-inset-bottom) + 28px);
}
html.v2-shell .page-head {
  min-height: 48px;
  padding: 0 0 20px;
  gap: 12px;
}
html.v2-shell .v2-brand-lockup { min-width: 0; align-items: center; gap: 10px; }
html.v2-shell .v2-brand-mark {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 14px;
  object-fit: cover;
  box-shadow: 0 6px 16px rgba(255, 104, 20, .18);
}
html.v2-shell .v2-brand-copy { display: flex; min-width: 0; flex-direction: column; line-height: 1.05; }
html.v2-shell .v2-brand-copy strong { white-space: nowrap; font-size: 17px; font-weight: 900; letter-spacing: .01em; }
html.v2-shell .v2-brand-copy strong span { font-size: 13px; }
html.v2-shell .v2-brand-copy strong em { margin-left: 3px; color: #aaa2a8; font-size: 9px; font-style: normal; font-weight: 500; }
html.v2-shell .v2-brand-copy small { margin-top: 7px; color: var(--v2-color-muted); font-size: 10px; font-weight: 500; }
html.v2-shell .home-child-trigger,
html.v2-shell .home-child-empty {
  min-height: var(--v2-touch-target);
  border-color: var(--v2-color-line);
  border-radius: 999px;
  box-shadow: 0 5px 18px rgba(61, 45, 32, .07);
}
html.v2-shell .home-child { position: relative; }
html.v2-shell .home-child-avatar { background: #fff1e8; }
html.v2-shell .home-child-name { max-width: 72px; }
html.v2-shell .home-child-menu { right: 0; border-color: var(--v2-color-line); box-shadow: var(--v2-shadow-card); }
html.v2-shell .home-child-option:hover,
html.v2-shell .home-child-option.active { background: #fff4eb; }
html.v2-shell .home-child-check { color: var(--v2-color-primary); }

html.v2-shell .v2-home-intro {
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 4px 2px 22px;
}
html.v2-shell .v2-home-date { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-end; gap: 2px; padding-top: 6px; color: #4e4852; font-size: 12px; }
html.v2-shell .v2-home-intro h1 { margin-top: 5px; font-size: clamp(26px, 7.2vw, 32px); line-height: 1.25; letter-spacing: -.02em; }
html.v2-shell #v2HomeScope { margin-top: 7px; color: var(--v2-color-muted); font-size: 13px; line-height: 1.55; }

html.v2-shell .smart-plan {
  position: relative;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  margin-bottom: 14px;
  padding: 22px;
  overflow: hidden;
  border: 1px solid #f4e8dc;
  border-radius: var(--v2-radius-card);
  background: var(--v2-color-surface);
  box-shadow: var(--v2-shadow-card);
}
html.v2-shell .smart-plan::after {
  position: absolute;
  top: -35px;
  right: -30px;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: rgba(255, 184, 121, .16);
  content: "";
  pointer-events: none;
}
html.v2-shell .v2-plan-header { display: flex; min-height: 54px; align-items: flex-start; justify-content: space-between; gap: 12px; }
html.v2-shell .v2-plan-header .smart-plan-kicker { padding-top: 5px; color: var(--v2-color-ink); font-size: 18px; line-height: 1.45; }
html.v2-shell .v2-plan-lion { z-index: 1; width: 84px; height: 84px; margin: -18px -6px -28px 0; object-fit: contain; }
html.v2-shell .smart-plan-kicker { color: var(--v2-color-primary); font-size: 13px; letter-spacing: 0; }
html.v2-shell .v2-plan-subject { display: inline-flex; margin: 2px 0 6px; padding: 4px 10px; border-radius: 999px; background: var(--v2-color-primary); color: #fff; font-size: 12px; font-weight: 800; }
html.v2-shell .smart-plan h2 { max-width: 100%; margin-top: 3px; color: var(--v2-color-ink); font-size: 20px; line-height: 1.5; overflow-wrap: anywhere; }
html.v2-shell .smart-plan p { margin-top: 7px; color: #5f5864; font-size: 14px; line-height: 1.65; }
html.v2-shell .v2-plan-meta { display: flex; gap: 20px; margin-top: 10px; color: #554d57; font-size: 13px; }
html.v2-shell .v2-plan-meta span::before { margin-right: 6px; color: var(--v2-color-primary); content: "□"; font-weight: 900; }
html.v2-shell .v2-plan-meta span + span::before { content: "◷"; }
html.v2-shell .v2-plan-reason { display: flex; align-items: flex-start; gap: 8px; margin-top: 13px; padding: 11px 12px; border: 1px solid #f8dfca; border-radius: 14px; background: #fff8f2; color: #736873; font-size: 11px; line-height: 1.55; }
html.v2-shell .v2-plan-reason b { flex: 0 0 auto; color: var(--v2-color-primary); }
html.v2-shell .smart-plan-progress {
  width: fit-content;
  margin-top: 12px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #fff5eb;
  color: #b94a0d;
  font-size: 12px;
}
html.v2-shell .smart-plan small { margin-top: 8px; color: var(--v2-color-muted); }
html.v2-shell .smart-plan .btn {
  z-index: 1;
  width: 100%;
  min-height: 50px;
  margin: 2px 0 0;
  border-radius: 16px;
  background: linear-gradient(135deg, #ff7a27, var(--v2-color-primary));
  box-shadow: 0 8px 18px rgba(255, 104, 20, .2);
}
html.v2-shell .smart-plan .btn.ghost { border-color: #e5dcff; background: var(--v2-color-secondary-soft); color: var(--v2-color-secondary); box-shadow: none; }

html.v2-shell .manual-generate-details summary {
  min-height: 66px;
  border-color: #e5dcff;
  border-radius: 20px;
  background: var(--v2-color-secondary-soft);
  box-shadow: none;
}
html.v2-shell .manual-generate-icon { background: #fff; color: var(--v2-color-secondary); }
html.v2-shell .manual-generate-arrow { color: var(--v2-color-secondary); }
html.v2-shell .manual-generate-details[open] summary { border-color: #d7caff; background: #f7f4ff; }
html.v2-shell .manual-generate-details > .card { border: 1px solid var(--v2-color-line); box-shadow: var(--v2-shadow-card); }
html.v2-shell .btn { background: linear-gradient(135deg, #ff7a27, var(--v2-color-primary)); }
html.v2-shell .btn.ghost { border-color: #e5dcff; background: var(--v2-color-secondary-soft); color: var(--v2-color-secondary); }

html.v2-shell .v2-weekly-progress {
  margin: 10px 0 4px;
  padding: 17px 16px;
  flex-direction: column;
  border: 1px solid #f4e8dc;
  border-radius: 20px;
  background: var(--v2-color-surface);
  box-shadow: var(--v2-shadow-card);
}
html.v2-shell .v2-week-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
html.v2-shell .v2-week-head strong { font-size: 14px; }
html.v2-shell .v2-week-head span { color: var(--v2-color-muted); font-size: 11px; }
html.v2-shell .v2-week-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; margin-top: 14px; }
html.v2-shell .v2-week-day { min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 5px; color: #9d969d; }
html.v2-shell .v2-week-day b { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; border: 1px solid #eee8e3; border-radius: 50%; background: #fff; font-size: 11px; }
html.v2-shell .v2-week-day small { max-width: 100%; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
html.v2-shell .v2-week-day.active b { border-color: var(--v2-color-primary); background: var(--v2-color-primary); color: #fff; }
html.v2-shell .v2-week-day.today small { color: var(--v2-color-primary); font-weight: 800; }

html.v2-shell .bottom-nav {
  height: calc(var(--v2-bottom-nav-height) + env(safe-area-inset-bottom));
  padding: 4px max(12px, calc((100vw - 520px) / 2)) env(safe-area-inset-bottom);
  border-top: 1px solid rgba(65, 53, 41, .08);
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 -8px 28px rgba(78, 60, 43, .06);
  backdrop-filter: blur(18px);
}
html.v2-shell .nav-item { min-width: var(--v2-touch-target); min-height: var(--v2-touch-target); gap: 3px; color: #a69ea9; }
html.v2-shell .nav-item .ico { display: flex; width: 23px; height: 23px; align-items: center; justify-content: center; }
html.v2-shell .nav-item .ico svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
html.v2-shell .nav-item.active { color: var(--v2-color-primary); }
html.v2-shell .nav-item.active .ico { transform: translateY(-1px); }
html.v2-shell :where(button, summary, select, input, textarea, [tabindex]):focus-visible {
  outline: 3px solid rgba(255, 104, 20, .35);
  outline-offset: 3px;
}

/* Package 3: unified practice question and completion flow */
html.v2-shell.v2-practice-active main {
  width: min(100%, 520px);
  padding: 0;
}
html.v2-shell.v2-practice-active .bottom-nav { display: none !important; }
html.v2-shell.v2-practice-active #view-home > :not(#v2PracticeSurface) { display: none !important; }
html.v2-shell #confirmModal { z-index: 1200; }
html.v2-shell .v2-practice-surface {
  width: 100%;
  min-height: 100dvh;
  flex-direction: column;
  background:
    radial-gradient(circle at 95% 4%, rgba(255, 218, 177, .2), transparent 26%),
    var(--v2-color-bg);
}
html.v2-shell .v2-practice-screen {
  width: 100%;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  padding: 22px 22px calc(24px + env(safe-area-inset-bottom));
  color: #292521;
}
html.v2-shell .v2-practice-header {
  display: grid;
  grid-template-columns: 74px 1fr 58px;
  align-items: center;
  min-height: 38px;
  max-height: none;
  padding: 0;
  overflow: visible;
  background: transparent;
  color: inherit;
  text-align: left;
  transform: none;
}
html.v2-shell .v2-practice-header button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  justify-self: start;
  padding: 0;
  border: 0;
  background: transparent;
  color: #302c28;
  font: inherit;
  font-size: 14px;
  cursor: pointer;
}
html.v2-shell .v2-practice-header button svg,
html.v2-shell .v2-practice-primary svg,
html.v2-shell .v2-practice-complete-primary svg {
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
html.v2-shell .v2-practice-header h1 {
  margin: 0;
  overflow: hidden;
  font-size: 19px;
  line-height: 1.25;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html.v2-shell .v2-practice-header > strong {
  justify-self: end;
  color: #8d8884;
  font-size: 16px;
  font-weight: 500;
}
html.v2-shell .v2-practice-header > strong span { color: #6952d2; font-size: 22px; }
html.v2-shell .v2-practice-resume {
  align-self: flex-end;
  margin-top: 6px;
  color: #918a84;
  font-size: 12px;
}
html.v2-shell .v2-practice-progress {
  height: 6px;
  margin: 9px 46px 0;
  overflow: hidden;
  border-radius: 999px;
  background: #f4e8dc;
}
html.v2-shell .v2-practice-progress i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #ff6814, #ff7b24);
  transition: width .25s ease;
}
html.v2-shell .v2-practice-time {
  margin: 12px 0 0;
  color: #9a9189;
  font-size: 11px;
  text-align: center;
}
html.v2-shell .v2-practice-coach {
  min-height: 64px;
  display: grid;
  grid-template-columns: 68px 1fr;
  align-items: center;
  margin-top: 18px;
  padding: 0 15px 0 3px;
  border: 1px solid #f6dfca;
  border-radius: 18px;
  background: rgba(255, 250, 244, .86);
}
html.v2-shell .v2-practice-coach img {
  width: 76px;
  height: 76px;
  align-self: end;
  object-fit: contain;
}
html.v2-shell .v2-practice-coach p {
  margin: 0;
  color: #4c4641;
  font-size: 13px;
  line-height: 1.5;
  text-align: center;
}
html.v2-shell .v2-practice-question-card {
  margin-top: 18px;
  padding: 20px 16px 18px;
  border: 1px solid #f2e3d6;
  border-radius: 24px;
  background: rgba(255, 255, 255, .96);
  box-shadow: 0 12px 30px rgba(117, 75, 37, .07);
}
html.v2-shell .v2-practice-label {
  min-height: 28px;
  display: flex;
  align-items: center;
  gap: 9px;
  color: #9a938c;
  font-size: 11px;
}
html.v2-shell .v2-practice-label span {
  flex: 0 0 auto;
  padding: 5px 9px;
  border: 1px solid #ffd8bd;
  border-radius: 9px;
  background: #fff4eb;
  color: #f45f0d;
  font-weight: 800;
}
html.v2-shell .v2-practice-label i {
  width: 3px;
  height: 3px;
  flex: 0 0 3px;
  border-radius: 50%;
  background: #c9c2bc;
}
html.v2-shell .v2-practice-label b {
  min-width: 0;
  display: -webkit-box;
  overflow: hidden;
  font-weight: 500;
  line-height: 1.35;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
html.v2-shell .v2-practice-question-card h2 {
  margin: 17px 4px 20px;
  color: #26221f;
  font-size: clamp(18px, 5.5vw, 22px);
  line-height: 1.55;
  letter-spacing: -.02em;
  overflow-wrap: anywhere;
}
html.v2-shell .v2-practice-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
html.v2-shell .v2-practice-options button {
  min-width: 0;
  min-height: 96px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 8px;
  border: 1px solid #ece7e2;
  border-radius: 18px;
  background: #fff;
  color: #302c28;
  font: inherit;
  cursor: pointer;
}
html.v2-shell .v2-practice-options button strong { color: #f46613; font-size: 19px; }
html.v2-shell .v2-practice-options button span { max-width: 100%; font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
html.v2-shell .v2-practice-options button.selected {
  border: 2px solid #ff6814;
  background: #fff9f3;
  box-shadow: 0 6px 18px rgba(255, 104, 20, .1);
}
html.v2-shell .v2-practice-fill { display: grid; gap: 12px; }
html.v2-shell .v2-practice-fill label,
html.v2-shell .v2-practice-subjective { display: grid; gap: 7px; color: #766e67; font-size: 12px; }
html.v2-shell .v2-practice-fill input,
html.v2-shell .v2-practice-subjective textarea {
  width: 100%;
  min-height: 52px;
  padding: 13px 14px;
  border: 1px solid #e8dfd7;
  border-radius: 14px;
  background: #fff;
  color: #2d2925;
  font: inherit;
  font-size: 16px;
  outline: 0;
}
html.v2-shell .v2-practice-subjective textarea { min-height: 108px; resize: vertical; }
html.v2-shell .v2-practice-fill input:focus,
html.v2-shell .v2-practice-subjective textarea:focus { border-color: #ff6814; box-shadow: 0 0 0 3px rgba(255, 104, 20, .12); }
html.v2-shell .v2-practice-feedback {
  margin-top: 16px;
  padding: 13px 14px;
  border-radius: 14px;
  font-size: 12px;
  line-height: 1.55;
}
html.v2-shell .v2-practice-feedback.is-correct { background: #edf9f1; color: #267346; }
html.v2-shell .v2-practice-feedback.is-wrong { background: #fff3eb; color: #9e4a19; }
html.v2-shell .v2-practice-feedback strong { display: block; font-size: 13px; }
html.v2-shell .v2-practice-feedback p { margin: 5px 0 0; color: #665f59; }
html.v2-shell .v2-practice-blank-results { display: grid; gap: 5px; margin-top: 8px; }
html.v2-shell .v2-practice-blank-results span { padding: 6px 8px; border-radius: 9px; background: rgba(255, 255, 255, .62); color: #645d57; }
html.v2-shell .v2-practice-blank-results span.is-correct { color: #267346; }
html.v2-shell .v2-practice-blank-results span.is-wrong { color: #9e4a19; }
html.v2-shell .v2-practice-primary {
  width: 100%;
  min-height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 25px;
  margin-top: 20px;
  border: 0;
  border-radius: 18px;
  background: linear-gradient(100deg, #ff6610, #ff7918 55%, #ff5d0b);
  box-shadow: 0 12px 24px rgba(255, 101, 13, .2);
  color: #fff;
  font: inherit;
  font-size: 16px;
  font-weight: 800;
  cursor: pointer;
}
html.v2-shell .v2-practice-skip {
  align-self: center;
  min-height: 44px;
  margin-top: 5px;
  padding: 0 12px;
  border: 0;
  background: transparent;
  color: #6751d1;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
html.v2-shell .v2-practice-error { min-height: 20px; margin-top: 4px; color: #c24132; font-size: 12px; text-align: center; }

html.v2-shell .v2-practice-complete {
  width: 100%;
  min-height: 100dvh;
  position: relative;
  overflow: hidden;
  padding: 25px 24px calc(24px + env(safe-area-inset-bottom));
  color: #292521;
}
html.v2-shell .v2-practice-brand { display: flex; align-items: flex-start; gap: 9px; }
html.v2-shell .v2-practice-brand > div { display: flex; flex-direction: column; }
html.v2-shell .v2-practice-brand strong { font-size: 18px; line-height: 1.1; }
html.v2-shell .v2-practice-brand strong span { font-size: 15px; }
html.v2-shell .v2-practice-brand small { margin-top: 5px; color: #9b8d80; font-size: 10px; }
html.v2-shell .v2-practice-complete-hero { height: 276px; position: relative; margin-top: 58px; }
html.v2-shell .v2-practice-complete-label { display: inline-flex; align-items: center; gap: 8px; color: #25221f; font-size: 17px; font-weight: 800; }
html.v2-shell .v2-practice-complete-label svg { width: 22px; height: 22px; fill: none; stroke: #ff6410; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
html.v2-shell .v2-practice-complete-hero h1 {
  position: relative;
  z-index: 2;
  margin: 24px 0 0;
  font-size: 34px;
  line-height: 1.12;
  letter-spacing: -1.5px;
}
html.v2-shell .v2-practice-complete-hero h2 {
  width: min(67%, 245px);
  min-height: 78px;
  position: relative;
  z-index: 2;
  display: -webkit-box;
  overflow: hidden;
  margin: 14px 0 0;
  color: #ff5d0b;
  font-size: clamp(25px, 7.5vw, 31px);
  line-height: 1.3;
  letter-spacing: -1px;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
html.v2-shell .v2-practice-complete-hero img {
  width: 190px;
  height: 190px;
  position: absolute;
  z-index: 1;
  right: -28px;
  bottom: 49px;
  object-fit: contain;
  filter: drop-shadow(0 14px 22px rgba(183, 92, 18, .13));
}
html.v2-shell .v2-practice-complete-hero.has-long-topic { height: 292px; }
html.v2-shell .v2-practice-complete-hero.has-long-topic h2 {
  width: 62%;
  min-height: 94px;
  font-size: clamp(21px, 6.1vw, 25px);
  line-height: 1.24;
  -webkit-line-clamp: 3;
}
html.v2-shell .v2-practice-complete-hero.has-long-topic img {
  right: -45px;
  bottom: 43px;
  width: 168px;
  height: 168px;
}
html.v2-shell .v2-practice-result-card {
  position: relative;
  z-index: 3;
  margin-top: -70px;
  padding: 20px 18px 17px;
  border: 1px solid #f7eadc;
  border-radius: 26px;
  background: rgba(255, 255, 255, .95);
  box-shadow: 0 13px 32px rgba(157, 91, 27, .1);
}
html.v2-shell .v2-practice-metrics { display: grid; grid-template-columns: 1fr 1px 1fr; align-items: center; gap: 12px; }
html.v2-shell .v2-practice-metrics > i { width: 1px; height: 52px; background: #f1e5da; }
html.v2-shell .v2-practice-metrics > div { display: grid; grid-template-columns: 45px 1fr; align-items: center; gap: 8px; }
html.v2-shell .v2-practice-metrics > div > span {
  width: 45px;
  height: 45px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #fff5eb;
  color: #f26a14;
  font-size: 22px;
}
html.v2-shell .v2-practice-metrics > div > span svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
html.v2-shell .v2-practice-metrics p { display: flex; flex-direction: column; gap: 2px; margin: 0; color: #3b3631; font-size: 11px; }
html.v2-shell .v2-practice-metrics strong { color: #27231f; font-size: 17px; white-space: nowrap; }
html.v2-shell .v2-practice-metrics strong b { color: #ff5f0d; font-size: 28px; }
html.v2-shell .v2-practice-insight {
  display: grid;
  grid-template-columns: 38px 1fr;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  padding: 13px;
  border-radius: 17px;
  background: #fff8ef;
}
html.v2-shell .v2-practice-insight > span { color: #f07817; font-size: 26px; text-align: center; }
html.v2-shell .v2-practice-insight > span svg { width: 29px; height: 29px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
html.v2-shell .v2-practice-insight p { display: flex; min-width: 0; flex-direction: column; gap: 4px; margin: 0; }
html.v2-shell .v2-practice-insight strong { font-size: 13px; }
html.v2-shell .v2-practice-insight small { color: #6f6760; font-size: 11px; line-height: 1.4; }
html.v2-shell .v2-practice-complete-primary {
  width: 100%;
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 34px;
  margin-top: 27px;
  padding-left: 24px;
  border: 0;
  border-radius: 19px;
  background: linear-gradient(100deg, #ff6610, #ff7918 55%, #ff5d0b);
  box-shadow: 0 13px 25px rgba(255, 99, 12, .22);
  color: #fff;
  font: inherit;
  font-size: 16px;
  font-weight: 800;
  cursor: pointer;
}
html.v2-shell .v2-practice-complete-links { display: flex; justify-content: center; gap: 10px; margin-top: 13px; }
html.v2-shell .v2-practice-complete-links button {
  min-height: 44px;
  padding: 0 8px;
  border: 0;
  background: transparent;
  color: #6653d7;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
}
html.v2-shell .v2-practice-details-backdrop {
  position: fixed;
  z-index: 90;
  inset: 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 16px;
  background: rgba(35, 28, 22, .42);
}
html.v2-shell .v2-practice-details-backdrop.hidden { display: none; }
html.v2-shell .v2-practice-details {
  width: min(100%, 480px);
  max-height: 82dvh;
  position: relative;
  overflow: auto;
  padding: 24px 20px calc(20px + env(safe-area-inset-bottom));
  border-radius: 26px 26px 18px 18px;
  background: #fff;
}
html.v2-shell .v2-practice-details h2 { margin: 0; font-size: 20px; }
html.v2-shell .v2-practice-details > p { margin: 5px 0 15px; color: #8a8179; font-size: 12px; }
html.v2-shell .v2-practice-details-close { position: absolute; top: 15px; right: 15px; min-width: 44px; min-height: 44px; border: 0; background: transparent; color: #746b64; font-size: 25px; }
html.v2-shell .v2-practice-details ul { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
html.v2-shell .v2-practice-details li { display: grid; grid-template-columns: 28px 1fr; gap: 9px; padding: 12px; border-radius: 14px; background: #fff9f3; }
html.v2-shell .v2-practice-details li > span { color: #f36512; font-size: 18px; font-weight: 800; }
html.v2-shell .v2-practice-details li strong { display: block; font-size: 13px; line-height: 1.45; }
html.v2-shell .v2-practice-details li p { margin: 4px 0; color: #675f59; font-size: 12px; }
html.v2-shell .v2-practice-details li small { color: #8b827a; font-size: 11px; line-height: 1.5; }
html.v2-shell .v2-practice-details-done { width: 100%; min-height: 48px; margin-top: 16px; border: 0; border-radius: 15px; background: #fff1e6; color: #e95708; font: inherit; font-weight: 800; }

@media (max-width: 360px) {
  html.v2-shell .v2-practice-screen { padding-inline: 16px; }
  html.v2-shell .v2-practice-header { grid-template-columns: 66px 1fr 51px; }
  html.v2-shell .v2-practice-header h1 { font-size: 17px; }
  html.v2-shell .v2-practice-coach { margin-top: 13px; }
  html.v2-shell .v2-practice-question-card { margin-top: 13px; padding: 17px 13px 15px; }
  html.v2-shell .v2-practice-question-card h2 { margin-block: 13px 16px; font-size: 18px; }
  html.v2-shell .v2-practice-options button { min-height: 82px; }
  html.v2-shell .v2-practice-complete { padding-inline: 19px; }
  html.v2-shell .v2-practice-complete-hero { height: 260px; margin-top: 43px; }
  html.v2-shell .v2-practice-complete-hero h1 { margin-top: 21px; font-size: 30px; }
  html.v2-shell .v2-practice-complete-hero h2 { width: 70%; font-size: 25px; }
  html.v2-shell .v2-practice-complete-hero img { width: 170px; height: 170px; right: -31px; bottom: 47px; }
  html.v2-shell .v2-practice-result-card { margin-top: -65px; padding-inline: 15px; }
  html.v2-shell .v2-practice-metrics { gap: 8px; }
  html.v2-shell .v2-practice-metrics > div { grid-template-columns: 39px 1fr; gap: 6px; }
  html.v2-shell .v2-practice-metrics > div > span { width: 39px; height: 39px; font-size: 19px; }
  html.v2-shell .v2-practice-metrics strong { font-size: 15px; }
  html.v2-shell .v2-practice-metrics strong b { font-size: 25px; }
  html.v2-shell .v2-practice-complete-primary { min-height: 55px; margin-top: 22px; gap: 24px; font-size: 15px; }
}

/* Package 2: public activation and authentication */
html.v2-shell.v2-session-pending main,
html.v2-shell.v2-session-pending .bottom-nav,
html.v2-shell.v2-public-active main,
html.v2-shell.v2-public-active .bottom-nav,
html.v2-shell.v2-auth-active main,
html.v2-shell.v2-auth-active .bottom-nav,
html.v2-shell.v2-onboarding-active main,
html.v2-shell.v2-onboarding-active .bottom-nav,
html.v2-shell.v2-diagnostic-active main,
html.v2-shell.v2-diagnostic-active .bottom-nav { display: none !important; }
html.v2-shell.v2-public-active,
html.v2-shell.v2-auth-active,
html.v2-shell.v2-onboarding-active,
html.v2-shell.v2-diagnostic-active { background: var(--v2-color-bg); }
html.v2-shell .v2-wechat-only { display: none !important; }
html.v2-shell.v2-wechat-available .v2-wechat-only:not(.hidden) { display: flex !important; }

html.v2-shell .v2-public-landing,
html.v2-shell .v2-auth-screen {
  width: min(100%, 520px);
  min-height: 100dvh;
  margin: 0 auto;
  color: #302923;
  background: var(--v2-color-bg);
}
html.v2-shell .v2-public-landing {
  flex-direction: column;
  padding: 21px 20px 14px;
}
html.v2-shell .v2-public-brand,
html.v2-shell .v2-auth-brand { display: flex; align-items: flex-start; gap: 9px; }
html.v2-shell header.v2-public-brand {
  max-height: none;
  padding: 0;
  overflow: visible;
  background: transparent;
  color: inherit;
  text-align: left;
  transform: none;
}
html.v2-shell .v2-brand-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: var(--v2-color-primary);
  color: #fff;
}
html.v2-shell .v2-brand-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
html.v2-shell .v2-public-brand .v2-brand-icon { width: 33px; height: 33px; flex-basis: 33px; border-radius: 9px; }
html.v2-shell .v2-public-brand .v2-brand-icon svg { width: 22px; height: 22px; }
html.v2-shell .v2-public-brand > div,
html.v2-shell .v2-auth-brand > div { min-width: 0; display: flex; flex-direction: column; }
html.v2-shell .v2-public-brand strong,
html.v2-shell .v2-auth-brand strong { white-space: nowrap; font-size: 18px; line-height: 1.1; }
html.v2-shell .v2-public-brand strong span,
html.v2-shell .v2-auth-brand strong span { font-size: 15px; }
html.v2-shell .v2-auth-brand strong em { margin-left: 5px; color: #aaa29b; font-size: 9px; font-style: normal; font-weight: 500; }
html.v2-shell .v2-public-brand small,
html.v2-shell .v2-auth-brand small { margin-top: 5px; color: #9b8d80; font-size: 10px; }

html.v2-shell .v2-public-hero { height: 200px; position: relative; margin-top: 12px; }
html.v2-shell .v2-public-hero > div { position: relative; z-index: 2; width: 235px; padding-top: 9px; }
html.v2-shell .v2-public-hero h1 { margin: 0; color: #292522; font-size: 22px; line-height: 1.36; letter-spacing: -1px; }
html.v2-shell .v2-public-hero h1 strong { display: block; color: #f5600e; font-size: 28px; }
html.v2-shell .v2-public-hero p { width: 205px; margin: 11px 0 0; color: #706760; font-size: 12px; line-height: 1.55; }
html.v2-shell .v2-public-assurance { display: inline-flex; align-items: center; gap: 5px; margin-top: 9px; color: #7657d2; font-size: 10px; font-weight: 700; }
html.v2-shell .v2-public-assurance svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; }
html.v2-shell .v2-public-hero img { width: 181px; height: 181px; position: absolute; right: -12px; bottom: 5px; object-fit: contain; }

html.v2-shell .v2-public-feedback {
  min-height: 285px;
  margin-top: 5px;
  padding: 14px 15px 13px;
  border: 1px solid #f4dcc2;
  border-radius: 23px;
  background: #fff;
  box-shadow: 0 9px 25px rgba(190, 115, 40, .08);
}
html.v2-shell .v2-feedback-label { width: max-content; padding: 5px 10px; border-radius: 999px; background: #fff4e9; color: #a54d19; font-size: 11px; font-weight: 800; }
html.v2-shell .v2-feedback-summary { min-height: 92px; display: grid; grid-template-columns: minmax(0, 1fr) 82px; align-items: center; gap: 15px; margin-top: 12px; }
html.v2-shell .v2-feedback-summary > div:first-child > small { color: #4c4037; font-size: 11px; font-weight: 700; }
html.v2-shell .v2-feedback-summary h2 { margin: 3px 0 0; color: #f26917; font-size: 27px; line-height: 1.15; letter-spacing: -1px; }
html.v2-shell .v2-feedback-summary p { width: max-content; margin: 8px 0 0; padding: 5px 8px; border-radius: 999px; background: #fff4e9; color: #795f4c; font-size: 10px; }
html.v2-shell .v2-feedback-summary p strong { color: #f26917; font-size: 13px; }
html.v2-shell .v2-feedback-score { width: 76px; height: 76px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 5px solid #f47a27; border-radius: 50%; background: #fff; color: #ef6815; }
html.v2-shell .v2-feedback-score strong { font-size: 22px; line-height: 1; }
html.v2-shell .v2-feedback-score strong small { font-size: 9px; }
html.v2-shell .v2-feedback-score span { margin-top: 4px; color: #8d8075; font-size: 8px; }
html.v2-shell .v2-feedback-next { min-height: 66px; display: grid; grid-template-columns: 38px minmax(0, 1fr) 17px; align-items: center; gap: 9px; margin-top: 12px; padding-top: 11px; border-top: 1px solid #eee5dc; }
html.v2-shell .v2-feedback-target { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 14px; background: #f0ebff; color: #7257ce; font-size: 24px; }
html.v2-shell .v2-feedback-next > div { min-width: 0; display: flex; flex-direction: column; }
html.v2-shell .v2-feedback-next small { color: #7257ce; font-size: 9px; }
html.v2-shell .v2-feedback-next strong { margin-top: 1px; font-size: 12px; }
html.v2-shell .v2-feedback-next p { margin: 2px 0 0; overflow: hidden; color: #91877e; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
html.v2-shell .v2-feedback-insight { min-height: 43px; display: flex; align-items: center; gap: 7px; margin-top: 8px; padding: 7px 10px; border: 1px solid #f2dcc8; border-radius: 12px; background: #fffaf5; color: #847267; font-size: 9px; line-height: 1.35; }
html.v2-shell .v2-feedback-insight b { color: #e76b18; font-size: 18px; }

html.v2-shell .v2-public-trust { display: grid; gap: 4px; margin-top: 9px; }
html.v2-shell .v2-public-trust > div { min-height: 39px; display: grid; grid-template-columns: 33px minmax(0, 1fr); align-items: center; gap: 7px; padding: 3px 10px; }
html.v2-shell .v2-public-trust > div > span { width: 33px; height: 33px; display: grid; place-items: center; border-radius: 11px; background: #ece6ff; color: #7256ce; }
html.v2-shell .v2-public-trust p { display: flex; min-width: 0; flex-direction: column; gap: 2px; margin: 0; }
html.v2-shell .v2-public-trust strong { font-size: 11px; line-height: 1.25; }
html.v2-shell .v2-public-trust small { overflow: hidden; color: #8d8279; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }

html.v2-shell .v2-public-actions { margin-top: 10px; }
html.v2-shell .v2-primary,
html.v2-shell .v2-secondary,
html.v2-shell .v2-wechat { width: 100%; min-height: 50px; display: flex; align-items: center; justify-content: center; gap: 10px; border-radius: 16px; cursor: pointer; font: inherit; font-size: 15px; font-weight: 800; }
html.v2-shell .v2-primary { border: 0; background: linear-gradient(135deg, #ff781e, #ff5f0d); box-shadow: 0 9px 22px rgba(255, 104, 20, .22); color: #fff; }
html.v2-shell .v2-primary:disabled { cursor: wait; opacity: .7; }
html.v2-shell .v2-secondary { min-height: 39px; margin-top: 7px; border: 1px solid #f2b784; background: #fffdfa; color: #ed6413; font-size: 12px; }
html.v2-shell .v2-link,
html.v2-shell .v2-resend { min-height: var(--v2-touch-target); display: flex; align-items: center; justify-content: center; gap: 3px; margin: 3px auto 0; padding: 0 8px; border: 0; background: transparent; color: #7357cc; cursor: pointer; font: inherit; font-size: 11px; }

html.v2-shell .v2-auth-screen { position: relative; flex-direction: column; overflow-x: hidden; padding: 26px 26px 72px; background: radial-gradient(circle at 96% 2%, rgba(255, 214, 163, .3), transparent 30%), radial-gradient(circle at 2% 48%, rgba(255, 237, 215, .38), transparent 26%), var(--v2-color-bg); }
html.v2-shell .v2-welcome-hero { height: 267px; position: relative; margin: 9px -26px 0; overflow: hidden; }
html.v2-shell .v2-welcome-hero::after { position: absolute; right: 22px; bottom: 23px; left: 22px; height: 1px; background: linear-gradient(90deg, transparent, #f4d9bb, transparent); content: ""; }
html.v2-shell .v2-welcome-hero img { width: 275px; height: 275px; display: block; margin: 5px auto 0; object-fit: contain; filter: drop-shadow(0 16px 24px rgba(179, 91, 17, .12)); }
html.v2-shell .v2-welcome-copy { margin-top: -2px; text-align: center; }
html.v2-shell .v2-welcome-copy h1 { margin: 0; color: #292724; font-size: 30px; line-height: 1.34; letter-spacing: -1.5px; }
html.v2-shell .v2-welcome-copy h1 strong,
html.v2-shell .v2-welcome-copy h1 span { color: var(--v2-color-primary); font-size: 39px; }
html.v2-shell .v2-welcome-copy h1 span { margin-left: 4px; font-size: inherit; }
html.v2-shell .v2-welcome-copy p { margin: 13px 0 0; color: #827a73; font-size: 13px; }
html.v2-shell .v2-auth-actions { margin-top: 24px; }
html.v2-shell .v2-wechat { margin-top: 12px; border: 1px solid #ece5de; background: rgba(255, 255, 255, .82); box-shadow: 0 6px 16px rgba(91, 58, 25, .05); color: #22ad4a; }
html.v2-shell .v2-wechat.outline { min-height: 50px; margin-top: 11px; border-color: #ffc499; box-shadow: none; color: #ff6a14; font-size: 15px; }
html.v2-shell .v2-auth-agreement { position: absolute; right: 16px; bottom: max(17px, env(safe-area-inset-bottom)); left: 16px; margin: 0; color: #9c938b; font-size: 10px; text-align: center; white-space: nowrap; }
html.v2-shell .v2-auth-agreement button { padding: 0; border: 0; background: transparent; color: #7564cf; cursor: pointer; font: inherit; }

html.v2-shell .v2-auth-phone { padding: 22px 25px 70px; }
html.v2-shell .v2-auth-back { width: max-content; min-height: 30px; display: flex; align-items: center; gap: 10px; padding: 0; border: 0; background: transparent; color: #2d2a27; cursor: pointer; font: inherit; font-size: 24px; font-weight: 800; }
html.v2-shell .v2-auth-back span { font-size: 17px; }
html.v2-shell .v2-auth-brand.compact { margin-top: 27px; }
html.v2-shell .v2-auth-brand.compact .v2-brand-icon { width: 34px; height: 34px; flex-basis: 34px; }
html.v2-shell .v2-auth-brand.compact strong { font-size: 18px; }
html.v2-shell .v2-phone-heading { min-height: 130px; display: grid; grid-template-columns: 1fr 112px; align-items: end; gap: 3px; margin-top: 25px; }
html.v2-shell .v2-phone-heading h1 { margin: 0; color: #292724; font-size: 26px; line-height: 1.38; letter-spacing: -1.2px; }
html.v2-shell .v2-phone-heading p { grid-column: 1 / -1; margin: 10px 0 0; color: #827a73; font-size: 12px; }
html.v2-shell .v2-phone-heading img { width: 112px; height: 112px; display: block; align-self: end; object-fit: contain; filter: drop-shadow(0 11px 18px rgba(178, 91, 14, .1)); }
html.v2-shell .v2-phone-stage,
html.v2-shell .v2-code-stage { margin-top: 25px; }
html.v2-shell .v2-phone-field { height: 64px; display: grid; grid-template-columns: 64px 1fr; align-items: center; padding: 0 17px; border: 1.5px solid #ffcda9; border-radius: 18px; background: rgba(255, 255, 255, .8); box-shadow: 0 8px 18px rgba(94, 59, 24, .04); }
html.v2-shell .v2-phone-field > span { position: relative; color: #302d29; font-size: 17px; font-weight: 700; }
html.v2-shell .v2-phone-field > span::after { position: absolute; top: -4px; right: 0; width: 1px; height: 28px; background: #e8dfd7; content: ""; }
html.v2-shell .v2-phone-field input { width: 100%; height: 45px; min-width: 0; padding: 0 0 0 18px; border: 0; outline: 0; background: transparent; color: #302d29; font: inherit; font-size: 16px; }
html.v2-shell .v2-phone-stage .v2-primary,
html.v2-shell .v2-code-stage .v2-primary { margin-top: 15px; }
html.v2-shell .v2-phone-stage > p { margin: 12px 2px 0; color: #9a9189; font-size: 11px; line-height: 1.5; text-align: center; }
html.v2-shell .v2-code-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; color: #8c8279; font-size: 11px; }
html.v2-shell .v2-code-heading button { padding: 0; border: 0; background: transparent; color: #7564cf; cursor: pointer; font: inherit; font-size: 11px; }
html.v2-shell .v2-code-input-shell { position: relative; }
html.v2-shell .v2-code-field { position: absolute; z-index: 2; inset: 0; cursor: text; }
html.v2-shell .v2-code-field input { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: transparent; caret-color: transparent; opacity: .01; font-size: 16px; cursor: text; }
html.v2-shell .v2-code-slots { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; pointer-events: none; }
html.v2-shell .v2-code-slots span { height: 49px; display: grid; place-items: center; border: 1.5px solid #f0ded0; border-radius: 12px; background: #fff; color: #302d29; font-size: 19px; font-weight: 800; }
html.v2-shell .v2-code-field:focus-within + .v2-code-slots span { border-color: #ffb783; box-shadow: 0 0 0 2px rgba(255, 105, 20, .08); }
html.v2-shell .v2-code-slots span.filled { border-color: #ff9a5b; background: #fff8f1; }
html.v2-shell .v2-resend:disabled { color: #aaa19a; cursor: default; }
html.v2-shell .v2-auth-error { margin: 12px 0 0; padding: 10px 12px; border-radius: 12px; background: #fff0ed; color: #c7392f; font-size: 12px; }
html.v2-shell .v2-auth-divider { height: 20px; display: flex; align-items: center; gap: 14px; margin-top: 19px; color: #aaa099; font-size: 12px; }
html.v2-shell .v2-auth-divider::before,
html.v2-shell .v2-auth-divider::after { height: 1px; flex: 1; background: #e8e0d9; content: ""; }

html.v2-shell .v2-sheet-backdrop { position: fixed; z-index: 1200; inset: 0; align-items: flex-end; justify-content: center; padding: 18px; background: rgba(45, 36, 30, .36); }
html.v2-shell .v2-sheet { width: min(100%, 430px); position: relative; padding: 27px 22px 22px; border-radius: 25px; background: #fff; box-shadow: 0 24px 70px rgba(55, 42, 31, .22); }
html.v2-shell .v2-sheet-close { width: 40px; height: 40px; position: absolute; top: 10px; right: 10px; border: 0; border-radius: 50%; background: #f6f2ee; color: #665d56; cursor: pointer; font-size: 22px; }
html.v2-shell .v2-sheet-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 15px; background: var(--v2-color-secondary); color: #fff; font-size: 22px; }
html.v2-shell .v2-sheet h2 { margin: 15px 0 0; font-size: 20px; }
html.v2-shell .v2-sheet > p { margin: 9px 0 0; color: #756d67; font-size: 13px; line-height: 1.65; }
html.v2-shell .v2-sheet ul { display: grid; gap: 10px; margin: 16px 0 0; padding: 0; list-style: none; }
html.v2-shell .v2-sheet li { color: #4f4741; font-size: 12px; }
html.v2-shell .v2-sheet li::before { margin-right: 8px; color: #34a554; content: "✓"; font-weight: 900; }
html.v2-shell .v2-sheet .v2-primary { margin-top: 18px; }

/* Package 2: progressive child profile and first diagnostic */
html.v2-shell .v2-onboarding-screen,
html.v2-shell .v2-diagnostic-screen {
  width: min(100%, 520px);
  min-height: 100dvh;
  margin: 0 auto;
  flex-direction: column;
  color: #302923;
  background:
    radial-gradient(circle at 100% 0, rgba(255, 216, 177, .28), transparent 18rem),
    var(--v2-color-bg);
}
html.v2-shell .v2-onboarding-screen { padding: 22px 20px max(24px, env(safe-area-inset-bottom)); }
html.v2-shell header.v2-flow-header { max-height: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0; overflow: visible; background: transparent; color: inherit; text-align: left; transform: none; }
html.v2-shell .v2-flow-header .v2-auth-brand.compact { margin-top: 0; }
html.v2-shell .v2-flow-step { padding: 7px 11px; border-radius: 999px; background: #fff1e6; color: #bd5315; font-size: 11px; font-weight: 800; }
html.v2-shell .v2-onboarding-panel { width: 100%; display: flex; flex: 1; flex-direction: column; }
html.v2-shell .v2-onboarding-panel.hidden { display: none; }
html.v2-shell .v2-onboarding-heading { min-height: 190px; display: grid; grid-template-columns: minmax(0, 1fr) 135px; align-items: center; gap: 2px; padding-top: 20px; }
html.v2-shell .v2-onboarding-heading > div { min-width: 0; }
html.v2-shell .v2-onboarding-heading span { color: var(--v2-color-primary); font-size: 12px; font-weight: 900; }
html.v2-shell .v2-onboarding-heading h1 { margin: 8px 0 0; font-size: 28px; line-height: 1.25; letter-spacing: -1px; }
html.v2-shell .v2-onboarding-heading p { margin: 9px 0 0; color: #81776f; font-size: 12px; line-height: 1.6; }
html.v2-shell .v2-onboarding-heading img { width: 135px; height: 135px; object-fit: contain; }
html.v2-shell .v2-onboarding-heading.textbook { min-height: 152px; grid-template-columns: 1fr; padding: 16px 3px 10px; }
html.v2-shell .v2-onboarding-card { display: grid; gap: 16px; padding: 19px; border: 1px solid #f3e3d4; border-radius: 22px; background: rgba(255, 255, 255, .9); box-shadow: var(--v2-shadow-card); }
html.v2-shell .v2-onboarding-card label { min-width: 0; display: grid; gap: 8px; }
html.v2-shell .v2-onboarding-card label > span { color: #5f554d; font-size: 12px; font-weight: 800; }
html.v2-shell .v2-onboarding-card input,
html.v2-shell .v2-onboarding-card select { width: 100%; min-width: 0; height: 52px; padding: 0 14px; border: 1.5px solid #eadfd5; border-radius: 14px; outline: 0; background: #fff; color: #342e29; font: inherit; font-size: 15px; }
html.v2-shell .v2-onboarding-card input:focus,
html.v2-shell .v2-onboarding-card select:focus { border-color: #ff9c5d; box-shadow: 0 0 0 3px rgba(255, 104, 20, .1); }
html.v2-shell .v2-field-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .85fr); gap: 12px; }
html.v2-shell .v2-onboarding-panel > .v2-primary { margin-top: auto; }
html.v2-shell .v2-flow-back { width: max-content; min-height: 42px; margin-top: 12px; padding: 0 8px 0 0; border: 0; background: transparent; color: #6f5dc6; cursor: pointer; font: inherit; font-size: 13px; font-weight: 800; }
html.v2-shell .v2-textbook-options { display: grid; gap: 10px; margin: 0 0 22px; padding: 0; border: 0; }
html.v2-shell .v2-textbook-options label { min-height: 67px; display: grid; grid-template-columns: 1fr 28px; align-items: center; gap: 10px; padding: 10px 14px 10px 17px; border: 1.5px solid #ece3db; border-radius: 17px; background: #fff; cursor: pointer; }
html.v2-shell .v2-textbook-options label:has(input:checked) { border-color: #ff8a42; background: #fff8f1; box-shadow: 0 5px 16px rgba(255, 104, 20, .08); }
html.v2-shell .v2-textbook-options label.uncertain { border-style: dashed; }
html.v2-shell .v2-textbook-options input { position: absolute; width: 1px; height: 1px; opacity: 0; }
html.v2-shell .v2-textbook-options span { display: flex; flex-direction: column; gap: 4px; }
html.v2-shell .v2-textbook-options b { font-size: 14px; }
html.v2-shell .v2-textbook-options small { color: #91877f; font-size: 10px; }
html.v2-shell .v2-textbook-options em { width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid #e2d9d1; border-radius: 50%; color: transparent; font-size: 12px; font-style: normal; }
html.v2-shell .v2-textbook-options input:checked ~ em { border-color: var(--v2-color-primary); background: var(--v2-color-primary); color: #fff; }
html.v2-shell .v2-flow-error { margin: 10px 0; padding: 10px 12px; border-radius: 12px; background: #fff0ed; color: #b9362f; font-size: 12px; line-height: 1.5; }
html.v2-shell .v2-onboarding-success { align-items: center; justify-content: center; text-align: center; }
html.v2-shell .v2-onboarding-success > img { width: 210px; height: 210px; margin: -45px 0 -16px; object-fit: contain; }
html.v2-shell .v2-success-check { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: #3cad64; box-shadow: 0 8px 17px rgba(60, 173, 100, .2); color: #fff; font-size: 23px; font-weight: 900; }
html.v2-shell .v2-onboarding-success h1 { margin: 15px 0 0; font-size: 27px; }
html.v2-shell .v2-onboarding-success > p { margin: 10px auto 0; color: #7e756e; font-size: 13px; line-height: 1.65; }
html.v2-shell .v2-success-note { width: 100%; display: flex; flex-direction: column; gap: 4px; margin: 24px 0 20px; padding: 15px; border-radius: 17px; background: #f1edff; color: #6652b4; }
html.v2-shell .v2-success-note b { font-size: 14px; }
html.v2-shell .v2-success-note span { font-size: 11px; }
html.v2-shell .v2-onboarding-success > .v2-primary { margin-top: 0; }

html.v2-shell .v2-diagnostic-screen { position: relative; padding: 18px 18px max(18px, env(safe-area-inset-bottom)); }
html.v2-shell header.v2-diagnostic-header { min-height: 48px; max-height: none; display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; padding: 0; overflow: visible; background: transparent; color: inherit; text-align: center; transform: none; }
html.v2-shell .v2-diagnostic-header button { width: 42px; height: 42px; display: grid; place-items: center; border: 0; border-radius: 50%; background: #fff4e9; color: #7a6e65; cursor: pointer; font-size: 24px; }
html.v2-shell .v2-diagnostic-header > div { display: flex; flex-direction: column; gap: 2px; }
html.v2-shell .v2-diagnostic-header strong { font-size: 16px; }
html.v2-shell .v2-diagnostic-header small { color: #8a8078; font-size: 9px; }
html.v2-shell .v2-diagnostic-header > span { color: #9a8f87; font-size: 12px; font-weight: 800; }
html.v2-shell .v2-diagnostic-progress { height: 7px; margin: 12px 4px 0; overflow: hidden; border-radius: 999px; background: #f0e8df; }
html.v2-shell .v2-diagnostic-progress span { width: 33.333%; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, #ff934f, var(--v2-color-primary)); transition: width .25s ease; }
html.v2-shell .v2-diagnostic-body { display: flex; flex: 1; flex-direction: column; }
html.v2-shell .v2-diagnostic-coach { min-height: 72px; display: grid; grid-template-columns: 58px minmax(0, 1fr); align-items: center; gap: 8px; margin-top: 14px; padding: 5px 13px 5px 6px; border-radius: 18px; background: #fff1e6; color: #825f45; font-size: 11px; line-height: 1.55; }
html.v2-shell .v2-diagnostic-coach img { width: 58px; height: 58px; object-fit: contain; }
html.v2-shell .v2-diagnostic-card { flex: 1; display: flex; flex-direction: column; margin-top: 13px; padding: 21px 19px; border: 1px solid #f0e1d3; border-radius: 24px; background: #fff; box-shadow: var(--v2-shadow-card); }
html.v2-shell .v2-diagnostic-kicker { display: flex; align-items: center; justify-content: space-between; color: var(--v2-color-primary); font-size: 11px; font-weight: 900; }
html.v2-shell .v2-diagnostic-kicker small { color: #968b83; font-size: 9px; font-weight: 500; }
html.v2-shell .v2-diagnostic-stem { min-height: 100px; display: flex; align-items: center; margin: 10px 0 14px; color: #2f2925; font-size: clamp(18px, 5.2vw, 22px); font-weight: 850; line-height: 1.65; overflow-wrap: anywhere; }
html.v2-shell .v2-diagnostic-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; margin-top: auto; }
html.v2-shell .v2-diagnostic-option { min-height: 76px; display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; gap: 8px; padding: 10px 12px; border: 1.5px solid #e9e0d8; border-radius: 16px; background: #fffdfb; color: #3f3833; cursor: pointer; font: inherit; font-size: 15px; font-weight: 750; text-align: left; overflow-wrap: anywhere; }
html.v2-shell .v2-diagnostic-option b { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 9px; background: #f3eee9; color: #7a6f66; font-size: 12px; }
html.v2-shell .v2-diagnostic-option:disabled { cursor: default; opacity: 1; }
html.v2-shell .v2-diagnostic-option.selected { border-color: #ff8a43; background: #fff7ef; }
html.v2-shell .v2-diagnostic-option.correct { border-color: #4aaf6e; background: #effaf2; color: #27834a; }
html.v2-shell .v2-diagnostic-option.wrong { border-color: #e97368; background: #fff1ef; color: #b7463d; }
html.v2-shell .v2-diagnostic-feedback { margin-top: 11px; padding: 13px 15px; border-radius: 16px; background: #effaf2; color: #3c7350; font-size: 12px; line-height: 1.6; }
html.v2-shell .v2-diagnostic-feedback.wrong { background: #fff4ed; color: #8b5b3a; }
html.v2-shell .v2-diagnostic-feedback strong { display: block; margin-bottom: 3px; font-size: 14px; }
html.v2-shell .v2-diagnostic-footer { padding-top: 11px; }
html.v2-shell .v2-diagnostic-summary { flex: 1; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
html.v2-shell .v2-diagnostic-summary:not(.hidden) { display: flex; }
html.v2-shell .v2-diagnostic-summary > img { width: 190px; height: 190px; margin: -28px 0 -15px; object-fit: contain; }
html.v2-shell .v2-diagnostic-summary h1 { margin: 6px 0 0; color: #2f2925; font-size: 27px; }
html.v2-shell .v2-diagnostic-summary > p { margin: 9px 0 0; color: #837970; font-size: 12px; }
html.v2-shell .v2-diagnostic-score { display: flex; align-items: baseline; gap: 3px; margin-top: 15px; color: var(--v2-color-primary); }
html.v2-shell .v2-diagnostic-score strong { font-size: 48px; line-height: 1; }
html.v2-shell .v2-diagnostic-score span { color: #9a8e84; font-size: 14px; }
html.v2-shell .v2-diagnostic-advice { width: 100%; margin: 19px 0 16px; padding: 16px; border: 1px solid #e4dcff; border-radius: 19px; background: #f5f2ff; color: #5d4da1; text-align: left; }
html.v2-shell .v2-diagnostic-advice small { font-size: 10px; }
html.v2-shell .v2-diagnostic-advice strong { display: block; margin-top: 5px; font-size: 17px; line-height: 1.45; overflow-wrap: anywhere; }
html.v2-shell .v2-diagnostic-advice p { margin: 6px 0 0; color: #796db0; font-size: 11px; line-height: 1.55; }
html.v2-shell .v2-diagnostic-summary .v2-primary { width: 100%; }

/* Package 3: priority-first wrongbook and evidence-first reinforcement plan */
html.v2-shell .v2-wrongbook-brand-row { min-height: 48px; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 17px; }
html.v2-shell .v2-wrongbook-brand { min-width: 0; display: flex; align-items: center; gap: 9px; }
html.v2-shell .v2-wrongbook-brand .v2-brand-icon { width: 42px; height: 42px; flex: 0 0 auto; }
html.v2-shell .v2-wrongbook-brand > p { min-width: 0; display: flex; flex-direction: column; gap: 5px; margin: 0; }
html.v2-shell .v2-wrongbook-brand strong { white-space: nowrap; font-size: 17px; }
html.v2-shell .v2-wrongbook-brand strong span { font-size: 13px; }
html.v2-shell .v2-wrongbook-brand strong em { margin-left: 3px; color: #aaa2a8; font-size: 9px; font-style: normal; font-weight: 500; }
html.v2-shell .v2-wrongbook-brand small { color: #948a82; font-size: 9px; white-space: nowrap; }
html.v2-shell .v2-wrongbook-child { min-width: 86px; min-height: 42px; display: flex; align-items: center; gap: 6px; padding: 3px 9px 3px 4px; border: 1px solid #efdfd0; border-radius: 999px; background: rgba(255, 255, 255, .75); color: #332d29; cursor: pointer; font: inherit; font-size: 12px; font-weight: 800; }
html.v2-shell .v2-wrongbook-child img { width: 33px; height: 33px; border-radius: 50%; object-fit: cover; }
html.v2-shell .v2-wrongbook-child span { max-width: 55px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.v2-shell .v2-wrongbook-child b { margin-left: auto; font-size: 13px; }
html.v2-shell #view-wrongbook > .page-head { min-height: 42px; align-items: center; padding-bottom: 11px; }
html.v2-shell #view-wrongbook .page-head .ph-ico,
html.v2-shell #view-wrongbook .page-head .ph-sub { display: none; }
html.v2-shell #view-wrongbook .page-head .ph-title { color: #28231f; font-size: 27px; font-weight: 900; letter-spacing: -1px; }
html.v2-shell #view-wrongbook .page-head .ph-actions { gap: 8px; }
html.v2-shell #view-wrongbook .wb-clear { display: none !important; }
html.v2-shell #view-wrongbook .wb-print { min-height: 40px; display: inline-flex; align-items: center; gap: 6px; padding: 0 11px; border: 1px solid #f1dfce; border-radius: 12px; background: rgba(255, 255, 255, .72); color: #6f6760; box-shadow: 0 5px 15px rgba(107, 66, 28, .04); font-size: 12px; font-weight: 700; }
html.v2-shell #view-wrongbook > .v2-wrongbook-card { margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
html.v2-shell #view-wrongbook .wb-scope-tabs { height: 45px; margin: 0; padding: 3px; border: 0; border-radius: 15px; background: #fbf3e9; }
html.v2-shell #view-wrongbook .wb-scope-tab { border: 0; border-radius: 12px; background: transparent; color: #726a64; font: inherit; font-size: 14px; font-weight: 700; }
html.v2-shell #view-wrongbook .wb-scope-tab.active { background: #fff; color: var(--v2-color-primary); box-shadow: 0 5px 15px rgba(91, 57, 26, .07); }
html.v2-shell #view-wrongbook .wb-scope-note { margin: 10px 2px 0; color: #8b837c; font-size: 11px; line-height: 1.5; }
html.v2-shell .v2-wrongbook-list-host { margin-top: 0; }
html.v2-shell .v2-wrongbook-hero { min-height: 116px; position: relative; display: flex; align-items: center; margin-top: 16px; padding: 18px 126px 16px 17px; overflow: hidden; border: 1px solid #ffead6; border-radius: 20px; background: #fff5e9; }
html.v2-shell .v2-wrongbook-hero h2 { position: relative; z-index: 1; margin: 0; color: #302b27; font-size: 17px; line-height: 1.55; letter-spacing: -.5px; white-space: nowrap; }
html.v2-shell .v2-wrongbook-hero h2 strong { color: #ff6211; font-size: 28px; }
html.v2-shell .v2-wrongbook-hero h2 span { white-space: nowrap; }
html.v2-shell .v2-wrongbook-hero p { position: relative; z-index: 1; margin: 6px 0 0; color: #927c68; font-size: 10px; line-height: 1.5; }
html.v2-shell .v2-wrongbook-hero img { width: 126px; height: 126px; position: absolute; right: -1px; bottom: -12px; object-fit: contain; }
html.v2-shell .v2-wrongbook-queue-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 9px; margin-top: 22px; padding: 0 2px; }
html.v2-shell .v2-wrongbook-queue-heading h2 { min-width: 0; margin: 0; color: #4d4945; font-size: 15px; }
html.v2-shell .v2-wrongbook-queue-heading small { margin-left: 4px; color: #9a928b; font-size: 9px; font-weight: 500; }
html.v2-shell .v2-wrongbook-queue-heading p { flex: 0 0 auto; margin: 0; color: #89817b; font-size: 11px; }
html.v2-shell .v2-wrongbook-queue-heading strong { color: #f56b1a; font-size: 15px; }
html.v2-shell .v2-wrongbook-list { margin-top: 9px; overflow: hidden; border-radius: 18px; background: #fff; box-shadow: 0 8px 26px rgba(113, 69, 27, .07); }
html.v2-shell .v2-wrongbook-row { min-height: 104px; position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 48px; align-items: stretch; }
html.v2-shell .v2-wrongbook-row.is-selected { background: linear-gradient(90deg, rgba(255, 248, 241, .8), transparent 48%); }
html.v2-shell .v2-wrongbook-row + .v2-wrongbook-row::before { height: 1px; position: absolute; z-index: 1; top: 0; right: 14px; left: 14px; background: #f1e8df; content: ""; }
html.v2-shell .v2-wrongbook-choice { min-width: 0; display: grid; grid-template-columns: 25px 48px minmax(0, 1fr); align-items: center; gap: 9px; padding: 12px 0 12px 10px; cursor: pointer; }
html.v2-shell .v2-wrongbook-choice input { position: absolute; width: 1px; height: 1px; opacity: 0; }
html.v2-shell .v2-wrongbook-order { width: 23px; height: 27px; display: grid; place-items: center; border-radius: 8px; background: #fff1e6; color: #ff6c1a; font-size: 12px; font-weight: 900; }
html.v2-shell .v2-wrongbook-topic-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; background: #fff3e6; color: #ef6b18; }
html.v2-shell .v2-wrongbook-topic-icon svg,
html.v2-shell .v2-wrongbook-plan-topic > span svg { width: 31px; height: 31px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
html.v2-shell .v2-wrongbook-copy { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
html.v2-shell .v2-wrongbook-copy strong { color: #312c28; font-size: 15px; line-height: 1.3; overflow-wrap: anywhere; }
html.v2-shell .v2-wrongbook-copy small { color: #8b827b; font-size: 10px; }
html.v2-shell .v2-wrongbook-copy em { color: #6c55cb; font-size: 9px; font-style: normal; font-weight: 700; line-height: 1.35; }
html.v2-shell .v2-wrongbook-detail { position: relative; display: grid; place-items: center; }
html.v2-shell .v2-wrongbook-detail summary { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: #9b928b; cursor: pointer; font-size: 23px; list-style: none; }
html.v2-shell .v2-wrongbook-detail summary::-webkit-details-marker { display: none; }
html.v2-shell .v2-wrongbook-detail p { width: calc(100vw - 76px); max-width: 420px; position: absolute; z-index: 4; top: 80px; right: 0; margin: 0; padding: 11px 13px; border: 1px solid #eadffd; border-radius: 12px; background: #faf8ff; box-shadow: 0 9px 25px rgba(61, 44, 118, .14); color: #685e75; font-size: 10px; line-height: 1.6; }
html.v2-shell .v2-wrongbook-primary { width: 100%; min-height: 53px; margin-top: 15px; border: 0; border-radius: 17px; background: linear-gradient(135deg, #ff7a27, #ff5f0c); box-shadow: 0 12px 23px rgba(255, 96, 11, .2); color: #fff; cursor: pointer; font: inherit; font-size: 15px; font-weight: 900; }
html.v2-shell .v2-wrongbook-primary:disabled { cursor: default; opacity: .5; }
html.v2-shell .v2-wrongbook-all { margin-top: 17px; }
html.v2-shell .v2-wrongbook-all > h2,
html.v2-shell .v2-wrongbook-history > h2 { margin: 0 0 8px; color: #4e4843; font-size: 13px; }
html.v2-shell .v2-wrongbook-subject,
html.v2-shell .v2-wrongbook-history > button { width: 100%; min-height: 58px; display: flex; align-items: center; justify-content: space-between; margin-top: 8px; padding: 10px 14px; border: 1px solid #f0e5da; border-radius: 15px; background: rgba(255, 255, 255, .78); color: #39332f; cursor: pointer; font: inherit; text-align: left; }
html.v2-shell .v2-wrongbook-subject span,
html.v2-shell .v2-wrongbook-history > button span { display: flex; flex-direction: column; gap: 4px; }
html.v2-shell .v2-wrongbook-subject strong,
html.v2-shell .v2-wrongbook-history > button strong { font-size: 13px; }
html.v2-shell .v2-wrongbook-subject small,
html.v2-shell .v2-wrongbook-history > button small { color: #928981; font-size: 9px; }
html.v2-shell .v2-wrongbook-subject b,
html.v2-shell .v2-wrongbook-history > button b { color: #ff6b17; font-size: 20px; }
html.v2-shell .v2-wrongbook-history { margin-top: 20px; }
html.v2-shell .v2-wrongbook-history > p { margin: 0 0 14px; color: #8a8179; font-size: 11px; line-height: 1.55; }
html.v2-shell .v2-wrongbook-empty { min-height: 430px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 30px 18px; text-align: center; }
html.v2-shell .v2-wrongbook-empty > img { width: 165px; height: 165px; margin-bottom: -12px; object-fit: contain; }
html.v2-shell .v2-wrongbook-empty > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: #edf8f0; color: #36a45a; font-size: 24px; }
html.v2-shell .v2-wrongbook-empty h2 { margin: 13px 0 0; color: #332e2a; font-size: 18px; }
html.v2-shell .v2-wrongbook-empty p { max-width: 290px; margin: 8px 0 0; color: #8c837b; font-size: 11px; line-height: 1.65; }
html.v2-shell .v2-wrongbook-empty button { min-width: 180px; min-height: 47px; margin-top: 20px; border: 0; border-radius: 15px; background: #fff1e6; color: #e95b0a; cursor: pointer; font: inherit; font-size: 13px; font-weight: 900; }

html.v2-shell.v2-wrongbook-plan-active { overflow: hidden; }
html.v2-shell.v2-wrongbook-plan-active body { overflow: hidden; }
html.v2-shell .v2-wrongbook-plan { width: min(100%, 520px); height: 100dvh; position: fixed; z-index: 1150; inset: 0; margin: 0 auto; flex-direction: column; overflow-y: auto; padding: 18px 16px max(14px, env(safe-area-inset-bottom)); background: radial-gradient(circle at 96% 2%, rgba(255, 216, 177, .3), transparent 15rem), var(--v2-color-bg); color: #292521; }
html.v2-shell .v2-wrongbook-plan-brand { display: flex; align-items: center; }
html.v2-shell .v2-wrongbook-plan-brand > .v2-brand-icon { width: 46px; height: 46px; flex: 0 0 auto; }
html.v2-shell .v2-wrongbook-plan-brand > p { min-width: 0; display: flex; flex: 1; flex-direction: column; gap: 4px; margin: 0 0 0 9px; }
html.v2-shell .v2-wrongbook-plan-brand > p strong { font-size: 17px; }
html.v2-shell .v2-wrongbook-plan-brand > p strong span { font-size: 13px; }
html.v2-shell .v2-wrongbook-plan-brand > p small { color: #958b82; font-size: 9px; }
html.v2-shell .v2-wrongbook-plan-child { max-width: 105px; display: flex; align-items: center; gap: 6px; padding: 3px 10px 3px 4px; overflow: hidden; border: 1px solid #efdfd0; border-radius: 999px; background: rgba(255, 255, 255, .75); font-size: 12px; }
html.v2-shell .v2-wrongbook-plan-child img { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; }
html.v2-shell .v2-wrongbook-plan-child b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.v2-shell .v2-wrongbook-plan > header { min-height: 48px; max-height: none; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; margin-top: 11px; padding: 0; overflow: visible; background: transparent; color: inherit; transform: none; }
html.v2-shell .v2-wrongbook-plan > header button { min-height: 44px; display: flex; align-items: center; gap: 3px; justify-self: start; padding: 0; border: 0; background: transparent; color: #423b36; cursor: pointer; font: inherit; font-size: 12px; }
html.v2-shell .v2-wrongbook-plan > header button svg,
html.v2-shell .v2-wrongbook-plan-start svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
html.v2-shell .v2-wrongbook-plan > header h1 { margin: 0; font-size: 18px; letter-spacing: -.6px; }
html.v2-shell .v2-wrongbook-plan-hero { min-height: 128px; position: relative; display: flex; align-items: center; padding-right: 124px; }
html.v2-shell .v2-wrongbook-plan-hero h2 { max-width: 220px; margin: 0; font-size: 24px; line-height: 1.28; letter-spacing: -1px; overflow-wrap: normal; }
html.v2-shell .v2-wrongbook-plan-hero h2 strong { color: #ff6410; font-size: 28px; }
html.v2-shell .v2-wrongbook-plan-hero h2 span { white-space: nowrap; }
html.v2-shell .v2-wrongbook-plan-hero p { margin: 8px 0 0; color: #7e7770; font-size: 10px; }
html.v2-shell .v2-wrongbook-plan-hero img { width: 142px; height: 142px; position: absolute; right: -7px; bottom: -4px; object-fit: contain; filter: drop-shadow(0 12px 20px rgba(177, 87, 15, .11)); }
html.v2-shell .v2-wrongbook-plan-topics { overflow: hidden; border: 1px solid #f3e3d3; border-radius: 21px; background: rgba(255, 255, 255, .94); box-shadow: 0 11px 28px rgba(140, 86, 34, .07); }
html.v2-shell .v2-wrongbook-plan-topic { min-height: 122px; position: relative; display: grid; grid-template-columns: 55px minmax(0, 1fr); align-items: center; gap: 12px; padding: 14px 16px; }
html.v2-shell .v2-wrongbook-plan-topic + .v2-wrongbook-plan-topic::before { height: 1px; position: absolute; top: 0; right: 16px; left: 16px; background: #f1e8df; content: ""; }
html.v2-shell .v2-wrongbook-plan-topic > span { width: 51px; height: 51px; display: grid; place-items: center; border-radius: 50%; background: #fff3e6; color: #ef6b18; }
html.v2-shell .v2-wrongbook-plan-topic h3 { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0; color: #2c2825; font-size: 15px; overflow-wrap: anywhere; }
html.v2-shell .v2-wrongbook-plan-topic h3 b { flex: 0 0 auto; color: #f26312; font-size: 15px; white-space: nowrap; }
html.v2-shell .v2-wrongbook-plan-topic > div > strong { display: inline-block; margin-top: 7px; padding: 4px 8px; border-radius: 999px; background: #f2efff; color: #6951ce; font-size: 10px; line-height: 1.3; }
html.v2-shell .v2-wrongbook-plan-topic p { margin: 7px 0 0; color: #827b74; font-size: 10px; line-height: 1.55; }
html.v2-shell .v2-wrongbook-reassurance { min-height: 50px; display: flex; align-items: center; justify-content: center; gap: 9px; margin-top: 10px; border: 1px solid #f2dfcb; border-radius: 16px; background: #fff9f1; color: #4f4944; font-size: 11px; }
html.v2-shell .v2-wrongbook-reassurance svg { width: 22px; height: 22px; fill: none; stroke: #ed711f; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
html.v2-shell .v2-wrongbook-handoff { margin: 9px 0 0; color: #817970; font-size: 10px; text-align: center; }
html.v2-shell .v2-wrongbook-duration { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 7px; color: #3d3834; font-size: 12px; }
html.v2-shell .v2-wrongbook-duration span { color: #ef721f; font-size: 20px; }
html.v2-shell .v2-wrongbook-plan-start { width: 100%; min-height: 54px; display: flex; align-items: center; justify-content: center; gap: 54px; margin-top: 8px; padding-left: 42px; border: 0; border-radius: 18px; background: #ff6b12; box-shadow: 0 12px 24px rgba(255, 101, 13, .22); color: #fff; cursor: pointer; font: inherit; font-size: 16px; font-weight: 900; }
html.v2-shell .v2-wrongbook-plan-back { min-height: 36px; margin: 4px auto 0; padding: 0 10px; border: 0; background: transparent; color: #6751d1; cursor: pointer; font: inherit; font-size: 11px; }

@media (min-width: 768px) {
  html.v2-shell main { width: min(100%, 760px); padding-inline: 28px; }
  html.v2-shell .smart-plan { padding: 28px; }
  html.v2-shell .bottom-nav { padding-inline: max(18px, calc((100vw - 760px) / 2)); }
  html.v2-shell .v2-public-landing.v2-only:not(.hidden) { width: min(100%, 980px); display: grid !important; grid-template-columns: minmax(0, .9fr) minmax(360px, 1.1fr); grid-template-rows: auto auto auto; column-gap: 42px; padding: 32px 42px; }
  html.v2-shell .v2-public-brand { grid-column: 1 / -1; }
  html.v2-shell .v2-public-hero { height: 330px; }
  html.v2-shell .v2-public-hero > div { width: 100%; padding-top: 45px; }
  html.v2-shell .v2-public-hero h1 { font-size: 30px; }
  html.v2-shell .v2-public-hero h1 strong { font-size: 36px; }
  html.v2-shell .v2-public-hero p { width: 245px; font-size: 13px; }
  html.v2-shell .v2-public-hero img { width: 145px; height: 145px; right: -5px; bottom: 8px; }
  html.v2-shell .v2-public-feedback { grid-column: 2; grid-row: 2 / 4; align-self: start; margin-top: 25px; }
  html.v2-shell .v2-public-trust { grid-column: 1; }
  html.v2-shell .v2-public-actions { grid-column: 1; }
  html.v2-shell .v2-auth-screen { width: min(100%, 760px); padding-inline: 72px; border-right: 1px solid #f4eadf; border-left: 1px solid #f4eadf; }
  html.v2-shell .v2-onboarding-screen,
  html.v2-shell .v2-diagnostic-screen { width: min(100%, 600px); padding-inline: 54px; border-right: 1px solid #f4eadf; border-left: 1px solid #f4eadf; }
}

@media (max-width: 360px) {
  html.v2-shell .v2-public-landing { padding: 16px 15px 10px; }
  html.v2-shell .v2-public-hero { height: 195px; margin-top: 8px; }
  html.v2-shell .v2-public-hero > div { width: 190px; }
  html.v2-shell .v2-public-hero h1 { font-size: 20px; }
  html.v2-shell .v2-public-hero h1 strong { font-size: 26px; }
  html.v2-shell .v2-public-hero p { width: 175px; }
  html.v2-shell .v2-public-hero img { width: 110px; height: 110px; right: -3px; bottom: 0; }
  html.v2-shell .v2-public-assurance { display: none; }
  html.v2-shell .v2-public-feedback { min-height: 264px; padding: 12px 13px 11px; }
  html.v2-shell .v2-public-trust > div { min-height: 34px; }
  html.v2-shell .v2-welcome-hero { height: 245px; }
  html.v2-shell .v2-welcome-hero img { width: 250px; height: 250px; }
  html.v2-shell .v2-welcome-copy h1 { font-size: 27px; }
  html.v2-shell .v2-welcome-copy h1 strong { font-size: 35px; }
  html.v2-shell .v2-auth-agreement { white-space: normal; }
  html.v2-shell .v2-onboarding-screen,
  html.v2-shell .v2-diagnostic-screen { padding-right: 14px; padding-left: 14px; }
  html.v2-shell .v2-onboarding-heading { min-height: 155px; grid-template-columns: minmax(0, 1fr) 105px; }
  html.v2-shell .v2-onboarding-heading h1 { font-size: 24px; }
  html.v2-shell .v2-onboarding-heading img { width: 105px; height: 105px; }
  html.v2-shell .v2-diagnostic-coach { min-height: 61px; }
  html.v2-shell .v2-diagnostic-card { padding: 16px 14px; }
  html.v2-shell .v2-diagnostic-stem { min-height: 82px; font-size: 17px; }
  html.v2-shell .v2-diagnostic-option { min-height: 65px; padding: 8px 9px; font-size: 13px; }
  html.v2-shell #view-wrongbook .page-head .ph-title { font-size: 25px; }
  html.v2-shell #view-wrongbook .wb-print { padding-inline: 8px; font-size: 10px; }
  html.v2-shell .v2-wrongbook-hero { min-height: 106px; padding-right: 108px; }
  html.v2-shell .v2-wrongbook-hero h2 { font-size: 15px; white-space: normal; }
  html.v2-shell .v2-wrongbook-hero h2 strong { font-size: 25px; }
  html.v2-shell .v2-wrongbook-hero img { width: 112px; height: 112px; }
  html.v2-shell .v2-wrongbook-choice { grid-template-columns: 23px 42px minmax(0, 1fr); gap: 7px; padding-left: 8px; }
  html.v2-shell .v2-wrongbook-topic-icon { width: 41px; height: 41px; }
  html.v2-shell .v2-wrongbook-copy strong { font-size: 14px; }
  html.v2-shell .v2-wrongbook-plan { padding-right: 13px; padding-left: 13px; }
  html.v2-shell .v2-wrongbook-brand small,
  html.v2-shell .v2-wrongbook-plan-brand > p small { display: none; }
  html.v2-shell .v2-wrongbook-plan-hero { min-height: 105px; padding-right: 104px; }
  html.v2-shell .v2-wrongbook-plan-hero h2 { font-size: 20px; }
  html.v2-shell .v2-wrongbook-plan-hero h2 strong { font-size: 24px; }
  html.v2-shell .v2-wrongbook-plan-hero img { width: 116px; height: 116px; }
  html.v2-shell .v2-wrongbook-plan-topic { min-height: 108px; grid-template-columns: 46px minmax(0, 1fr); gap: 9px; padding: 11px 12px; }
  html.v2-shell .v2-wrongbook-plan-topic > span { width: 45px; height: 45px; }
  html.v2-shell .v2-wrongbook-plan-topic p { font-size: 9px; }
}

@media (prefers-reduced-motion: reduce) {
  html.v2-shell *,
  html.v2-shell *::before,
  html.v2-shell *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Package 3/4: accepted orange report, profile, growth, and report plan surfaces */
html.v2-shell .v2-rp-icon { width: 18px; height: 18px; display: inline-block; flex: 0 0 auto; object-fit: contain; }
html.v2-shell .v2-report-brand-row,
html.v2-shell .v2-profile-brand-row { min-height: 52px; align-items: flex-start; justify-content: space-between; gap: 12px; }
html.v2-shell .v2-report-brand,
html.v2-shell .v2-profile-brand,
html.v2-shell .v2-growth-brand { min-width: 0; display: flex; align-items: center; gap: 9px; }
html.v2-shell .v2-shared-brand-mark { width: 32px; height: 32px; display: grid; flex: 0 0 32px; place-items: center; border-radius: 10px; background: linear-gradient(145deg, #ff7b21, #f05e11); box-shadow: 0 5px 13px rgba(255, 104, 20, .18); }
html.v2-shell .v2-shared-brand-mark img { width: 18px; height: 18px; filter: brightness(0) invert(1); }
html.v2-shell :is(.v2-report-brand, .v2-profile-brand, .v2-growth-brand) p { min-width: 0; display: flex; flex-direction: column; gap: 4px; margin: 0; }
html.v2-shell :is(.v2-report-brand, .v2-profile-brand, .v2-growth-brand) strong { color: #27221e; font-size: 15px; font-weight: 900; white-space: nowrap; }
html.v2-shell :is(.v2-report-brand, .v2-profile-brand, .v2-growth-brand) strong span { font-size: 13px; }
html.v2-shell :is(.v2-report-brand, .v2-profile-brand, .v2-growth-brand) strong em { margin-left: 3px; padding: 2px 4px; border-radius: 5px; background: #fff0e4; color: #ef6817; font-size: 8px; font-style: normal; }
html.v2-shell :is(.v2-report-brand, .v2-profile-brand, .v2-growth-brand) small { color: #8b827b; font-size: 8.5px; white-space: nowrap; }
html.v2-shell :is(.v2-report-child, .v2-profile-child-pill, .v2-growth-child) { min-height: 34px; display: flex; align-items: center; gap: 6px; padding: 3px 9px 3px 4px; border: 1px solid #f1dfca; border-radius: 999px; background: rgba(255,255,255,.88); color: #443c35; box-shadow: 0 5px 16px rgba(90, 56, 28, .06); font: inherit; font-size: 12px; font-weight: 800; white-space: nowrap; }
html.v2-shell :is(.v2-report-child, .v2-profile-child-pill, .v2-growth-child) > img { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; }
html.v2-shell .v2-growth-child > i { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: #fff0df; font-size: 17px; font-style: normal; }
html.v2-shell :is(.v2-report-child, .v2-profile-child-pill) b { color: #8c837b; font-size: 11px; }

html.v2-shell #view-report > .page-head,
html.v2-shell #view-me > .page-head { display: none; }
html.v2-shell .v2-report-title.v2-only:not(.hidden) { display: block !important; margin: 7px 0 0; color: #25211e; font-size: 27px; line-height: 1; letter-spacing: -1px; }
html.v2-shell #view-report > .card { padding: 0; border: 0; background: transparent; box-shadow: none; }
html.v2-shell #view-report #reportScopeTabs { height: 42px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-top: 12px; padding: 4px; border: 1px solid #eee4da; border-radius: 14px; background: #f8f4ef; }
html.v2-shell #view-report #reportScopeTabs .wb-scope-tab { min-height: 32px; margin: 0; border: 0; border-radius: 10px; background: transparent; color: #8b827a; font-size: 12px; }
html.v2-shell #view-report #reportScopeTabs .wb-scope-tab.active { background: #fff; color: #ef6817; box-shadow: 0 4px 12px rgba(98, 63, 33, .08); }
html.v2-shell #view-report #reportScopeNote { display: none; }
html.v2-shell #historyList { margin: 0; }
html.v2-shell .v2-report-screen { margin-top: 10px; }
html.v2-shell .v2-report-meta { display: flex; align-items: center; justify-content: space-between; margin: 0 2px; color: #827a73; font-size: 10px; }
html.v2-shell .v2-report-meta time { white-space: nowrap; }
html.v2-shell .v2-report-card { margin-top: 13px; padding: 16px 15px 13px; overflow: hidden; border: 1px solid #ffead5; border-radius: 21px; background: rgba(255,255,255,.9); box-shadow: 0 9px 28px rgba(179,109,39,.08); }
html.v2-shell .v2-report-summary { min-height: 103px; position: relative; padding-right: 122px; }
html.v2-shell .v2-report-summary > p { margin: 0; color: #483b32; font-size: 13px; font-weight: 700; }
html.v2-shell .v2-report-summary h2 { margin: 5px 0 9px; color: #f26311; font-size: 31px; line-height: 1; letter-spacing: -1px; }
html.v2-shell .v2-report-progress { width: max-content; max-width: 210px; min-height: 32px; display: flex; align-items: center; gap: 7px; padding: 5px 10px; border: 1px solid #f5deca; border-radius: 12px; background: #fff7ee; color: #4a4038; font-size: 10.5px; line-height: 1.35; }
html.v2-shell .v2-report-progress .v2-rp-icon { width: 16px; height: 16px; filter: invert(45%) sepia(98%) saturate(2500%) hue-rotate(359deg) brightness(100%); }
html.v2-shell .v2-report-progress strong { color: #f36a18; font-size: 14px; }
html.v2-shell .v2-report-summary > img { position: absolute; right: -4px; bottom: -5px; width: 132px; height: 132px; object-fit: contain; }
html.v2-shell .v2-report-metrics { min-height: 77px; display: grid; grid-template-columns: 1fr 1fr; margin-top: 3px; padding-top: 10px; border-top: 1px solid #f2e7dd; }
html.v2-shell .v2-report-metrics > div { display: flex; flex-direction: column; align-items: center; justify-content: center; }
html.v2-shell .v2-report-metrics > div + div { border-left: 1px solid #f1e5da; }
html.v2-shell .v2-report-metrics span { color: #817970; font-size: 11px; }
html.v2-shell .v2-report-metrics strong { margin-top: 1px; color: #ff6311; font-size: 32px; line-height: 1; }
html.v2-shell .v2-report-metrics em { font-size: 16px; font-style: normal; }
html.v2-shell .v2-report-metrics small { margin-top: 5px; color: #817a73; font-size: 9.5px; }
html.v2-shell .v2-report-insight { min-height: 42px; display: flex; align-items: center; gap: 9px; margin-top: 10px; padding: 8px 11px; border: 1px solid #f5dfcb; border-radius: 12px; background: #fff8f0; color: #5d5148; }
html.v2-shell .v2-report-insight .v2-rp-icon { filter: invert(47%) sepia(90%) saturate(2500%) hue-rotate(359deg); }
html.v2-shell .v2-report-insight p { margin: 0; font-size: 10.5px; line-height: 1.45; }
html.v2-shell .v2-report-history-heading { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 10px; margin-top: 12px; }
html.v2-shell .v2-report-history-heading h3 { margin: 0; font-size: 12px; }
html.v2-shell .v2-report-history-heading span { height: 1px; background: #f0e6dc; }
html.v2-shell .v2-report-session-list { position: relative; margin-top: 4px; }
html.v2-shell .v2-report-session-list::before { position: absolute; z-index: 0; top: 19px; bottom: 19px; left: 11px; width: 1px; background: #f3caa7; content: ""; }
html.v2-shell .v2-report-session { width: 100%; min-height: 45px; position: relative; z-index: 1; display: grid; grid-template-columns: 24px minmax(0,1fr) auto 15px; align-items: center; gap: 8px; margin: 6px 0; padding: 0; border: 0; background: transparent; color: #3b342f; text-align: left; }
html.v2-shell .v2-report-session-check { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 50%; background: #ff791e; box-shadow: 0 0 0 4px #fff; }
html.v2-shell .v2-report-session-check .v2-rp-icon { width: 13px; height: 13px; filter: brightness(0) invert(1); }
html.v2-shell .v2-report-session-copy { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
html.v2-shell .v2-report-session-copy strong { font-size: 11px; }
html.v2-shell .v2-report-session-copy small { overflow: hidden; color: #8d847c; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
html.v2-shell .v2-report-session-score { color: #8b827b; font-size: 9px; white-space: nowrap; }
html.v2-shell .v2-report-session-score strong { color: #ef6817; font-size: 13px; }
html.v2-shell .v2-report-session > .v2-rp-icon { width: 14px; height: 14px; opacity: .5; }
html.v2-shell :is(.v2-report-primary, .v2-report-secondary) { width: 100%; min-height: 52px; display: flex; align-items: center; justify-content: center; gap: 9px; border-radius: 16px; font: inherit; font-size: 14px; font-weight: 800; }
html.v2-shell .v2-report-primary { min-height: 50px; margin-top: 13px; border: 0; background: linear-gradient(135deg,#ff7b21,#ef6116); color: #fff; box-shadow: 0 8px 18px rgba(239,97,22,.19); }
html.v2-shell .v2-report-primary .v2-rp-icon { filter: brightness(0) invert(1); }
html.v2-shell .v2-report-secondary { min-height: 44px; margin-top: 8px; border: 1px solid #e9e0ff; background: #f7f4ff; color: #6751d1; }
html.v2-shell .v2-report-secondary .v2-rp-icon { width: 14px; height: 14px; }
html.v2-shell .v2-report-full { margin-top: 12px; padding: 18px 15px; border: 1px solid #ffead5; border-radius: 21px; background: #fff; }
html.v2-shell .v2-report-back { min-height: 40px; display: flex; align-items: center; gap: 6px; padding: 0; border: 0; background: transparent; color: #6751d1; font: inherit; }
html.v2-shell .v2-report-full h2 { margin: 6px 0; font-size: 19px; }
html.v2-shell .v2-report-full > p { margin: 0; color: #827a73; font-size: 11px; }
html.v2-shell .v2-report-history-panel,
html.v2-shell .v2-rp-empty { display: flex; flex-direction: column; align-items: center; margin-top: 13px; padding: 24px 17px; border: 1px solid #ffead5; border-radius: 21px; background: #fff; text-align: center; }
html.v2-shell :is(.v2-report-history-panel, .v2-rp-empty) > img { width: 126px; height: 126px; object-fit: contain; }
html.v2-shell :is(.v2-report-history-panel, .v2-rp-empty) h2 { margin: 3px 0 0; font-size: 18px; }
html.v2-shell :is(.v2-report-history-panel, .v2-rp-empty) p { margin: 8px 0 15px; color: #817970; font-size: 11px; line-height: 1.55; }
html.v2-shell .v2-report-history-panel > button { width: 100%; min-height: 55px; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; border: 0; border-top: 1px solid #f1e7dd; background: transparent; text-align: left; }
html.v2-shell .v2-report-history-panel > button span { display: flex; flex-direction: column; gap: 5px; }
html.v2-shell .v2-report-history-panel > button strong { font-size: 12px; }
html.v2-shell .v2-report-history-panel > button small { color: #8b837d; font-size: 10px; }
html.v2-shell .v2-rp-empty > button { min-height: 44px; padding: 0 18px; border: 0; border-radius: 14px; background: #ff6b12; color: #fff; font: inherit; font-weight: 800; }

html.v2-shell #meView { margin: 0; }
html.v2-shell .v2-profile-screen { margin-top: 7px; }
html.v2-shell .v2-profile-screen > h1 { margin: 0; color: #25211e; font-size: 27px; line-height: 1; letter-spacing: -1px; }
html.v2-shell .v2-profile-child-card { margin-top: 18px; padding: 14px 15px 11px; border: 1px solid #ffe0bf; border-radius: 21px; background: rgba(255,255,255,.86); box-shadow: 0 8px 25px rgba(176,104,35,.07); }
html.v2-shell .v2-profile-child-main { min-height: 129px; display: grid; grid-template-columns: 90px minmax(0,1fr) auto; align-items: center; gap: 9px; }
html.v2-shell .v2-profile-child-avatar { width: 90px; height: 90px; display: grid; place-items: center; overflow: hidden; border: 4px solid #fff; border-radius: 50%; background: #fff0db; box-shadow: 0 5px 14px rgba(181,105,31,.12); font-size: 52px; }
html.v2-shell .v2-profile-child-copy { min-width: 0; }
html.v2-shell .v2-profile-child-copy h2 { margin: 0; color: #28231f; font-size: 21px; line-height: 1; }
html.v2-shell .v2-profile-child-copy p { margin: 8px 0 0; overflow: hidden; color: #736b64; font-size: 10.5px; text-overflow: ellipsis; white-space: nowrap; }
html.v2-shell .v2-profile-child-copy > span { display: block; margin-top: 8px; color: #6f6257; font-size: 10.5px; white-space: nowrap; }
html.v2-shell .v2-profile-child-copy > span strong { color: #ff6814; font-size: 15px; }
html.v2-shell .v2-profile-child-main > button { min-height: 35px; display: flex; align-items: center; gap: 4px; align-self: start; margin-top: 5px; padding: 0 7px; border: 1px solid #ffb681; border-radius: 12px; background: #fffdf9; color: #ed6b1c; font: inherit; font-size: 10px; font-weight: 700; white-space: nowrap; }
html.v2-shell .v2-profile-child-main > button .v2-rp-icon { width: 13px; height: 13px; filter: invert(47%) sepia(86%) saturate(2300%) hue-rotate(359deg); }
html.v2-shell .v2-profile-stats { min-height: 62px; display: grid; grid-template-columns: repeat(3,1fr); margin-top: 10px; padding-top: 10px; border-top: 1px solid #f1e2d3; }
html.v2-shell .v2-profile-stats > div { display: flex; flex-direction: column; align-items: center; gap: 3px; }
html.v2-shell .v2-profile-stats > div + div { border-left: 1px solid #f0e0d1; }
html.v2-shell .v2-profile-stats span { color: #756e67; font-size: 9.5px; }
html.v2-shell .v2-profile-stats strong { color: #ff6613; font-size: 23px; line-height: 1; }
html.v2-shell .v2-growth-entry { width: 100%; min-height: 134px; position: relative; display: flex; align-items: center; margin-top: 13px; padding: 17px 130px 15px 17px; overflow: hidden; border: 1px solid #ffdab2; border-radius: 20px; background: #fff3e4; color: #332c26; box-shadow: 0 7px 22px rgba(190,112,35,.07); text-align: left; }
html.v2-shell .v2-growth-entry > span { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; }
html.v2-shell .v2-growth-entry > span > strong { font-size: 20px; letter-spacing: -.5px; }
html.v2-shell .v2-growth-entry small { margin-top: 8px; color: #776c62; font-size: 10.5px; white-space: nowrap; }
html.v2-shell .v2-growth-entry em { margin-top: 13px; color: #77685b; font-size: 11px; font-style: normal; }
html.v2-shell .v2-growth-entry b { color: #f26717; font-size: 18px; }
html.v2-shell .v2-growth-entry > img { position: absolute; right: 22px; bottom: -8px; width: 119px; height: 119px; object-fit: contain; }
html.v2-shell .v2-growth-entry > .v2-rp-icon { position: absolute; z-index: 2; right: 8px; width: 15px; height: 15px; }
html.v2-shell .v2-growth-entry > .v2-rp-icon { top: 50%; transform: translateY(-50%); }
html.v2-shell .v2-profile-menu { margin-top: 13px; overflow: hidden; border: 1px solid #f1e7df; border-radius: 19px; background: rgba(255,255,255,.86); box-shadow: 0 7px 23px rgba(109,66,29,.06); }
html.v2-shell .v2-profile-menu :is(button,a) { width: 100%; min-height: 55px; position: relative; display: grid; grid-template-columns: 31px auto minmax(0,1fr) 18px; align-items: center; gap: 9px; padding: 0 13px; border: 0; background: transparent; color: #39332e; font: inherit; text-align: left; text-decoration: none; }
html.v2-shell .v2-profile-menu :is(button,a) + :is(button,a)::before { position: absolute; top: 0; right: 13px; left: 13px; height: 1px; background: #f1e8e0; content: ""; }
html.v2-shell .v2-profile-menu :is(button,a) > span { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 9px; background: #fff2e6; }
html.v2-shell .v2-profile-menu :is(button,a):nth-child(2) > span { background: #f2efff; }
html.v2-shell .v2-profile-menu :is(button,a) > span .v2-rp-icon { width: 16px; height: 16px; filter: invert(48%) sepia(88%) saturate(2300%) hue-rotate(359deg); }
html.v2-shell .v2-profile-menu :is(button,a):nth-child(2) > span .v2-rp-icon { filter: invert(38%) sepia(39%) saturate(1559%) hue-rotate(216deg); }
html.v2-shell .v2-profile-menu strong { font-size: 13px; }
html.v2-shell .v2-profile-menu small { overflow: hidden; color: #8a827b; font-size: 9.5px; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
html.v2-shell .v2-profile-menu > :is(button,a) > .v2-rp-icon { width: 14px; height: 14px; opacity: .55; }
html.v2-shell .v2-parent-account { width: 100%; min-height: 57px; display: grid; grid-template-columns: 43px minmax(0,1fr) 19px; align-items: center; gap: 10px; margin-top: 10px; padding: 0 10px; border: 0; border-top: 1px solid #eee5dd; background: transparent; color: #443d37; font: inherit; text-align: left; }
html.v2-shell .v2-parent-account > span:first-child { width: 40px; height: 40px; display: block; overflow: hidden; border-radius: 50%; background: #eee9e3; }
html.v2-shell .v2-parent-account > span:first-child img { width: 100%; height: 100%; object-fit: cover; object-position: center 14%; }
html.v2-shell .v2-parent-account > span:nth-child(2) { display: flex; flex-direction: column; gap: 4px; }
html.v2-shell .v2-parent-account strong { font-size: 12px; }
html.v2-shell .v2-parent-account em { margin-left: 5px; padding: 2px 5px; border: 1px solid #ffd2b2; border-radius: 6px; color: #f26717; font-size: 9px; font-style: normal; font-weight: 500; }
html.v2-shell .v2-parent-account small { color: #888079; font-size: 10px; }
html.v2-shell .v2-parent-account > .v2-rp-icon { width: 14px; height: 14px; opacity: .55; }

html.v2-shell.v2-growth-active { overflow: hidden; }
html.v2-shell .v2-growth-center { position: fixed; z-index: 1100; inset: 0; width: min(100%,520px); min-height: 100dvh; margin: 0 auto; overflow-y: auto; flex-direction: column; padding: 18px 18px 16px; background: radial-gradient(circle at 100% 0%,rgba(255,211,156,.28),transparent 31%),linear-gradient(180deg,#fffaf3 0%,#fffdf9 46%,#fff9f1 100%); }
html.v2-shell :is(.v2-growth-center,.v2-report-plan) header { max-height: none; position: relative; padding: 0; overflow: visible; background: transparent; color: inherit; text-align: left; transform: none; transition: none; }
html.v2-shell .v2-growth-header { min-height: 52px; display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
html.v2-shell .v2-growth-title { min-height: 44px; display: grid; grid-template-columns: 50px 1fr 50px; align-items: center; }
html.v2-shell .v2-growth-title button { min-height: 44px; display: flex; align-items: center; gap: 2px; padding: 0; border: 0; background: transparent; color: #544b43; font: inherit; font-size: 11px; }
html.v2-shell .v2-growth-title button .v2-rp-icon { width: 16px; height: 16px; }
html.v2-shell .v2-growth-title h1 { margin: 0; color: #26211d; font-size: 21px; text-align: center; letter-spacing: -.5px; }
html.v2-shell .v2-growth-hero { min-height: 153px; position: relative; display: flex; align-items: center; padding: 18px 133px 17px 18px; overflow: hidden; border: 1px solid #ffd8ae; border-radius: 23px; background: linear-gradient(135deg,#fff1dc,#fff8ec 68%); box-shadow: 0 9px 26px rgba(176,101,27,.08); }
html.v2-shell .v2-growth-hero > div { position: relative; z-index: 2; }
html.v2-shell .v2-growth-hero > div > span { display: inline-flex; align-items: center; gap: 4px; color: #ef6817; font-size: 11px; font-weight: 800; }
html.v2-shell .v2-growth-hero > div > span .v2-rp-icon { width: 14px; height: 14px; filter: invert(47%) sepia(90%) saturate(2400%) hue-rotate(359deg); }
html.v2-shell .v2-growth-hero h2 { margin: 10px 0 0; color: #ee6415; font-size: 21px; line-height: 1.32; letter-spacing: -.5px; }
html.v2-shell .v2-growth-hero p { margin: 9px 0 0; color: #806f61; font-size: 10px; white-space: nowrap; }
html.v2-shell .v2-growth-hero p strong { color: #ef6716; font-size: 13px; }
html.v2-shell .v2-growth-hero > img { position: absolute; right: 0; bottom: -9px; width: 145px; height: 145px; object-fit: contain; }
html.v2-shell :is(.v2-growth-week,.v2-growth-goal,.v2-growth-medals) { border: 1px solid #f1e3d6; background: rgba(255,255,255,.92); box-shadow: 0 7px 21px rgba(106,67,30,.05); }
html.v2-shell .v2-growth-week { min-height: 132px; margin-top: 10px; padding: 13px 14px 11px; border-radius: 19px; }
html.v2-shell .v2-growth-week-head { display: flex; align-items: flex-start; justify-content: space-between; }
html.v2-shell .v2-growth-week-head > span { display: flex; flex-direction: column; gap: 3px; }
html.v2-shell .v2-growth-week-head strong { color: #302923; font-size: 14px; }
html.v2-shell .v2-growth-week-head strong b { color: #ef6817; font-size: 19px; }
html.v2-shell .v2-growth-week-head small { color: #a29488; font-size: 8.5px; }
html.v2-shell .v2-growth-week-head > em { padding: 5px 8px; border-radius: 999px; background: #f1ebff; color: #7357c8; font-size: 9px; font-style: normal; font-weight: 800; }
html.v2-shell .v2-growth-days { display: grid; grid-template-columns: repeat(7,1fr); gap: 5px; margin-top: 10px; }
html.v2-shell .v2-growth-days > div { min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 4px; }
html.v2-shell .v2-growth-days :is(small,em) { color: #9a8e82; font-size: 8px; font-style: normal; }
html.v2-shell .v2-growth-days span { width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid #eadfd5; border-radius: 50%; background: #faf7f3; }
html.v2-shell .v2-growth-days span.done { border-color: #ff8d46; background: #ff781e; box-shadow: 0 4px 9px rgba(255,109,21,.2); }
html.v2-shell .v2-growth-days span.done .v2-rp-icon { width: 13px; height: 13px; filter: brightness(0) invert(1); }
html.v2-shell .v2-growth-goal { min-height: 88px; display: grid; grid-template-columns: 43px 1fr; align-items: center; gap: 11px; margin-top: 10px; padding: 12px 14px; border-radius: 18px; }
html.v2-shell .v2-growth-goal > span { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 14px; background: #efe9ff; }
html.v2-shell .v2-growth-goal > span .v2-rp-icon { filter: invert(38%) sepia(39%) saturate(1559%) hue-rotate(216deg); }
html.v2-shell .v2-growth-goal > div > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
html.v2-shell .v2-growth-goal > div > div:first-child > span { color: #4b423a; font-size: 11px; font-weight: 700; }
html.v2-shell .v2-growth-goal strong { color: #ef6817; font-size: 15px; }
html.v2-shell .v2-growth-goal em { color: #8069c9; font-size: 9px; font-style: normal; white-space: nowrap; }
html.v2-shell .v2-growth-progress { height: 6px; margin-top: 8px; overflow: hidden; border-radius: 999px; background: #eee8e2; }
html.v2-shell .v2-growth-progress i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg,#ff7a20,#ffae52); }
html.v2-shell .v2-growth-goal small { display: block; margin-top: 6px; color: #998c81; font-size: 8.5px; }
html.v2-shell .v2-growth-medals { margin-top: 10px; overflow: hidden; border-radius: 18px; }
html.v2-shell .v2-growth-medals header { min-height: 39px; display: flex; align-items: center; justify-content: space-between; padding: 0 13px; border-bottom: 1px solid #f1e7dd; }
html.v2-shell .v2-growth-medals header > span { display: flex; align-items: center; gap: 6px; color: #403831; font-size: 11px; font-weight: 800; }
html.v2-shell .v2-growth-medals header > span .v2-rp-icon { width: 15px; height: 15px; filter: invert(47%) sepia(90%) saturate(2400%) hue-rotate(359deg); }
html.v2-shell .v2-growth-medals header button { display: flex; align-items: center; gap: 2px; padding: 0; border: 0; background: transparent; color: #7357c8; font: inherit; font-size: 9px; }
html.v2-shell .v2-growth-medals header button .v2-rp-icon { width: 12px; height: 12px; }
html.v2-shell .v2-growth-medals > div { display: grid; grid-template-columns: repeat(2,1fr); }
html.v2-shell .v2-growth-medals section { min-height: 96px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 7px; }
html.v2-shell .v2-growth-medals section + section { border-left: 1px solid #f1e7dd; }
html.v2-shell .v2-growth-medals section > span { width: 47px; height: 47px; display: grid; place-items: center; border-radius: 13px; background: linear-gradient(145deg,#ffaf2f,#ff781d); }
html.v2-shell .v2-growth-medals section + section > span { background: #f0ebff; }
html.v2-shell .v2-growth-medals section > span .v2-rp-icon { filter: brightness(0) invert(1); }
html.v2-shell .v2-growth-medals section + section > span .v2-rp-icon { filter: invert(38%) sepia(39%) saturate(1559%) hue-rotate(216deg); }
html.v2-shell .v2-growth-medals section small { color: #9b8d82; font-size: 8px; }
html.v2-shell .v2-growth-medals section p { margin: 0; }
html.v2-shell .v2-growth-medals section strong { color: #2f2924; font-size: 11px; }
html.v2-shell .v2-growth-record-button { width: 100%; min-height: 53px; display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 10px; border: 0; border-radius: 16px; background: linear-gradient(135deg,#ff7b21,#ef6116); color: #fff; box-shadow: 0 8px 18px rgba(239,97,22,.19); font: inherit; font-size: 14px; font-weight: 800; }
html.v2-shell .v2-growth-record-button .v2-rp-icon { filter: brightness(0) invert(1); }

html.v2-shell.v2-report-plan-active { overflow: hidden; }
html.v2-shell .v2-report-plan { position: fixed; z-index: 1150; inset: 0; width: min(100%,520px); min-height: 100dvh; margin: 0 auto; overflow-y: auto; flex-direction: column; padding: 22px 20px 15px; background: radial-gradient(circle at 92% 5%,rgba(255,215,166,.25),transparent 28%),radial-gradient(circle at 3% 71%,rgba(255,233,206,.24),transparent 24%),#fffcf7; }
html.v2-shell .v2-report-plan-header { min-height: 58px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
html.v2-shell .v2-report-plan-header button { min-height: 44px; display: inline-flex; align-items: center; gap: 5px; justify-self: start; padding: 0; border: 0; background: transparent; color: #292623; font: inherit; font-size: 12px; }
html.v2-shell .v2-report-plan-header button .v2-rp-icon { width: 16px; height: 16px; }
html.v2-shell .v2-report-plan-header h1 { margin: 0; color: #272421; font-size: 20px; letter-spacing: -.6px; white-space: nowrap; }
html.v2-shell .v2-report-plan-hero { min-height: 166px; position: relative; overflow: hidden; margin-top: 12px; padding: 28px 145px 21px 21px; border: 1px solid #ffe2c6; border-radius: 23px; background: #fff7ed; }
html.v2-shell .v2-report-plan-hero > div > span { display: flex; align-items: center; gap: 8px; color: #594d44; font-size: 12px; white-space: nowrap; }
html.v2-shell .v2-report-plan-hero > div > span .v2-rp-icon { filter: invert(47%) sepia(90%) saturate(2400%) hue-rotate(359deg); }
html.v2-shell .v2-report-plan-hero h2 { margin: 18px 0 0; color: #f25f0d; font-size: 29px; line-height: 1.2; letter-spacing: -1.2px; }
html.v2-shell .v2-report-plan-hero > img { position: absolute; right: -5px; bottom: -9px; width: 164px; height: 164px; object-fit: contain; filter: drop-shadow(0 12px 19px rgba(177,87,15,.11)); }
html.v2-shell .v2-report-prescription { min-height: 346px; margin-top: 13px; padding: 19px 17px 17px; border: 1px solid #f1e2d2; border-radius: 23px; background: rgba(255,255,255,.95); box-shadow: 0 11px 28px rgba(140,86,34,.07); }
html.v2-shell .v2-report-prescription > h2 { display: flex; align-items: center; gap: 10px; margin: 0; color: #2b2724; font-size: 19px; letter-spacing: -.5px; }
html.v2-shell .v2-report-prescription > h2 .v2-rp-icon { filter: invert(47%) sepia(90%) saturate(2400%) hue-rotate(359deg); }
html.v2-shell .v2-report-prescription-facts { display: grid; grid-template-columns: repeat(2,1fr); margin-top: 24px; }
html.v2-shell .v2-report-prescription-facts > span { min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 5px; }
html.v2-shell .v2-report-prescription-facts > span + span { border-left: 1px solid #f0e3d7; }
html.v2-shell .v2-report-prescription-facts small { color: #817970; font-size: 10px; }
html.v2-shell .v2-report-prescription-facts strong { color: #f26312; font-size: 24px; }
html.v2-shell .v2-report-prescription-facts em { color: #302b27; font-size: 12px; font-style: normal; }
html.v2-shell .v2-report-prescription-reason { display: flex; flex-direction: column; gap: 5px; margin-top: 16px; padding: 13px; border: 1px solid #e8e2ff; border-radius: 16px; background: #f8f6ff; }
html.v2-shell .v2-report-prescription-reason p { margin: 0; color: #7a7169; font-size: 9px; }
html.v2-shell .v2-report-prescription-reason strong { color: #6550cf; font-size: 12px; }
html.v2-shell .v2-report-prescription-reason span { color: #7a7169; font-size: 10.5px; line-height: 1.45; }
html.v2-shell .v2-report-prescription-safe { min-height: 50px; display: flex; align-items: center; justify-content: center; gap: 9px; margin-top: 16px; padding: 8px 10px; border: 1px solid #f3dfca; border-radius: 15px; background: #fff9f1; color: #534c46; font-size: 11px; }
html.v2-shell .v2-report-prescription-safe .v2-rp-icon { filter: invert(47%) sepia(90%) saturate(2400%) hue-rotate(359deg); }
html.v2-shell .v2-report-plan-start { width: 100%; min-height: 56px; display: flex; align-items: center; justify-content: center; gap: 38px; margin-top: 16px; padding-left: 30px; border: 0; border-radius: 18px; background: linear-gradient(100deg,#ff6610,#ff7918 55%,#ff5d0b); color: #fff; box-shadow: 0 12px 24px rgba(255,101,13,.22); font: inherit; font-size: 17px; font-weight: 800; }
html.v2-shell .v2-report-plan-start .v2-rp-icon { filter: brightness(0) invert(1); }
html.v2-shell .v2-report-plan-later { display: block; min-height: 38px; margin: 4px auto 0; padding: 3px 8px; border: 0; background: transparent; color: #6751d1; font: inherit; font-size: 12px; }

html.v2-shell .v2-profile-sheet,
html.v2-shell .v2-growth-record-sheet { position: fixed; z-index: 1200; inset: 0; align-items: flex-end; justify-content: center; background: transparent; }
html.v2-shell .v2-growth-record-sheet { position: absolute; }
html.v2-shell .v2-sheet-mask { position: absolute; inset: 0; background: rgba(38,28,20,.34); }
html.v2-shell :is(.v2-profile-sheet,.v2-growth-record-sheet) > article { position: relative; z-index: 1; width: min(100%,520px); padding: 23px 22px 27px; border-radius: 24px 24px 0 0; background: #fffdf9; box-shadow: 0 -18px 40px rgba(57,37,18,.17); }
html.v2-shell .v2-sheet-close { position: absolute; top: 17px; right: 18px; width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 50%; background: #f7f2eb; }
html.v2-shell .v2-sheet-close .v2-rp-icon { width: 17px; height: 17px; }
html.v2-shell .v2-sheet-icon { width: 45px; height: 45px; display: grid; place-items: center; border-radius: 14px; background: #ff7117; }
html.v2-shell .v2-sheet-icon .v2-rp-icon { filter: brightness(0) invert(1); }
html.v2-shell :is(.v2-profile-sheet,.v2-growth-record-sheet) h2 { margin: 14px 0 4px; font-size: 22px; }
html.v2-shell :is(.v2-profile-sheet,.v2-growth-record-sheet) article > p { margin: 0 0 18px; color: #92877d; font-size: 13px; }
html.v2-shell .v2-profile-child-list { max-height: 270px; overflow-x: hidden; overflow-y: auto; }
html.v2-shell .v2-profile-child-list button { width: 100%; min-height: 58px; display: grid; grid-template-columns: 42px minmax(0,1fr) 18px; align-items: center; gap: 10px; padding: 6px 10px; border: 1px solid #eee5dc; border-radius: 13px; background: #fff; text-align: left; }
html.v2-shell .v2-profile-child-list button + button { margin-top: 8px; }
html.v2-shell .v2-profile-child-list button > i { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: #fff0df; font-size: 25px; font-style: normal; }
html.v2-shell .v2-profile-child-list button > span { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
html.v2-shell .v2-profile-child-list button > .v2-rp-icon { width: 16px; max-width: 100%; }
html.v2-shell .v2-profile-child-list strong { font-size: 13px; }
html.v2-shell .v2-profile-child-list small { overflow: hidden; color: #8b837d; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
html.v2-shell .v2-sheet-primary { width: 100%; min-height: 48px; margin-top: 18px; border: 0; border-radius: 13px; background: #ff7017; color: #fff; font: inherit; font-weight: 800; }
html.v2-shell .v2-growth-record-sheet h3 { margin: 0 0 7px; color: #453c35; font-size: 13px; }
html.v2-shell .v2-growth-bars { height: 77px; display: grid; grid-template-columns: repeat(12,1fr); align-items: end; gap: 5px; padding: 5px 8px 0; border-radius: 14px; background: #fff7ed; }
html.v2-shell .v2-growth-bars > span { height: 67px; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 3px; }
html.v2-shell .v2-growth-bars i { width: 100%; max-width: 13px; display: block; border-radius: 4px 4px 2px 2px; background: linear-gradient(180deg,#ffb054,#ff7520); }
html.v2-shell .v2-growth-bars small { color: #aa9b8d; font-size: 7px; }
html.v2-shell .v2-growth-record-stats { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 16px; }
html.v2-shell .v2-growth-record-stats span { display: flex; flex-direction: column; align-items: center; gap: 3px; }
html.v2-shell .v2-growth-record-stats span + span { border-left: 1px solid #eee2d6; }
html.v2-shell .v2-growth-record-stats strong { color: #ef6817; font-size: 21px; }
html.v2-shell .v2-growth-record-stats small { color: #91857a; font-size: 8.5px; }
html.v2-shell .v2-medal-collection { max-height: 45dvh; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; overflow-y: auto; }
html.v2-shell .v2-medal-collection section { min-height: 67px; display: grid; grid-template-columns: 38px minmax(0,1fr); align-items: center; gap: 8px; padding: 9px; border: 1px solid #eee2d6; border-radius: 13px; background: #fff; }
html.v2-shell .v2-medal-collection section > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 11px; background: #fff1df; font-size: 21px; }
html.v2-shell .v2-medal-collection section > div { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
html.v2-shell .v2-medal-collection strong { font-size: 11px; }
html.v2-shell .v2-medal-collection small { color: #8d8278; font-size: 8px; line-height: 1.35; }
html.v2-shell .v2-medal-collection .is-locked { filter: grayscale(.65); opacity: .66; }

html.v2-shell.v2-account-security-open { overflow: hidden; }
html.v2-shell #phoneChangeModal { z-index: 1500 !important; }
html.v2-shell #settingsModal.v2-account-security-active {
  inset: 0;
  z-index: 1400 !important;
  align-items: stretch;
  justify-content: center;
  padding: 0;
  background: rgba(44,31,22,.2);
}
html.v2-shell #settingsModal.v2-account-security-active > .settings-modal-box {
  width: min(100%,520px);
  max-width: 520px !important;
  max-height: 100dvh !important;
  min-height: 100dvh;
  margin: 0 auto;
  padding: 0;
  overflow: hidden !important;
  border: 0;
  border-radius: 0;
  background: #fffcf7;
  box-shadow: none;
}
html.v2-shell #settingsModal.v2-account-security-active > .settings-modal-box > .modal-close,
html.v2-shell #settingsModal.v2-account-security-active > .settings-modal-box > .modal-title,
html.v2-shell #settingsModal.v2-account-security-active > .settings-modal-box > .btn { display: none; }
html.v2-shell #settingsModal.v2-account-security-active #settingsBody { height: 100dvh; }
html.v2-shell .v2-account-security {
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 18px 18px max(18px,env(safe-area-inset-bottom));
  background: radial-gradient(circle at 100% 0%,rgba(255,218,177,.25),transparent 30%),linear-gradient(180deg,#fffaf4,#fffdf9 54%,#fff9f3);
  color: #302923;
}
html.v2-shell .v2-security-brand-row { min-height: 52px; display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 0; overflow: visible; position: static; max-height: none; background: transparent; color: inherit; text-align: left; transition: none; }
html.v2-shell .v2-security-brand { min-width: 0; display: flex; align-items: center; gap: 8px; }
html.v2-shell .v2-security-brand > span { width: 31px; height: 31px; flex: 0 0 31px; display: grid; place-items: center; border-radius: 9px; background: linear-gradient(135deg,#ff7b21,#ef6116); box-shadow: 0 5px 13px rgba(239,97,22,.2); }
html.v2-shell .v2-security-brand > span .v2-rp-icon { width: 17px; height: 17px; filter: brightness(0) invert(1); }
html.v2-shell .v2-security-brand p { min-width: 0; display: flex; flex-direction: column; gap: 4px; margin: 0; }
html.v2-shell .v2-security-brand strong { color: #2b2622; font-size: 15px; white-space: nowrap; }
html.v2-shell .v2-security-brand strong b { font-size: 13px; }
html.v2-shell .v2-security-brand strong em { margin-left: 3px; padding: 2px 4px; border-radius: 5px; background: #fff0e4; color: #ef6817; font-size: 8px; font-style: normal; }
html.v2-shell .v2-security-brand p small { overflow: hidden; color: #8b827b; font-size: 8.5px; text-overflow: ellipsis; white-space: nowrap; }
html.v2-shell .v2-security-child-pill { min-height: 32px; display: flex; flex: 0 0 auto; align-items: center; gap: 6px; padding: 3px 10px 3px 4px; border: 1px solid #f1dfca; border-radius: 999px; background: rgba(255,255,255,.84); color: #443c35; font-size: 12px; }
html.v2-shell .v2-security-child-pill img { width: 25px; height: 25px; border-radius: 50%; object-fit: cover; }
html.v2-shell .v2-security-child-pill i { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; background: #fff0df; font-size: 16px; font-style: normal; }
html.v2-shell .v2-security-title-row { min-height: 44px; display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; }
html.v2-shell .v2-security-title-row button { width: 44px; height: 44px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: transparent; }
html.v2-shell .v2-security-title-row button .v2-rp-icon { width: 20px; height: 20px; }
html.v2-shell .v2-security-title-row h1 { margin: 0; color: #27221e; font-size: 21px; text-align: center; letter-spacing: -.5px; }
html.v2-shell .v2-security-status { width: 100%; min-height: 65px; display: grid; grid-template-columns: 40px minmax(0,1fr) auto 18px; align-items: center; gap: 9px; margin-top: 5px; padding: 0 14px; border: 1px solid #d7e7cd; border-radius: 19px; background: linear-gradient(100deg,#f8fff3,#fffdf8); box-shadow: 0 7px 19px rgba(78,119,56,.06); }
html.v2-shell .v2-security-status > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px; background: linear-gradient(145deg,#66cf52,#35a933); box-shadow: 0 5px 12px rgba(63,169,50,.17); }
html.v2-shell .v2-security-status > span .v2-rp-icon { filter: brightness(0) invert(1); }
html.v2-shell .v2-security-status > strong { min-width: 0; font-size: 15px; }
html.v2-shell .v2-security-status > small { color: #6f675f; font-size: 9.5px; white-space: nowrap; }
html.v2-shell .v2-security-status > small b { color: #f36b17; font-size: 16px; }
html.v2-shell .v2-security-status > .v2-rp-icon { width: 17px; height: 17px; opacity: .58; }
html.v2-shell .v2-security-status { color: inherit; font: inherit; text-align: left; }
html.v2-shell .v2-security-summary { margin-top: 8px; padding: 10px 14px; border: 1px solid #dcebd4; border-radius: 15px; background: #fbfff8; }
html.v2-shell .v2-security-summary p { display: flex; justify-content: space-between; gap: 12px; margin: 5px 0; color: #6f675f; font-size: 11px; }
html.v2-shell .v2-security-summary p strong { color: #3f3933; }
html.v2-shell .v2-security-summary p span { color: #319231; }
html.v2-shell .v2-security-feedback:empty { display: none; }
html.v2-shell .v2-security-feedback { margin-top: 8px; padding: 8px 11px; border-radius: 12px; background: #fff7ed; color: #6f6259; font-size: 11px; }
html.v2-shell .v2-security-action-feedback { margin: 8px 12px 2px; }
html.v2-shell .v2-security-settings { margin-top: 12px; overflow: hidden; border: 1px solid #f0dfd0; border-radius: 20px; background: rgba(255,255,255,.92); box-shadow: 0 8px 24px rgba(103,67,34,.06); }
html.v2-shell .v2-security-group + .v2-security-group { border-top: 1px solid #eddfd3; }
html.v2-shell .v2-security-group > h2,
html.v2-shell .v2-security-group-heading { min-height: 29px; display: flex; align-items: center; margin: 0; padding: 0 13px; background: #fffdfb; color: #8c8177; font-size: 10px; }
html.v2-shell .v2-security-group-heading { justify-content: space-between; }
html.v2-shell .v2-security-group-heading h2 { margin: 0; font-size: 10px; }
html.v2-shell .v2-security-group-heading small { color: #755fd0; font-size: 8.5px; }
html.v2-shell .v2-security-row { width: 100%; min-height: 50px; position: relative; display: grid; grid-template-columns: 32px auto minmax(0,1fr) 16px; align-items: center; gap: 8px; padding: 0 12px; border: 0; background: transparent; color: #3b342e; font: inherit; text-align: left; text-decoration: none; }
html.v2-shell .v2-security-row + .v2-security-row::before { content: ""; position: absolute; top: 0; right: 12px; left: 52px; height: 1px; background: #f0e8e1; }
html.v2-shell .v2-security-row.compact { min-height: 44px; }
html.v2-shell .v2-security-row.is-disabled { opacity: .58; }
html.v2-shell .v2-security-row > strong { font-size: 12.5px; white-space: nowrap; }
html.v2-shell .v2-security-row > small { min-width: 0; overflow: hidden; color: #91877e; font-size: 9.5px; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
html.v2-shell .v2-security-row > .v2-rp-icon { width: 16px; height: 16px; opacity: .58; }
html.v2-shell .v2-security-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 11px; }
html.v2-shell .v2-security-icon .v2-rp-icon { width: 18px; height: 18px; }
html.v2-shell .v2-security-icon.orange { background: #fff0e5; }
html.v2-shell .v2-security-icon.orange .v2-rp-icon { filter: invert(47%) sepia(90%) saturate(2400%) hue-rotate(359deg); }
html.v2-shell .v2-security-icon.green { background: #edf9ec; }
html.v2-shell .v2-security-icon.green .v2-rp-icon { filter: invert(57%) sepia(40%) saturate(1080%) hue-rotate(72deg); }
html.v2-shell .v2-security-icon.violet { background: #f1edff; }
html.v2-shell .v2-security-icon.violet .v2-rp-icon { filter: invert(38%) sepia(39%) saturate(1559%) hue-rotate(216deg); }
html.v2-shell .v2-security-icon.soft { background: #f6f1eb; }
html.v2-shell .v2-security-icon.soft .v2-rp-icon { opacity: .6; }
html.v2-shell .v2-security-avatar-preview { width: 32px; height: 32px; display: block; overflow: hidden; border: 1px solid #eadfd5; border-radius: 11px; background: #f6f1eb; }
html.v2-shell .v2-security-avatar-preview.is-synced { border-color: #9fd69a; box-shadow: 0 0 0 2px rgba(91,181,80,.1); }
html.v2-shell .v2-security-avatar-preview img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; }
html.v2-shell .v2-security-device-list { padding: 0 12px; color: #91877e; font-size: 10px; }
html.v2-shell .v2-security-device-row { min-height: 50px; display: grid; grid-template-columns: 32px minmax(0,1fr) auto; align-items: center; gap: 8px; border-bottom: 1px solid #f0e8e1; }
html.v2-shell .v2-security-device-row > span:nth-child(2) { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
html.v2-shell .v2-security-device-row strong { overflow: hidden; color: #3b342e; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
html.v2-shell .v2-security-device-row small { overflow: hidden; color: #91877e; font-size: 8.5px; text-overflow: ellipsis; white-space: nowrap; }
html.v2-shell .v2-security-device-row button { min-width: 44px; min-height: 34px; padding: 0 8px; border: 1px solid #eadfd5; border-radius: 10px; background: #fff; color: #755fd0; font: inherit; font-size: 10px; }
html.v2-shell .v2-security-danger { margin-top: 10px; overflow: hidden; border: 1px solid #f4d0cc; border-radius: 18px; background: #fff9f8; }
html.v2-shell .v2-security-danger h2 { min-height: 27px; display: flex; align-items: center; margin: 0; padding: 0 13px; border-bottom: 1px solid #f4dfdc; color: #d83d32; font-size: 10px; }
html.v2-shell .v2-security-deletion-status { padding: 8px 13px 0; color: #9a7773; font-size: 9px; line-height: 1.45; }
html.v2-shell .v2-security-deletion-status:empty { display: none; }
html.v2-shell .v2-security-deletion-status .set-sub { color: inherit; font-size: inherit; }
html.v2-shell .v2-security-deletion-status .btn { min-height: 38px; border-color: #f1c9c5; border-radius: 10px; color: #c9342e; }
html.v2-shell .v2-security-danger > button { width: 100%; min-height: 58px; display: grid; grid-template-columns: 34px minmax(0,1fr) 18px; align-items: center; gap: 9px; padding: 6px 13px; border: 0; background: transparent; color: #c9342e; text-align: left; }
html.v2-shell .v2-security-danger > button > span:first-child { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; background: #ffe9e7; }
html.v2-shell .v2-security-danger > button > span:first-child .v2-rp-icon { filter: invert(35%) sepia(90%) saturate(1800%) hue-rotate(337deg); }
html.v2-shell .v2-security-danger > button > span:nth-child(2) { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
html.v2-shell .v2-security-danger strong { font-size: 12.5px; }
html.v2-shell .v2-security-danger small { color: #9a7773; font-size: 8.5px; }
html.v2-shell .v2-security-danger > button > .v2-rp-icon { width: 17px; height: 17px; }
html.v2-shell .v2-security-logout { width: 100%; min-height: 44px; margin-top: 10px; border: 1px solid #eadfd5; border-radius: 14px; background: rgba(255,255,255,.78); color: #6d625a; font: inherit; font-size: 12px; font-weight: 700; }

@media (min-width: 768px) {
  html.v2-shell .v2-growth-center,
  html.v2-shell .v2-report-plan { right: auto; left: 50%; transform: translateX(-50%); border-right: 1px solid #f4eadf; border-left: 1px solid #f4eadf; }
}

@media (max-width: 360px) {
  html.v2-shell .v2-brand-copy strong em { display: none; }
  html.v2-shell .v2-report-brand-row,
  html.v2-shell .v2-profile-brand-row { min-height: 47px; }
  html.v2-shell :is(.v2-report-brand,.v2-profile-brand) small { display: none; }
  html.v2-shell .v2-report-summary { padding-right: 102px; }
  html.v2-shell .v2-report-summary > img { width: 114px; height: 114px; }
  html.v2-shell .v2-report-progress { max-width: 190px; white-space: normal; }
  html.v2-shell .v2-profile-child-main { grid-template-columns: 76px minmax(0,1fr); }
  html.v2-shell .v2-profile-child-avatar { width: 74px; height: 74px; }
  html.v2-shell .v2-profile-child-main > button { grid-column: 2; justify-self: start; margin-top: -17px; }
  html.v2-shell .v2-profile-child-copy p { white-space: normal; }
  html.v2-shell .v2-growth-entry { padding-right: 110px; }
  html.v2-shell .v2-growth-entry > img { right: 10px; width: 105px; height: 105px; }
  html.v2-shell .v2-growth-center { padding-right: 14px; padding-left: 14px; }
  html.v2-shell .v2-growth-brand small { display: none; }
  html.v2-shell .v2-growth-hero { min-height: 145px; padding-right: 115px; }
  html.v2-shell .v2-growth-hero > img { width: 128px; height: 128px; }
  html.v2-shell .v2-growth-hero h2 { font-size: 18px; }
  html.v2-shell .v2-growth-days { gap: 3px; }
  html.v2-shell .v2-growth-days span { width: 25px; height: 25px; }
  html.v2-shell .v2-report-plan { padding-right: 14px; padding-left: 14px; }
  html.v2-shell .v2-report-plan-hero { min-height: 150px; padding: 24px 126px 18px 17px; }
  html.v2-shell .v2-report-plan-hero h2 { margin-top: 14px; font-size: 25px; }
  html.v2-shell .v2-report-plan-hero > img { width: 147px; height: 147px; }
  html.v2-shell .v2-report-prescription { margin-top: 10px; padding: 15px 14px 13px; }
  html.v2-shell .v2-report-prescription > h2 { font-size: 17px; }
  html.v2-shell .v2-account-security { padding: 15px 14px 12px; }
  html.v2-shell .v2-security-brand-row { min-height: 47px; }
  html.v2-shell .v2-security-brand p small { display: none; }
  html.v2-shell .v2-security-title-row { min-height: 42px; }
  html.v2-shell .v2-security-status { min-height: 59px; margin-top: 3px; }
  html.v2-shell .v2-security-status > span { width: 36px; height: 36px; }
  html.v2-shell .v2-security-settings { margin-top: 8px; }
  html.v2-shell .v2-security-group > h2,
  html.v2-shell .v2-security-group-heading { min-height: 24px; }
  html.v2-shell .v2-security-row { min-height: 42px; grid-template-columns: 30px auto minmax(0,1fr) 15px; gap: 6px; padding: 0 10px; }
  html.v2-shell .v2-security-row.compact { min-height: 40px; }
  html.v2-shell .v2-security-icon { width: 30px; height: 30px; }
  html.v2-shell .v2-security-avatar-preview { width: 30px; height: 30px; }
  html.v2-shell .v2-security-device-row { min-height: 45px; }
  html.v2-shell .v2-security-danger { margin-top: 8px; }
}

/* v2.2.0: all four primary tabs inherit the Today header geometry. */
html.v2-shell .v2-primary-topbar {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 0 20px;
}
html.v2-shell .v2-primary-topbar .v2-brand-lockup {
  display: flex;
  flex: 1 1 auto;
}
html.v2-shell .v2-primary-child-slot {
  flex: 0 0 auto;
  margin-left: auto;
}
html.v2-shell button.v2-primary-child-slot {
  min-width: 0;
  min-height: var(--v2-touch-target);
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 9px;
  border: 1px solid var(--v2-color-line);
  border-radius: 999px;
  background: #fff;
  color: #35384a;
  box-shadow: 0 5px 18px rgba(61, 45, 32, .07);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
}
html.v2-shell button.v2-primary-child-slot > img {
  width: 27px;
  height: 27px;
  border-radius: 50%;
  object-fit: cover;
}
html.v2-shell button.v2-primary-child-slot > .v2-primary-child-avatar {
  width: 27px;
  height: 27px;
  display: grid;
  flex: 0 0 27px;
  place-items: center;
  border-radius: 50%;
  background: #fff1e8;
  font-size: 17px;
  line-height: 1;
}
html.v2-shell button.v2-primary-child-slot > span {
  max-width: 72px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html.v2-shell button.v2-primary-child-slot > b {
  margin-left: 0;
  color: #8c837b;
  font-size: 11px;
}
