:root {
  color-scheme: light;
  --green-950: #05251b;
  --green-900: #073f2d;
  --green-800: #0b5c40;
  --green-700: #11734f;
  --green-100: #eaf5eb;
  --green-050: #f5faf4;
  --gold: #c58a2a;
  --gold-soft: #fff3d7;
  --blue-soft: #eef5ff;
  --red-soft: #fff1ed;
  --card: #ffffff;
  --ink: #14251c;
  --muted: #52645a;
  --line: #d9e3d6;
  --shadow: 0 14px 40px rgba(13, 52, 35, 0.10);
  --shadow-soft: 0 6px 18px rgba(13, 52, 35, 0.08);
  --radius-lg: 24px;
  --radius-md: 16px;
  --radius-sm: 10px;
  --focus: 0 0 0 4px rgba(197, 138, 42, 0.35);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  background:
    radial-gradient(circle at top left, rgba(17,115,79,.10), transparent 38rem),
    linear-gradient(180deg, #f2f8f1 0%, #f8faf5 52%, #eef5ef 100%);
  color: var(--ink);
  min-height: 100vh;
}

button, input, textarea, select { font: inherit; }
button, .primary-upload { touch-action: manipulation; }
button {
  border: 0;
  border-radius: 999px;
  background: var(--green-900);
  color: white;
  padding: .82rem 1.08rem;
  font-weight: 850;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
  box-shadow: 0 8px 20px rgba(7,63,45,.16);
}
button:hover { transform: translateY(-1px); background: var(--green-800); }
button:active { transform: translateY(0); }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, .primary-upload:focus-visible { outline: none; box-shadow: var(--focus); }
button.secondary, button.ghost {
  background: white;
  color: var(--green-900);
  border: 1px solid var(--line);
  box-shadow: none;
}
button.full-width { width: 100%; justify-content: center; }
button.ghost { border-color: rgba(255,255,255,.45); background: rgba(255,255,255,.12); color: white; }
button.ghost:hover { background: rgba(255,255,255,.20); }

.skip-link {
  position: fixed;
  z-index: 50;
  left: 1rem;
  top: -10rem;
  background: var(--gold);
  color: #1b1508;
  padding: .75rem 1rem;
  border-radius: 999px;
  font-weight: 900;
}
.skip-link:focus { top: 1rem; }

.app { width: min(1660px, 100%); margin: 0 auto; padding: 18px; }
.utility-bar { display: flex; justify-content: space-between; gap: 1rem; align-items: center; margin-bottom: 18px; }
.brand { font-size: clamp(1.4rem, 3vw, 2.15rem); color: white; font-weight: 950; letter-spacing: -.04em; display: flex; align-items: center; gap: .45rem; }
.brand span { font-size: 1.28em; }
.build-pill { background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.24); color: white; border-radius: 999px; padding: .55rem .85rem; font-weight: 750; }
.hero-shell {
  background:
    linear-gradient(135deg, rgba(5,37,27,.96), rgba(9,91,61,.92)),
    radial-gradient(circle at 80% 10%, rgba(197,138,42,.40), transparent 22rem);
  border-radius: calc(var(--radius-lg) + 8px);
  padding: clamp(18px, 3vw, 34px);
  box-shadow: var(--shadow);
  overflow: hidden;
  position: relative;
}
.hero-shell::after {
  content: "";
  position: absolute;
  right: -8rem;
  bottom: -12rem;
  width: 34rem;
  height: 34rem;
  background: radial-gradient(circle, rgba(255,255,255,.12), transparent 63%);
  pointer-events: none;
}
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr); gap: 22px; align-items: stretch; position: relative; z-index: 1; }
.eyebrow { text-transform: uppercase; letter-spacing: .14em; font-size: .78rem; font-weight: 900; color: var(--gold); margin: 0 0 .65rem; }
.hero-copy h1 { font-family: Georgia, "Times New Roman", serif; color: white; font-size: clamp(2.15rem, 5.4vw, 4.7rem); line-height: .98; letter-spacing: -.05em; margin: 0; max-width: 15ch; text-wrap: balance; }
.lead { color: rgba(255,255,255,.88); font-size: clamp(.98rem, 1.75vw, 1.17rem); line-height: 1.48; max-width: 54ch; margin: 1rem 0 0; text-wrap: pretty; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.4rem; }
.primary-upload { display: inline-flex; align-items: center; justify-content: center; background: var(--gold); color: #211706; border-radius: 999px; padding: .9rem 1.25rem; font-weight: 950; cursor: pointer; text-decoration: none; box-shadow: 0 10px 24px rgba(197, 138, 42, .22); }
.promise-card { background: rgba(255,255,255,.96); border-radius: var(--radius-lg); padding: 1.1rem; box-shadow: var(--shadow-soft); align-self: end; }
.promise-card strong { display: block; color: var(--green-900); font-size: 1.2rem; line-height: 1.2; }
.promise-card p { color: var(--muted); line-height: 1.42; margin-bottom: .7rem; }
.promise-card ul { margin: .55rem 0 0; padding-left: 1.1rem; color: var(--ink); line-height: 1.5; }

.onboarding-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 14px 0; }
.onboarding-strip article { display: flex; align-items: center; gap: .65rem; background: rgba(255,255,255,.82); border: 1px solid var(--line); border-radius: var(--radius-md); padding: .82rem; box-shadow: var(--shadow-soft); }
.onboarding-strip b { width: 2rem; height: 2rem; border-radius: 999px; display: grid; place-items: center; color: white; background: var(--green-900); flex: 0 0 auto; }
.onboarding-strip span { font-weight: 800; color: var(--green-950); font-size: .93rem; }

.tabs { display: flex; gap: .45rem; overflow-x: auto; padding: .35rem 0 .75rem; position: sticky; top: 0; z-index: 20; backdrop-filter: blur(18px); background: rgba(242,248,241,.88); scrollbar-width: thin; }
.tab { background: white; color: var(--green-900); border: 1px solid var(--line); box-shadow: none; white-space: nowrap; border-radius: 999px; padding: .72rem .95rem; }
.tab.active { background: var(--green-900); color: white; border-color: var(--green-900); }

.screen { display: none; }
.screen.active { display: block; animation: fadeUp .22s ease-out; }
@keyframes fadeUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.workspace { display: grid; grid-template-columns: minmax(290px, 360px) minmax(0, 1fr) minmax(290px, 350px); gap: 14px; align-items: start; }
.panel { background: rgba(255,255,255,.92); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-soft); overflow: hidden; }
.panel-title { background: var(--green-900); color: white; text-transform: uppercase; letter-spacing: .075em; font-size: .82rem; font-weight: 950; padding: .88rem 1rem; }
.panel-body { padding: 1rem; }
.border-top { border-top: 1px solid var(--line); }
.intake-panel, .recommendation-panel { position: sticky; top: 70px; }
.upload-drop { min-height: 290px; border: 2px dashed #b9cdb7; border-radius: var(--radius-md); display: grid; place-items: center; overflow: hidden; cursor: pointer; position: relative; background: linear-gradient(135deg, #244b35, #75a171); margin-bottom: 1rem; }
.upload-drop.dragover { border-color: var(--gold); box-shadow: var(--focus); }
.upload-drop input { display: none; }
.upload-drop img { width: 100%; height: 100%; min-height: 290px; display: none; object-fit: cover; }
.upload-drop.has-image img { display: block; }
.upload-placeholder { position: absolute; inset: 0; display: grid; place-items: center; text-align: center; padding: 2rem; color: white; text-shadow: 0 3px 14px rgba(0,0,0,.42); background: linear-gradient(135deg, rgba(5,37,27,.45), rgba(17,115,79,.15)); }
.upload-placeholder strong { font-size: 1.35rem; display: block; }
.upload-placeholder small { display: block; margin-top: .3rem; font-weight: 700; opacity: .94; }
.upload-drop.has-image .upload-placeholder { display: none; }
.camera-button { position: absolute; right: .85rem; bottom: .85rem; width: 3.1rem; height: 3.1rem; border-radius: 999px; display: grid; place-items: center; background: var(--green-900); color: white; font-size: 1.45rem; box-shadow: 0 8px 24px rgba(0,0,0,.28); }
.field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.field { display: grid; gap: .38rem; font-weight: 850; color: var(--green-950); font-size: .92rem; margin-bottom: .75rem; }
.field input, .field select, .field textarea { width: 100%; border: 1px solid var(--line); border-radius: var(--radius-sm); background: #fff; padding: .82rem .85rem; color: var(--ink); resize: vertical; min-height: 44px; }
.field textarea { line-height: 1.45; }
.button-row { display: flex; gap: .6rem; flex-wrap: wrap; align-items: center; }
.sticky-actions { margin-top: .55rem; }
.progress-card { margin-top: 1rem; border: 1px solid var(--line); background: var(--green-050); border-radius: var(--radius-md); padding: .9rem; }
.progress-top { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .55rem; color: var(--green-900); }
.progress-bar { height: .72rem; border-radius: 999px; overflow: hidden; background: #dfeade; }
.progress-bar div { height: 100%; width: 0%; border-radius: inherit; background: linear-gradient(90deg, var(--green-700), var(--gold)); transition: width .28s ease; }
.progress-card p { margin: .65rem 0 0; color: var(--muted); line-height: 1.45; }

.main-stage { display: grid; gap: 14px; }
.stage-title-block { background: rgba(255,255,255,.72); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 1.05rem 1.15rem; }
.stage-title-block h2 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(1.9rem, 4vw, 3rem); color: var(--green-900); margin: 0; letter-spacing: -.045em; }
.stage-title-block p:last-child { color: var(--muted); margin: .35rem 0 0; line-height: 1.45; }
.insight-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1rem; }
.insight-grid h3, .recommendation-panel h3 { color: var(--green-900); margin: 0 0 .65rem; }
.dna-list, .compass-list { display: grid; gap: .55rem; }
.dna-row, .compass-row { display: grid; grid-template-columns: 105px minmax(0, 1fr) 42px; gap: .6rem; align-items: center; font-size: .88rem; }
.meter { height: .52rem; background: #dde9dc; border-radius: 999px; overflow: hidden; }
.meter span { display: block; height: 100%; width: var(--w); background: linear-gradient(90deg, var(--green-700), var(--gold)); border-radius: inherit; }
.notice-list { margin: 0; padding-left: 1.1rem; color: var(--ink); line-height: 1.5; }
.warning-box { background: var(--gold-soft); border-left: 5px solid var(--gold); padding: .8rem; border-radius: var(--radius-sm); margin: 0; line-height: 1.45; }
.future-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.future-card { background: white; border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-soft); cursor: pointer; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.future-card:hover { transform: translateY(-2px); }
.future-card.active { border-color: var(--gold); box-shadow: 0 0 0 4px rgba(197,138,42,.22), var(--shadow-soft); }
.future-head { color: white; padding: .9rem; min-height: 86px; display: flex; align-items: center; gap: .7rem; background: var(--future-color, var(--green-800)); }
.future-head i { font-style: normal; font-size: 2rem; line-height: 1; }
.future-head b { display: block; line-height: 1.1; }
.future-head small { display: block; opacity: .90; margin-top: .2rem; line-height: 1.25; }
.future-visual, .compare-image { min-height: 210px; position: relative; background: linear-gradient(135deg, #dbe8d8, #aac7a3); background-position: center; background-size: cover; overflow: hidden; }
.future-visual::after, .future-overlay-preview::after { content: ""; position: absolute; inset: 0; background: var(--overlay-tint, rgba(7,63,45,.2)); mix-blend-mode: multiply; pointer-events: none; }
.future-visual.no-photo::before, .compare-image.no-photo::before { content: "Upload a photo to see overlays"; position: absolute; inset: 0; display: grid; place-items: center; padding: 1rem; text-align: center; color: white; font-weight: 950; text-shadow: 0 2px 10px rgba(0,0,0,.45); background: linear-gradient(135deg, rgba(5,37,27,.74), rgba(17,115,79,.52)); z-index: 1; }
.overlay-zone { position: absolute; z-index: 3; border: 2px solid rgba(255,255,255,.88); border-radius: 999px; background: rgba(255,255,255,.18); box-shadow: 0 0 0 999px rgba(5,37,27,.02); backdrop-filter: blur(1px); }
.overlay-zone.zone-a { width: 52%; height: 28%; left: 9%; bottom: 14%; transform: rotate(-7deg); }
.overlay-zone.zone-b { width: 30%; height: 38%; right: 10%; bottom: 24%; transform: rotate(8deg); }
.overlay-zone.zone-c { width: 44%; height: 18%; left: 28%; top: 14%; transform: rotate(3deg); }
.overlay-label { position: absolute; z-index: 4; max-width: 13rem; color: white; background: rgba(5,37,27,.86); border: 1px solid rgba(255,255,255,.24); border-radius: 999px; padding: .45rem .65rem; font-size: .78rem; font-weight: 900; line-height: 1.2; box-shadow: 0 10px 24px rgba(0,0,0,.22); }
.overlay-label.label-a { left: 8%; bottom: 11%; }
.overlay-label.label-b { right: 8%; top: 34%; }
.overlay-label.label-c { left: 25%; top: 10%; }
.future-body { padding: .95rem; }
.future-body p { color: var(--muted); line-height: 1.45; margin: 0 0 .8rem; }
.future-tags { display: flex; gap: .35rem; flex-wrap: wrap; }
.tag { background: var(--green-100); color: var(--green-900); border: 1px solid #d2e5d1; border-radius: 999px; padding: .28rem .52rem; font-size: .76rem; font-weight: 850; }
.lower-grid, .compare-grid, .design-grid, .export-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.compare-grid { grid-template-columns: 1fr 1fr 340px; }
.report-panel pre, .full-report { white-space: pre-wrap; word-break: break-word; background: #fbfdf9; border: 1px solid var(--line); border-radius: var(--radius-md); padding: 1rem; line-height: 1.5; min-height: 220px; max-height: 520px; overflow: auto; }
.next-steps ol { margin: 0; padding-left: 1.25rem; line-height: 1.65; }
.recommendation-box { border: 1px solid var(--line); background: linear-gradient(180deg, #fbfff8, #fff); border-radius: var(--radius-md); padding: 1rem; }
.recommendation-icon { width: 3.4rem; height: 3.4rem; display: grid; place-items: center; border-radius: 999px; background: var(--green-100); margin-bottom: .65rem; font-size: 1.6rem; }
.recommendation-box h2 { margin: 0 0 .65rem; color: var(--green-900); font-family: Georgia, "Times New Roman", serif; letter-spacing: -.03em; }
.recommendation-box p, .oracle { color: var(--muted); line-height: 1.5; }
.oracle { font-style: italic; margin-bottom: 0; }
.compare-image { min-height: 520px; border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
.score-item, .readiness-item, .health-item, .dashboard-card, .saved-card, .vision-card { border: 1px solid var(--line); background: #fff; border-radius: var(--radius-md); padding: .9rem; }
.score-item + .score-item, .readiness-item + .readiness-item, .health-item + .health-item, .saved-card + .saved-card { margin-top: .65rem; }
.movie-strip, .plant-grid, .dashboard-grid, .health-list, .vision-grid, .calendar-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.movie-card, .plant-card, .dashboard-card, .vision-card, .calendar-card { border: 1px solid var(--line); border-radius: var(--radius-md); padding: .95rem; background: #fff; min-height: 100px; }
.movie-card b, .plant-card b, .dashboard-card b { color: var(--green-900); }
.movie-card small, .plant-card small, .dashboard-card small, .vision-card small { display: block; color: var(--muted); margin-top: .35rem; line-height: 1.45; }
.action-roadmap-grid { display: grid; gap: .75rem; }
.action-step { border: 1px solid var(--line); border-left: 6px solid var(--green-700); border-radius: var(--radius-md); background: #fff; padding: .9rem; }
.action-step b { color: var(--green-900); }
.control-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin: 1rem 0; }
.control-grid label { display: flex; gap: .55rem; align-items: center; background: var(--green-050); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: .75rem; font-weight: 800; }
.control-grid input { width: auto; }
.prose { line-height: 1.6; }
table { width: 100%; border-collapse: collapse; overflow: hidden; border-radius: var(--radius-sm); }
th, td { text-align: left; border-bottom: 1px solid var(--line); padding: .75rem; vertical-align: top; }
th { background: var(--green-050); color: var(--green-900); }
.timeline-list { line-height: 1.7; }
.saved-card { display: grid; gap: .55rem; }
.saved-card .button-row { margin-top: .4rem; }
.toast { position: fixed; z-index: 100; right: 1rem; bottom: 1rem; background: var(--green-900); color: white; border-radius: 999px; padding: .78rem 1rem; font-weight: 900; box-shadow: var(--shadow); opacity: 0; transform: translateY(1rem); pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.toast.show { opacity: 1; transform: translateY(0); }

@media (max-width: 1240px) {
  .workspace { grid-template-columns: minmax(280px, 360px) minmax(0, 1fr); }
  .recommendation-panel { position: static; grid-column: 1 / -1; }
  .future-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .compare-grid { grid-template-columns: 1fr 1fr; }
  .compare-grid > .panel:last-child { grid-column: 1 / -1; }
}

@media (max-width: 860px) {
  .app { padding: 10px; }
  .hero-grid, .workspace, .lower-grid, .compare-grid, .design-grid, .export-grid, .insight-grid { grid-template-columns: 1fr; }
  .onboarding-strip { grid-template-columns: repeat(2, 1fr); }
  .intake-panel, .recommendation-panel { position: static; }
  .future-grid { grid-template-columns: 1fr; }
  .field-grid, .control-grid { grid-template-columns: 1fr; }
  .compare-image { min-height: 360px; }
  .tabs { top: 0; margin-inline: -10px; padding-inline: 10px; }
  .hero-copy h1 { max-width: 13ch; }
  .promise-card { align-self: stretch; }
}

@media (max-width: 520px) {
  .hero-shell { border-radius: 22px; }
  .utility-bar { align-items: flex-start; }
  .build-pill { font-size: .78rem; padding: .48rem .72rem; }
  .hero-copy h1 { font-size: clamp(2.55rem, 11.2vw, 3.65rem); line-height: .96; max-width: 11.7ch; }
  .lead { font-size: 1.02rem; line-height: 1.42; }
  .hero-shell { padding: 24px 20px; }
  .onboarding-strip { grid-template-columns: 1fr; }
  .button-row, .hero-actions { flex-direction: column; align-items: stretch; }
  button, .primary-upload { width: 100%; }
  .upload-drop, .upload-drop img { min-height: 245px; }
  .future-visual { min-height: 240px; }
  .panel-title { font-size: .76rem; }
}

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

/* v2.4 tester-first polish */
.quick-start-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  margin: 0 0 14px;
  padding: 1rem;
  background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(245,250,244,.94));
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}
.quick-start-card h2 { margin: 0; color: var(--green-900); font-family: Georgia, "Times New Roman", serif; letter-spacing: -.03em; font-size: clamp(1.45rem, 3vw, 2.2rem); }
.quick-start-card p { margin: .4rem 0 0; color: var(--muted); line-height: 1.45; }
.quick-start-steps { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .45rem; }
.quick-start-steps span, .clue-pills span, .overlay-legend span {
  display: inline-flex;
  align-items: center;
  min-height: 2.2rem;
  border: 1px solid var(--line);
  background: white;
  border-radius: 999px;
  padding: .38rem .65rem;
  font-weight: 850;
  color: var(--green-900);
  font-size: .84rem;
}
.mini-readiness { margin-top: .75rem; border: 1px solid #cfe1cc; background: #fbfff8; border-radius: var(--radius-md); padding: .82rem; }
.mini-readiness b { color: var(--green-900); }
.mini-readiness p { margin: .25rem 0 0; color: var(--muted); line-height: 1.45; }
.analysis-brief { margin-top: .8rem; display: inline-flex; max-width: 100%; border: 1px solid #d8e7d5; background: #fbfff8; color: var(--green-900); border-radius: 999px; padding: .52rem .75rem; font-weight: 900; line-height: 1.25; }
.insight-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.clue-pills { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .65rem; }
.specificity-text { color: var(--muted); line-height: 1.45; margin: 0; }
.notice-list.compact { font-size: .9rem; margin-bottom: 1rem; }
.first-move-banner { border: 1px solid #d8e7d5; border-left: 7px solid var(--gold); background: linear-gradient(135deg, #fffdf6, #fbfff8); border-radius: var(--radius-lg); padding: 1rem; box-shadow: var(--shadow-soft); }
.first-move-banner b { display: block; color: var(--green-900); text-transform: uppercase; letter-spacing: .08em; font-size: .78rem; margin-bottom: .25rem; }
.first-move-banner p { margin: 0; color: var(--ink); line-height: 1.45; font-size: 1.02rem; font-weight: 760; }
.overlay-badge { position: absolute; z-index: 5; top: .6rem; left: .6rem; border-radius: 999px; padding: .32rem .52rem; background: rgba(255,255,255,.88); color: var(--green-900); font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 950; box-shadow: 0 8px 18px rgba(0,0,0,.16); }
.overlay-line { position: absolute; z-index: 4; width: 42%; height: 2px; left: 31%; top: 50%; background: rgba(255,255,255,.92); box-shadow: 0 2px 12px rgba(0,0,0,.32); transform: rotate(-12deg); transform-origin: center; }
.overlay-label.label-d { right: 10%; bottom: 8%; background: rgba(197,138,42,.92); color: #1f1607; }
.overlay-caption { color: var(--muted); font-size: .78rem; font-weight: 850; margin: -.35rem 0 .7rem; }
.overlay-legend { display: flex; flex-wrap: wrap; gap: .45rem; padding: .75rem; border-top: 1px solid var(--line); background: #fbfff8; }
.risk-list { display: grid; gap: .65rem; }
.risk-item { border: 1px solid var(--line); border-left: 5px solid var(--gold); background: #fff; border-radius: var(--radius-md); padding: .85rem; line-height: 1.45; }

/* v2.4 overlay geometry variants: still abstract, but less same-same. */
.overlay-gathering .zone-a { width: 45%; height: 34%; left: 18%; bottom: 18%; transform: rotate(2deg); }
.overlay-gathering .zone-b { width: 25%; height: 25%; right: 13%; bottom: 23%; }
.overlay-gathering .zone-c { width: 36%; left: 34%; top: 15%; }
.overlay-wildlife .zone-a { width: 36%; height: 62%; left: 5%; bottom: 10%; transform: rotate(-3deg); }
.overlay-wildlife .zone-b { width: 30%; height: 48%; right: 7%; bottom: 12%; }
.overlay-wildlife .zone-c { width: 50%; height: 16%; left: 25%; top: 12%; }
.overlay-minimal .zone-a { width: 70%; height: 20%; left: 12%; bottom: 16%; transform: rotate(-2deg); }
.overlay-minimal .zone-b { width: 18%; height: 52%; right: 10%; bottom: 22%; }
.overlay-minimal .zone-c { width: 42%; height: 14%; left: 10%; top: 17%; }
.overlay-maker .zone-a { width: 46%; height: 38%; left: 8%; bottom: 16%; }
.overlay-maker .zone-b { width: 30%; height: 28%; right: 8%; bottom: 12%; }
.overlay-maker .zone-c { width: 46%; height: 15%; left: 32%; top: 17%; }
.overlay-productive .zone-a { width: 52%; height: 26%; left: 11%; bottom: 20%; transform: rotate(-5deg); }
.overlay-productive .zone-b { width: 25%; height: 30%; right: 10%; bottom: 14%; }
.overlay-belonging .zone-a { width: 40%; height: 30%; left: 10%; bottom: 18%; }
.overlay-belonging .zone-b { width: 28%; height: 42%; right: 12%; bottom: 18%; }
.constraint-privacy-gap .zone-b, .constraint-messy-edge .zone-b { height: 58%; top: 17%; bottom: auto; }
.constraint-access-awkward .overlay-line { width: 62%; left: 18%; top: 58%; transform: rotate(3deg); }
.constraint-water-risk .overlay-line { width: 58%; left: 21%; top: 62%; transform: rotate(9deg); background: rgba(145,214,255,.95); }

@media (max-width: 1240px) {
  .insight-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  .quick-start-card { grid-template-columns: 1fr; }
  .quick-start-steps { justify-content: flex-start; }
  .analysis-brief { border-radius: var(--radius-md); }
  .insight-grid { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .quick-start-steps span, .clue-pills span, .overlay-legend span { width: 100%; justify-content: center; }
  .overlay-label { max-width: 10.5rem; font-size: .72rem; }
  .overlay-label.label-b { right: .55rem; }
  .overlay-label.label-c { left: .55rem; top: 3.4rem; }
  .overlay-label.label-d { right: .55rem; bottom: .55rem; }
}

/* v2.4 guided tester polish */
.clue-coach {
  margin-top: .75rem;
  border: 1px solid #d9e8d6;
  background: linear-gradient(135deg, #fbfff8, #fffaf0);
  border-radius: var(--radius-md);
  padding: .85rem;
}
.clue-coach b { color: var(--green-900); display: block; }
.clue-coach p { margin: .3rem 0 .75rem; color: var(--muted); line-height: 1.45; }
.starter-suggestions { display: flex; gap: .45rem; flex-wrap: wrap; }
.starter-chip {
  width: auto;
  background: white;
  color: var(--green-900);
  border: 1px solid #cfe1cc;
  box-shadow: none;
  padding: .55rem .7rem;
  font-size: .84rem;
}
.starter-chip.active { background: var(--green-900); color: white; border-color: var(--green-900); }
.starter-empty { color: var(--muted); font-size: .9rem; line-height: 1.4; }
.type-under-building .zone-a { width: 62%; height: 22%; left: 10%; bottom: 18%; transform: rotate(-2deg); }
.type-under-building .zone-b { width: 20%; height: 62%; right: 10%; bottom: 16%; transform: rotate(4deg); }
.type-under-building .zone-c { width: 48%; height: 18%; left: 18%; top: 13%; transform: rotate(1deg); }
.constraint-shade-dark .overlay-line { width: 52%; left: 22%; top: 56%; transform: rotate(2deg); background: rgba(255,255,255,.9); }
.constraint-shade-dark .overlay-label.label-a { background: rgba(7,63,45,.92); }
.future-body p { font-size: clamp(.93rem, 1.8vw, 1rem); }
.full-report, .report-panel pre { font-size: clamp(.88rem, 2vw, .98rem); }

@media (max-width: 520px) {
  .clue-coach { padding: .75rem; }
  .starter-chip { width: 100%; justify-content: center; }
  .future-head { min-height: 74px; }
  .future-body { padding: .82rem; }
  .future-body p { line-height: 1.38; }
  .full-report, .report-panel pre { line-height: 1.45; }
}

/* v3.2 stability and tester clarity polish */
.tab-help,
.stability-note {
  margin: 0 0 .9rem;
  color: var(--muted);
  line-height: 1.5;
}
.stability-note {
  border: 1px solid #d9e8d6;
  background: #fbfff8;
  border-left: 5px solid var(--gold);
  border-radius: var(--radius-md);
  padding: .82rem;
  font-weight: 760;
}
.vision-card small,
.saved-card p,
.timeline-list small { line-height: 1.45; }
.full-report { white-space: pre-wrap; word-break: break-word; }
@media (max-width: 520px) {
  .tab-help,
  .stability-note { font-size: .94rem; }
}

/* v3.2 public beta handoff polish */
.beta-test-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  margin: 0 0 14px;
  padding: 1rem;
  background: linear-gradient(135deg, #fffaf0, #fbfff8);
  border: 1px solid #d9e8d6;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
}
.beta-test-card h2 { margin: 0; color: var(--green-900); font-family: Georgia, "Times New Roman", serif; letter-spacing: -.03em; font-size: clamp(1.35rem, 2.8vw, 2rem); }
.beta-test-card p { margin: .4rem 0 0; color: var(--muted); line-height: 1.45; }
.beta-checklist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; list-style: none; margin: 0; padding: 0; min-width: min(430px, 100%); }
.beta-checklist li { border: 1px solid var(--line); background: white; border-radius: 999px; padding: .55rem .75rem; font-weight: 900; color: var(--green-900); text-align: center; }
.beta-checklist li.done { background: var(--green-100); border-color: #b8d4b5; }
.share-import-field { margin-top: 1rem; }
.share-import-field textarea { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .84rem; }
.readiness-item span { display: inline-block; min-width: 1.5rem; }
@media (max-width: 860px) {
  .beta-test-card { grid-template-columns: 1fr; }
  .beta-checklist { min-width: 0; }
}
@media (max-width: 520px) {
  .beta-checklist { grid-template-columns: 1fr; }
  .beta-test-card { padding: .85rem; }
}


/* v3.2 beta handoff polish */
.handoff-status {
  margin: .8rem 0 1rem;
}
.readiness-meter {
  border: 1px solid #d9e8d6;
  background: linear-gradient(135deg, #fbfff8, #fffaf0);
  border-radius: var(--radius-md);
  padding: .85rem;
}
.readiness-meter b {
  display: block;
  color: var(--green-900);
  font-size: 1rem;
}
.readiness-meter span {
  display: block;
  color: var(--muted);
  margin: .25rem 0 .6rem;
  line-height: 1.35;
}
.readiness-meter div {
  height: .65rem;
  background: #e5eee2;
  border-radius: 999px;
  overflow: hidden;
}
.readiness-meter i {
  display: block;
  height: 100%;
  min-width: .8rem;
  background: linear-gradient(90deg, var(--green-700), var(--gold));
  border-radius: inherit;
}
.full-width { width: 100%; justify-content: center; }
@media (max-width: 520px) {
  .handoff-status { margin-top: .55rem; }
  .button-row .secondary, .button-row button { width: 100%; }
}


/* v3.2 smart tester flow */
.smart-next-card {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  background: linear-gradient(135deg, #ffffff, #eef7ec);
  border: 1px solid #cfe2ca;
  border-radius: var(--radius-md);
  padding: .85rem;
  box-shadow: var(--shadow-soft);
}
.smart-next-card b { color: var(--green-900); font-size: 1rem; }
.smart-next-card p { margin: .2rem 0 0; color: var(--muted); line-height: 1.35; }
.smart-next-card[data-state="analyse"] { border-color: rgba(197, 138, 42, .55); background: linear-gradient(135deg, #fffaf0, #eef7ec); }
.smart-next-card[data-state="tester"] { border-color: #a9d0b3; background: linear-gradient(135deg, #effaf1, #ffffff); }
.export-next-step {
  margin: .7rem 0;
  border: 1px solid var(--line);
  background: var(--green-050);
  color: var(--green-950);
  border-radius: var(--radius-sm);
  padding: .75rem;
  line-height: 1.4;
}
@media (max-width: 620px) {
  .smart-next-card { align-items: stretch; flex-direction: column; }
  .smart-next-card button { width: 100%; }
}

/* v3.2 autosave / recovery polish */
.session-recovery-card {
  margin: 1rem 0;
  border: 1px solid rgba(7, 63, 45, .14);
  background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(235,246,236,.96));
  border-radius: 1.35rem;
  padding: 1rem 1.15rem;
  box-shadow: var(--shadow-soft);
}
.session-recovery-card b { display: block; color: var(--green-900); font-size: 1.05rem; margin-bottom: .25rem; }
.session-recovery-card p { margin: .25rem 0 0; color: var(--muted); }
.session-recovery-card small { display: block; margin-top: .45rem; color: var(--muted); }
.autosave-card { border-color: rgba(212, 151, 38, .42); background: #fffdf6; }

/* v3.2 built-in self-test mode */
.self-test-card {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .85rem;
  border: 1px solid rgba(197, 138, 42, .35);
  background: linear-gradient(135deg, #fffdf6, #eef7ec);
  border-radius: var(--radius-md);
  padding: .9rem;
  box-shadow: var(--shadow-soft);
}
.self-test-card b,
.self-test-inline b { color: var(--green-900); }
.self-test-card p,
.self-test-inline p { margin: .25rem 0 0; color: var(--muted); line-height: 1.4; }
.self-test-inline {
  border: 1px solid rgba(197, 138, 42, .35);
  background: #fffdf6;
  border-radius: var(--radius-md);
  padding: .9rem;
  margin: .85rem 0 1rem;
}
.self-test-inline button { margin-top: .75rem; }
.self-test-btn { border-color: rgba(197, 138, 42, .55); }
@media (max-width: 620px) {
  .self-test-card { flex-direction: column; align-items: stretch; }
  .self-test-card button,
  .self-test-inline button { width: 100%; }
}


/* v3.2 public tester page and plant-style overlay */
.tester-page-shell {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(320px, 1.18fr);
  gap: 14px;
  align-items: start;
}
.tester-page-copy h2 {
  margin: 0;
  color: var(--green-900);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 5vw, 4.4rem);
  letter-spacing: -.055em;
  line-height: .98;
  max-width: 9ch;
}
.tester-page-copy p { color: var(--muted); line-height: 1.55; font-size: 1.03rem; }
.tester-page-actions { display: grid; gap: .65rem; margin: 1rem 0; }
.tester-simple-steps { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .55rem; }
.tester-simple-steps li { display: flex; align-items: center; gap: .65rem; border: 1px solid var(--line); background: #fbfff8; border-radius: 999px; padding: .55rem .7rem; font-weight: 850; color: var(--green-950); }
.tester-simple-steps b { width: 1.85rem; height: 1.85rem; display: grid; place-items: center; background: var(--green-900); color: #fff; border-radius: 999px; flex: 0 0 auto; }
.tester-visual-stage { border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden; background: #e8f0e4; box-shadow: var(--shadow-soft); }
.tester-visual-stage-inner { min-height: min(66vh, 560px); position: relative; background-size: cover; background-position: center; overflow: hidden; }
.tester-visual-stage-inner::after { content: ""; position: absolute; inset: 0; background: var(--overlay-tint, rgba(7,63,45,.20)); mix-blend-mode: multiply; pointer-events: none; }
.tester-visual-stage-inner.no-photo::before { content: "Run self-test or upload photo to see plant overlay"; position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-weight: 950; text-align: center; padding: 1rem; text-shadow: 0 2px 12px rgba(0,0,0,.38); background: linear-gradient(135deg, rgba(5,37,27,.72), rgba(17,115,79,.36)); z-index: 2; }
.visual-note { color: var(--muted); line-height: 1.45; margin: .75rem 0 0; font-weight: 760; }
.tester-page-result-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
.tester-result-card { border: 1px solid var(--line); background: rgba(255,255,255,.92); border-radius: var(--radius-lg); padding: 1rem; box-shadow: var(--shadow-soft); }
.tester-result-card b { display: block; color: var(--green-900); font-size: 1.05rem; }
.tester-result-card p { margin: .4rem 0 0; color: var(--muted); line-height: 1.45; }
.plant-picture-layer { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.plant-sprite, .mulch-swatch, .access-band { position: absolute; display: grid; place-items: center; filter: drop-shadow(0 10px 14px rgba(0,0,0,.32)); }
.plant-sprite { width: 4.2rem; height: 4.2rem; border-radius: 999px; background: radial-gradient(circle, rgba(255,255,255,.88), rgba(213,239,204,.38)); border: 1px solid rgba(255,255,255,.78); font-size: 2rem; }
.plant-sprite.fern { background: radial-gradient(circle, rgba(213,245,215,.95), rgba(37,112,66,.40)); }
.plant-sprite.grass { background: radial-gradient(circle, rgba(245,239,176,.92), rgba(98,126,42,.42)); }
.plant-sprite.pot { background: radial-gradient(circle, rgba(255,244,209,.96), rgba(131,87,44,.36)); }
.plant-sprite.flower { background: radial-gradient(circle, rgba(255,255,232,.94), rgba(226,178,52,.42)); }
.plant-sprite.veg { background: radial-gradient(circle, rgba(224,250,217,.96), rgba(54,129,56,.42)); }
.plant-sprite.herb { background: radial-gradient(circle, rgba(229,255,225,.96), rgba(45,143,78,.42)); }
.sprite-a { left: 13%; bottom: 18%; }
.sprite-b { left: 45%; bottom: 24%; }
.sprite-c { right: 12%; top: 28%; }
.sprite-d { left: 18%; bottom: 13%; }
.mulch-swatch { width: 54%; height: 18%; border-radius: 999px; background: linear-gradient(90deg, rgba(111,74,41,.68), rgba(186,144,87,.54)); border: 1px solid rgba(255,255,255,.52); transform: rotate(-3deg); }
.access-band { width: 58%; height: 10%; border-radius: 999px; background: rgba(255,255,255,.62); border: 1px solid rgba(255,255,255,.75); transform: rotate(3deg); }
.future-visual .plant-picture-layer { opacity: .88; }
.future-visual .plant-sprite { width: 3.3rem; height: 3.3rem; font-size: 1.65rem; }
.future-visual .mulch-swatch, .future-visual .access-band { height: 14%; }
@media (max-width: 980px) {
  .tester-page-shell { grid-template-columns: 1fr; }
  .tester-page-result-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .tester-page-result-grid { grid-template-columns: 1fr; }
  .tester-page-copy h2 { max-width: 10ch; }
  .tester-visual-stage-inner { min-height: 430px; }
  .plant-sprite { width: 3.4rem; height: 3.4rem; font-size: 1.65rem; }
  .future-visual .plant-sprite { width: 2.75rem; height: 2.75rem; font-size: 1.35rem; }
  .sprite-c { right: 7%; }
  .mulch-swatch { width: 62%; }
}

/* v3.2 AI render foundation */
.ai-render-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 1rem;
}
.render-status-card,
.render-cost-box,
.render-action-summary,
.render-warning-card {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, .78);
  border-radius: 1.1rem;
  padding: 1rem;
  margin: .75rem 0;
}
.render-status.offline { color: var(--muted); }
.render-status.connected b { color: var(--green); }
.render-warning,
.render-warning-card p,
.render-cost-box small {
  color: var(--muted);
}
.render-prompt-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.render-prompt-card,
.mock-render-card,
.empty-state {
  border: 1px solid var(--line);
  border-radius: 1rem;
  padding: 1rem;
  background: #fffef8;
  box-shadow: 0 10px 24px rgba(16, 57, 42, .06);
}
.render-prompt-card.selected {
  outline: 3px solid rgba(210, 149, 37, .35);
  border-color: var(--gold);
}
.render-prompt-head {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: .5rem;
}
.render-prompt-head small {
  margin-left: auto;
  color: var(--muted);
  font-size: .78rem;
}
.render-prompt-card pre {
  min-height: 9rem;
  max-height: 16rem;
  overflow: auto;
  white-space: pre-wrap;
  font-size: .82rem;
  line-height: 1.45;
  background: rgba(7, 63, 45, .05);
  padding: .8rem;
  border-radius: .8rem;
}
.mock-render-results {
  display: grid;
  gap: .75rem;
  margin-top: 1rem;
}
.mock-render-card small {
  display: block;
  color: var(--muted);
  margin: .25rem 0 .5rem;
}
@media (max-width: 900px) {
  .ai-render-grid,
  .render-prompt-grid {
    grid-template-columns: 1fr;
  }
}

/* v3.3 Property Futures Dashboard */
.futures-dashboard {
  display: grid;
  gap: 1rem;
}
.dashboard-hero-card {
  overflow: hidden;
  background: linear-gradient(135deg, rgba(7, 63, 45, 0.96), rgba(18, 86, 58, 0.88));
  color: #f5fff5;
}
.dashboard-hero-card .panel-title { border-color: rgba(255,255,255,.18); color: #dff7d8; }
.dashboard-hero-body {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) auto;
  gap: 1rem;
  align-items: center;
}
.dashboard-hero-body h2 { font-size: clamp(1.65rem, 4vw, 3rem); margin: .25rem 0; }
.dashboard-actions { display: flex; flex-wrap: wrap; gap: .65rem; justify-content: flex-end; }
.dashboard-main-grid {
  display: grid;
  grid-template-columns: minmax(260px, .85fr) minmax(320px, 1.7fr) minmax(260px, .9fr);
  gap: 1rem;
  align-items: start;
}
.today-card, .futures-card, .dashboard-recommendation-card, .evolution-card, .ai-dashboard-note { min-width: 0; }
.dashboard-today-visual {
  min-height: 360px;
  border-radius: 1.35rem;
  overflow: hidden;
  background: #102b20;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.16);
}
.dashboard-photo-frame {
  min-height: 360px;
  height: 100%;
  position: relative;
  background-size: cover;
  background-position: center;
  display: grid;
  place-items: center;
  isolation: isolate;
}
.dashboard-photo-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.45));
  z-index: 0;
}
.dashboard-photo-frame > * { z-index: 1; }
.dashboard-photo-empty {
  color: #f6fff5;
  font-weight: 800;
  text-align: center;
  padding: 1rem;
  background: rgba(0,0,0,.32);
  border-radius: 999px;
}
.today-summary {
  display: grid;
  gap: .55rem;
  margin-top: .9rem;
}
.today-summary b { font-size: 1.1rem; }
.dashboard-mini-pills { display: flex; flex-wrap: wrap; gap: .45rem; }
.dashboard-mini-pills span,
.future-card-meta span,
.confidence-chip {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border-radius: 999px;
  padding: .35rem .55rem;
  background: rgba(13, 88, 59, .10);
  border: 1px solid rgba(13, 88, 59, .16);
  font-size: .78rem;
  font-weight: 750;
}
.dashboard-futures-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
}
.dashboard-future-card {
  position: relative;
  overflow: hidden;
  border-radius: 1.25rem;
  border: 1px solid rgba(12, 67, 45, .14);
  background: rgba(255,255,255,.88);
  box-shadow: 0 16px 34px rgba(3, 36, 24, .08);
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.dashboard-future-card:hover,
.dashboard-future-card.active {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--future-color), white 18%);
  box-shadow: 0 22px 44px rgba(3, 36, 24, .14);
}
.dashboard-future-visual {
  min-height: 145px;
  background-size: cover;
  background-position: center;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.dashboard-future-visual::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, var(--overlay-tint), rgba(0,0,0,.22));
  z-index: 0;
}
.dashboard-future-glow {
  position: absolute;
  inset: 12% 14% auto auto;
  width: 46%;
  height: 46%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.44), transparent 60%);
  z-index: 1;
}
.future-ribbon {
  position: absolute;
  top: .7rem;
  right: .7rem;
  z-index: 4;
  background: #f5d76e;
  color: #273217;
  border-radius: 999px;
  padding: .28rem .5rem;
  font-size: .7rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.dashboard-future-copy {
  padding: .85rem;
}
.dashboard-future-copy h3 { margin: .15rem 0 .25rem; font-size: 1rem; }
.dashboard-future-copy p { margin: 0 0 .65rem; color: #395044; font-size: .86rem; }
.future-number { color: #6b7a70; font-size: .72rem; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.future-card-meta { display: flex; flex-wrap: wrap; gap: .4rem; }
.dashboard-recommendation { padding: .95rem; border-radius: 1.15rem; background: linear-gradient(135deg, rgba(11, 92, 64, .12), rgba(245, 215, 110, .16)); border: 1px solid rgba(11, 92, 64, .14); }
.dashboard-recommendation h2 { margin: .2rem 0 .45rem; }
.reco-kicker { font-size: .72rem; font-weight: 900; text-transform: uppercase; letter-spacing: .07em; color: #0b5c40; }
.dashboard-compass {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.compass-score {
  display: grid;
  justify-items: center;
  gap: .35rem;
  padding: .65rem;
  border-radius: 1rem;
  background: rgba(9, 70, 49, .06);
}
.compass-score b { font-size: .75rem; color: #344c40; }
.compass-ring {
  --score: 50%;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: conic-gradient(#0b5c40 var(--score), rgba(9,70,49,.13) 0);
  position: relative;
}
.compass-ring::after {
  content: "";
  position: absolute;
  inset: 7px;
  background: #fffaf0;
  border-radius: 50%;
}
.compass-ring i {
  position: relative;
  z-index: 1;
  font-style: normal;
  font-weight: 900;
}
.dashboard-next-step {
  border-radius: 1rem;
  padding: .85rem;
  background: rgba(245, 215, 110, .22);
  border: 1px solid rgba(155, 119, 20, .18);
}
.dashboard-next-step p { margin: .35rem 0 .75rem; }
.evolution-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .75rem;
}
.evolution-step {
  position: relative;
  padding: .85rem;
  border-radius: 1rem;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(11, 92, 64, .12);
}
.evolution-step span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #0b5c40;
  color: #fff;
  font-weight: 900;
  margin-bottom: .55rem;
}
.evolution-step b { display: block; margin-bottom: .25rem; }
.evolution-step p { margin: 0; color: #405247; font-size: .86rem; }
.ai-dashboard-grid { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 1rem; }

@media (max-width: 980px) {
  .dashboard-hero-body,
  .dashboard-main-grid,
  .ai-dashboard-grid { grid-template-columns: 1fr; }
  .dashboard-actions { justify-content: flex-start; }
  .dashboard-futures-grid { grid-template-columns: 1fr; }
  .evolution-strip { grid-template-columns: 1fr; }
  .dashboard-today-visual, .dashboard-photo-frame { min-height: 300px; }
}

/* v4.7 polished dashboard scenes: distinct concept visuals before real AI renders */
.dashboard-hero-card {
  background:
    radial-gradient(circle at 80% 18%, rgba(245, 215, 110, .16), transparent 30%),
    linear-gradient(135deg, rgba(3, 43, 30, 0.98), rgba(12, 83, 58, 0.93));
}
.dashboard-main-grid { grid-template-columns: minmax(250px, .78fr) minmax(330px, 1.82fr) minmax(250px, .86fr); }
.futures-card .panel-body { padding: .8rem; }
.dashboard-futures-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.dashboard-future-card { border-radius: 1.05rem; box-shadow: 0 18px 42px rgba(8, 41, 30, .11); background: #fffdf7; }
.dashboard-future-card.active { box-shadow: 0 0 0 4px rgba(197, 138, 42, .22), 0 22px 46px rgba(8, 41, 30, .16); }
.dashboard-future-visual.concept-scene {
  min-height: 172px;
  background: linear-gradient(180deg, #dfe7d8, #9ab38f 52%, #4a6a45 100%);
  overflow: hidden;
  isolation: isolate;
}
.dashboard-future-visual.concept-scene::before { display: none; }
.concept-preview-note {
  position: absolute;
  top: .55rem;
  left: .55rem;
  z-index: 8;
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(11,92,64,.16);
  border-radius: 999px;
  padding: .22rem .45rem;
  font-size: .62rem;
  font-weight: 900;
  color: #0b4d37;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.scene-layer, .scene-layer > span { position: absolute; display: block; }
.scene-layer { inset: 0; }
.scene-sky { inset: 0 0 48%; background: linear-gradient(180deg, rgba(255,248,219,.72), rgba(153,190,147,.35)); }
.scene-ground { inset: 44% 0 0; background: linear-gradient(180deg, rgba(69,111,62,.58), rgba(27,79,47,.88)); }
.scene-path {
  left: 8%; right: 8%; bottom: 18%; height: 18%;
  border-radius: 999px 45% 999px 40%;
  background: rgba(166, 132, 77, .78);
  transform: rotate(-4deg);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.16);
}
.scene-tree { font-size: 2.3rem; filter: drop-shadow(0 10px 18px rgba(0,0,0,.25)); opacity: .86; }
.tree-a { left: 4%; bottom: 20%; }
.tree-b { right: 8%; bottom: 28%; font-size: 2rem; }
.scene-label {
  left: .65rem; bottom: .65rem; z-index: 7;
  max-width: 70%;
  color: white;
  background: rgba(4, 56, 38, .83);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  padding: .32rem .55rem;
  font-size: .68rem;
  font-weight: 900;
  box-shadow: 0 10px 25px rgba(0,0,0,.2);
}
.scene-plant, .scene-feature, .scene-bed, .scene-fire, .scene-shed { z-index: 4; font-size: 2rem; filter: drop-shadow(0 12px 18px rgba(0,0,0,.28)); }
.scene-light { width: 8px; height: 8px; border-radius: 50%; background: #ffd36a; box-shadow: 0 0 18px 8px rgba(255,211,106,.38); z-index: 5; }
.light-a { left: 28%; top: 38%; } .light-b { right: 25%; top: 33%; }
.feature-door { right: 12%; bottom: 36%; }
.plant-a { left: 14%; bottom: 26%; } .plant-b { left: 42%; bottom: 31%; }
.scene-minimal .scene-path, .scene-minimal .scene-label {}
.scene-minimal .scene-mulch, .scene-mulch { left: 17%; right: 14%; bottom: 19%; height: 26%; background: rgba(126, 93, 47, .82); border-radius: 50% 42% 46% 52%; z-index: 2; }
.mass-a { left: 18%; bottom: 36%; } .mass-b { left: 46%; bottom: 38%; } .mass-c { right: 16%; bottom: 44%; }
.scene-gathering { background: linear-gradient(180deg, #243420, #8a531a 55%, #2d4d34); }
.scene-gathering .scene-sky { background: linear-gradient(180deg, rgba(40,48,34,.8), rgba(118,75,30,.45)); }
.scene-fire { left: 46%; bottom: 32%; font-size: 2.3rem; }
.scene-seat { width: 42px; height: 22px; border-radius: 12px; background: rgba(105,66,35,.86); bottom: 30%; z-index: 4; box-shadow: inset 0 0 0 2px rgba(255,255,255,.13); }
.seat-a { left: 25%; transform: rotate(12deg); } .seat-b { right: 22%; transform: rotate(-10deg); }
.scene-stringlights { left: 11%; right: 11%; top: 28%; height: 2px; border-top: 2px dotted rgba(255,223,130,.86); filter: drop-shadow(0 0 8px rgba(255,217,107,.65)); z-index: 6; transform: rotate(-4deg); }
.scene-productive { background: linear-gradient(180deg, #d9e6c6, #78914c 56%, #4d6932); }
.scene-bed { bottom: 30%; padding: .45rem; border-radius: 16px; background: rgba(95,69,38,.72); }
.bed-a { left: 14%; } .bed-b { left: 40%; bottom: 23%; } .bed-c { right: 14%; }
.scene-maker { background: linear-gradient(180deg, #cdd8d3, #667f76 58%, #344642); }
.scene-shed { right: 11%; bottom: 36%; }
.scene-bench { left: 20%; bottom: 31%; width: 44%; height: 14px; border-radius: 8px; background: rgba(116,82,45,.86); z-index: 4; box-shadow: 0 12px 0 rgba(53,42,30,.55); }
.scene-storage { left: 12%; bottom: 45%; width: 24%; height: 30%; border-radius: 10px; background: rgba(54,74,78,.78); box-shadow: inset 0 0 0 2px rgba(255,255,255,.1); z-index: 3; }
.scene-wildlife { background: linear-gradient(180deg, #d7d1ea, #6f7a55 55%, #294c37); }
.scene-water { right: 12%; bottom: 27%; width: 32%; height: 18%; border-radius: 50%; background: rgba(104,151,166,.72); z-index: 3; box-shadow: inset 0 0 0 3px rgba(255,255,255,.2); }
.feature-star { left: 47%; bottom: 47%; font-size: 2.5rem; color: #fff2a8; text-shadow: 0 0 16px rgba(255,231,126,.8); }
.flower-a { left: 18%; bottom: 33%; } .flower-b { left: 34%; bottom: 25%; }
.future-feature-list { margin: .45rem 0 .7rem; padding-left: 1.05rem; color: #3f5448; font-size: .78rem; line-height: 1.35; }
.future-feature-list li::marker { color: var(--future-color); }
.scene-belonging .scene-label { background: rgba(11,92,64,.86); }
.scene-minimal .scene-label { background: rgba(84,104,34,.86); }
.scene-gathering .scene-label { background: rgba(133,62,4,.9); }
.scene-productive .scene-label { background: rgba(77,112,38,.9); }
.scene-maker .scene-label { background: rgba(55,77,88,.9); }
.scene-wildlife .scene-label { background: rgba(62,56,120,.9); }
.evolution-strip { align-items: stretch; }
.evolution-step { overflow: hidden; background: linear-gradient(180deg, #fffdf7, #f2f6ec); }
.evolution-step::after { content: ""; display: block; height: 54px; margin: .65rem -.2rem -.2rem; border-radius: .75rem; background: linear-gradient(135deg, rgba(11,92,64,.16), rgba(245,215,110,.20)), radial-gradient(circle at 70% 35%, rgba(11,92,64,.28), transparent 24%); }
.dashboard-recommendation-card { box-shadow: 0 16px 38px rgba(3,36,24,.08); }
@media (min-width: 1160px) {
  .futures-dashboard { max-width: 1480px; margin-inline: auto; }
}
@media (max-width: 1080px) {
  .dashboard-futures-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .dashboard-futures-grid { grid-template-columns: 1fr; }
  .dashboard-future-visual.concept-scene { min-height: 210px; }
  .future-feature-list { font-size: .9rem; }
}


/* v4.7 premium dashboard polish: less cartoon, more concept-board */
:root {
  --premium-ink: #10251c;
  --premium-paper: #fffdf6;
  --premium-shadow: 0 22px 55px rgba(7, 42, 29, .16);
}
.hero-shell {
  background:
    radial-gradient(circle at 84% 16%, rgba(245, 215, 110, .16), transparent 24%),
    radial-gradient(circle at 12% 100%, rgba(130, 173, 101, .18), transparent 30%),
    linear-gradient(135deg, #052a1d 0%, #0b4d36 56%, #113f30 100%);
}
.futures-dashboard { gap: 1.15rem; }
.dashboard-hero-card {
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: 0 28px 80px rgba(6, 43, 29, .18);
}
.dashboard-hero-body h2 { letter-spacing: -.035em; }
.dashboard-main-grid {
  grid-template-columns: minmax(260px, .8fr) minmax(430px, 1.85fr) minmax(270px, .88fr);
  gap: 1.1rem;
}
.today-card, .futures-card, .dashboard-recommendation-card, .evolution-card {
  background: rgba(255, 253, 247, .94);
  border: 1px solid rgba(9, 70, 49, .13);
  box-shadow: var(--premium-shadow);
}
.today-card .panel-title, .futures-card .panel-title, .dashboard-recommendation-card .panel-title, .evolution-card .panel-title {
  letter-spacing: .12em;
}
.dashboard-today-visual {
  min-height: 410px;
  border-radius: 1.15rem;
  border: 1px solid rgba(9, 70, 49, .18);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18), 0 18px 36px rgba(8,40,28,.12);
}
.dashboard-photo-frame { min-height: 410px; }
.dashboard-photo-frame::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,.18) 55%, rgba(0,0,0,.55)),
    radial-gradient(circle at 72% 35%, rgba(255,255,255,.12), transparent 30%);
}
.today-summary {
  border-left: 4px solid rgba(197, 138, 42, .78);
  padding: .25rem 0 .25rem .8rem;
}
.dashboard-mini-pills span { background: #f1f7ed; }
.dashboard-futures-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.dashboard-future-card {
  border-radius: 1.22rem;
  background: linear-gradient(180deg, #fffdf7, #f7f5ec);
  border: 1px solid rgba(8, 53, 36, .16);
  box-shadow: 0 18px 46px rgba(7, 39, 27, .13);
}
.dashboard-future-card:hover, .dashboard-future-card.active {
  transform: translateY(-4px);
  box-shadow: 0 28px 60px rgba(7, 39, 27, .18);
}
.dashboard-future-card.active::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 3px solid rgba(197, 138, 42, .55);
  border-radius: inherit;
  pointer-events: none;
}
.dashboard-future-copy { padding: 1rem 1.05rem 1.1rem; }
.dashboard-future-copy h3 { font-size: 1.08rem; letter-spacing: -.015em; color: var(--premium-ink); }
.dashboard-future-copy p { color: #44594d; font-size: .9rem; }
.future-feature-list { color: #33483d; font-size: .82rem; }
.future-card-meta span {
  background: rgba(248, 246, 233, .96);
  border-color: rgba(9, 70, 49, .15);
}
.dashboard-future-card.active .future-card-meta span:first-child,
.future-ribbon {
  background: linear-gradient(135deg, #f7dd88, #cc8a2d);
  color: #1b2416;
}
.dashboard-future-visual.concept-scene {
  min-height: 190px;
  background: #1b3b2d;
  border-bottom: 1px solid rgba(8,53,36,.12);
}
.concept-preview-note {
  background: rgba(255, 253, 245, .88);
  backdrop-filter: blur(8px);
  color: #123f2f;
  box-shadow: 0 10px 24px rgba(0,0,0,.12);
}
.premium-scene, .premium-scene span { position: absolute; display: block; }
.premium-scene { inset: 0; overflow: hidden; background: #183629; }
.premium-sky { inset: 0 0 48%; background: linear-gradient(180deg, #eff1dd, #9fb58f); }
.premium-ground { inset: 43% 0 0; background: linear-gradient(180deg, #56744c, #173f2b); }
.premium-depth { border-radius: 50%; filter: blur(.5px); opacity: .58; }
.depth-a { width: 58%; height: 40%; right: -10%; top: 31%; background: rgba(22, 80, 50, .46); }
.depth-b { width: 48%; height: 34%; left: -8%; top: 48%; background: rgba(9, 53, 35, .42); }
.premium-path { left: 10%; right: 10%; bottom: 22%; height: 21%; border-radius: 55% 45% 48% 52%; transform: rotate(-4deg); background: linear-gradient(135deg, rgba(169, 136, 83, .78), rgba(112, 82, 47, .72)); box-shadow: inset 0 0 0 2px rgba(255,255,255,.12), 0 16px 28px rgba(0,0,0,.12); }
.premium-label { left: .75rem; bottom: .75rem; z-index: 20; max-width: 72%; color: #fff; background: rgba(9, 57, 39, .86); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; padding: .36rem .62rem; font-size: .68rem; font-weight: 900; box-shadow: 0 14px 30px rgba(0,0,0,.22); backdrop-filter: blur(7px); }
.premium-grain { inset: 0; z-index: 25; pointer-events: none; background-image: radial-gradient(circle at 20% 30%, rgba(255,255,255,.10) 0 1px, transparent 2px), radial-gradient(circle at 70% 80%, rgba(0,0,0,.10) 0 1px, transparent 2px); background-size: 46px 46px, 54px 54px; opacity: .35; mix-blend-mode: overlay; }
.premium-mass, .premium-habitat { border-radius: 50%; background: radial-gradient(circle at 35% 25%, rgba(170, 205, 132, .92), rgba(28, 91, 48, .78)); box-shadow: 0 12px 26px rgba(0,0,0,.16); }
.mass-left { width: 27%; height: 26%; left: 7%; bottom: 30%; }
.mass-right { width: 22%; height: 24%; right: 10%; bottom: 34%; }
.premium-border { left: 12%; right: 16%; bottom: 32%; height: 7px; border-radius: 999px; background: rgba(237, 225, 169, .75); box-shadow: 0 0 18px rgba(245, 215, 110, .26); transform: rotate(-2deg); }
.premium-light { width: 9px; height: 9px; border-radius: 50%; background: #f5d66f; box-shadow: 0 0 22px 9px rgba(245, 210, 96, .42); z-index: 12; }
.light-one { left: 31%; top: 38%; } .light-two { right: 26%; top: 36%; }
.feature-entry { right: 13%; top: 35%; width: 18%; height: 28%; border-radius: 18px 18px 8px 8px; background: linear-gradient(180deg, rgba(255,255,245,.56), rgba(230,183,96,.42)); box-shadow: inset 0 0 0 2px rgba(255,255,255,.2); }
.premium-sanctuary .premium-sky { background: linear-gradient(180deg, #e4ead8, #819975); }
.premium-sanctuary .premium-ground { background: linear-gradient(180deg, #667e53, #1f4a31); }
.premium-mulch-zone { left: 18%; right: 12%; bottom: 21%; height: 29%; background: linear-gradient(135deg, rgba(132, 94, 52, .76), rgba(82, 57, 34, .74)); border-radius: 50% 44% 48% 52%; box-shadow: inset 0 0 0 2px rgba(255,255,255,.10); }
.mass-low-a { width: 23%; height: 23%; left: 12%; bottom: 37%; } .mass-low-b { width: 24%; height: 22%; left: 42%; bottom: 38%; } .mass-low-c { width: 20%; height: 20%; right: 12%; bottom: 44%; }
.premium-shadow-screen { right: 8%; top: 18%; width: 28%; height: 54%; border-radius: 18px; background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.06)); box-shadow: inset 0 0 0 2px rgba(255,255,255,.08); }
.premium-gathering .premium-sky { background: linear-gradient(180deg, #2d3428, #7d542c); }
.premium-gathering .premium-ground { background: linear-gradient(180deg, #5e4a2e, #1d3729); }
.premium-patio { left: 22%; right: 18%; bottom: 20%; height: 36%; border-radius: 50%; background: radial-gradient(circle, rgba(137, 94, 54, .88), rgba(67, 49, 32, .72)); box-shadow: inset 0 0 0 3px rgba(255,255,255,.09); }
.premium-fire-glow { left: 45%; bottom: 36%; width: 12%; height: 16%; border-radius: 50%; background: radial-gradient(circle, #ffe38a, #ce5e11 45%, transparent 70%); box-shadow: 0 0 34px 18px rgba(247, 138, 29, .35); }
.premium-seat { bottom: 34%; width: 20%; height: 10%; border-radius: 16px; background: rgba(80, 54, 36, .86); box-shadow: 0 10px 18px rgba(0,0,0,.2); }
.seat-left { left: 22%; transform: rotate(12deg); } .seat-right { right: 18%; transform: rotate(-12deg); }
.premium-light-string { left: 10%; right: 10%; top: 27%; height: 3px; border-top: 3px dotted rgba(255, 225, 135, .94); filter: drop-shadow(0 0 8px rgba(255,205,92,.8)); transform: rotate(-4deg); }
.premium-productive .premium-sky { background: linear-gradient(180deg, #e7efcf, #94aa63); }
.premium-productive .premium-ground { background: linear-gradient(180deg, #6f8a46, #32542f); }
.premium-bed { bottom: 28%; width: 24%; height: 28%; border-radius: 18px; background: linear-gradient(145deg, rgba(118, 82, 44, .86), rgba(68, 47, 30, .78)); box-shadow: inset 0 0 0 2px rgba(255,255,255,.12), 0 13px 24px rgba(0,0,0,.16); }
.bed-one { left: 11%; } .bed-two { left: 38%; bottom: 22%; } .bed-three { right: 10%; }
.premium-row { height: 6px; border-radius: 999px; background: rgba(196, 226, 128, .70); transform: rotate(-9deg); }
.row-one { left: 15%; right: 17%; bottom: 43%; } .row-two { left: 15%; right: 20%; bottom: 36%; }
.premium-maker .premium-sky { background: linear-gradient(180deg, #d6ddd8, #778b82); }
.premium-maker .premium-ground { background: linear-gradient(180deg, #637a73, #30453f); }
.premium-work-pad { left: 12%; right: 12%; bottom: 21%; height: 30%; border-radius: 18px; background: linear-gradient(135deg, rgba(126, 111, 90, .82), rgba(68, 80, 80, .72)); box-shadow: inset 0 0 0 2px rgba(255,255,255,.10); }
.premium-bench-line { left: 22%; right: 26%; bottom: 39%; height: 10px; border-radius: 999px; background: rgba(126, 86, 48, .92); box-shadow: 0 10px 0 rgba(40,38,34,.55); }
.premium-storage-block { border-radius: 12px; background: linear-gradient(180deg, rgba(78,97,101,.86), rgba(44,63,66,.8)); box-shadow: inset 0 0 0 2px rgba(255,255,255,.08); }
.storage-a { left: 11%; bottom: 46%; width: 22%; height: 30%; } .storage-b { right: 13%; bottom: 41%; width: 18%; height: 26%; }
.premium-access-line { left: 13%; right: 10%; bottom: 25%; height: 4px; background: rgba(245, 236, 204, .75); border-radius: 999px; transform: rotate(-5deg); }
.premium-wildlife .premium-sky { background: linear-gradient(180deg, #e8e0ef, #8b8f68); }
.premium-wildlife .premium-ground { background: linear-gradient(180deg, #66734c, #1d4634); }
.premium-water { right: 12%; bottom: 28%; width: 35%; height: 24%; border-radius: 50%; background: radial-gradient(circle, rgba(134, 177, 188, .78), rgba(73, 122, 145, .56)); box-shadow: inset 0 0 0 3px rgba(255,255,255,.18), 0 16px 30px rgba(0,0,0,.14); }
.premium-sculpture { left: 45%; bottom: 47%; width: 13%; height: 22%; background: linear-gradient(180deg, #fff1a8, #d4a33a); clip-path: polygon(50% 0, 66% 34%, 100% 48%, 66% 62%, 50% 100%, 34% 62%, 0 48%, 34% 34%); filter: drop-shadow(0 0 18px rgba(246,211,94,.6)); }
.habitat-a { left: 13%; bottom: 30%; width: 25%; height: 25%; } .habitat-b { right: 17%; bottom: 42%; width: 18%; height: 20%; }
.premium-feature-line { left: 15%; right: 15%; bottom: 26%; height: 5px; border-radius: 999px; background: rgba(245, 236, 204, .58); transform: rotate(-6deg); }
.dashboard-recommendation {
  background: linear-gradient(135deg, rgba(255,253,246,.96), rgba(235,244,226,.94));
  border: 1px solid rgba(11,92,64,.16);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.60);
}
.dashboard-recommendation h2 { font-size: 1.35rem; letter-spacing: -.025em; }
.confidence-chip { background: rgba(11,92,64,.12); }
.dashboard-compass { gap: .65rem; }
.compass-score { background: linear-gradient(180deg, #fffdf7, #eef5e8); border: 1px solid rgba(9,70,49,.11); }
.compass-ring { width: 58px; height: 58px; box-shadow: 0 10px 18px rgba(7,42,29,.08); }
.evolution-strip { gap: .65rem; }
.evolution-step { box-shadow: 0 12px 28px rgba(8,40,28,.08); }
.evolution-step::after {
  height: 64px;
  background:
    linear-gradient(135deg, rgba(11,92,64,.10), rgba(245,215,110,.14)),
    radial-gradient(circle at 76% 34%, rgba(245,215,110,.40), transparent 16%),
    radial-gradient(circle at 27% 55%, rgba(11,92,64,.30), transparent 20%),
    linear-gradient(180deg, rgba(154,184,129,.40), rgba(65,111,69,.28));
}
@media (max-width: 980px) {
  .dashboard-main-grid { grid-template-columns: 1fr; }
  .dashboard-futures-grid { grid-template-columns: 1fr; }
  .dashboard-future-visual.concept-scene { min-height: 225px; }
  .dashboard-today-visual, .dashboard-photo-frame { min-height: 330px; }
  .dashboard-recommendation-card { order: -1; }
}
@media (min-width: 1080px) and (max-width: 1320px) {
  .dashboard-futures-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* v4.7 professional concept-board dashboard: less fake-render, more landscape design board */
.dashboard-hero-card {
  background:
    radial-gradient(circle at 78% 12%, rgba(245, 215, 110, .20), transparent 28%),
    radial-gradient(circle at 8% 90%, rgba(130, 177, 118, .20), transparent 30%),
    linear-gradient(135deg, #052d20 0%, #0b4d37 62%, #0f6044 100%);
}
.dashboard-main-grid {
  gap: 1.1rem;
  align-items: start;
}
.dashboard-futures-grid {
  gap: .95rem;
}
.dashboard-future-card {
  background: #fffdf7;
  border: 1px solid rgba(19, 79, 55, .16);
  box-shadow: 0 18px 40px rgba(8, 41, 30, .10);
}
.dashboard-future-card.active {
  box-shadow: 0 0 0 4px rgba(202, 150, 55, .22), 0 24px 55px rgba(8, 41, 30, .16);
}
.dashboard-future-visual.concept-scene {
  min-height: 232px;
  background: #e9eee4;
  border-bottom: 1px solid rgba(19, 79, 55, .10);
}
.dashboard-future-visual.concept-scene .premium-scene,
.dashboard-future-visual.concept-scene .premium-sky,
.dashboard-future-visual.concept-scene .premium-ground,
.dashboard-future-visual.concept-scene .premium-depth,
.dashboard-future-visual.concept-scene .premium-grain,
.dashboard-future-visual.concept-scene .premium-label { display: none; }
.concept-preview-note { display: none; }
.mood-board {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: 1.18fr .82fr;
  grid-template-rows: 1fr auto;
  gap: .55rem;
  padding: .72rem;
  overflow: hidden;
  color: #083d2c;
  background:
    linear-gradient(135deg, rgba(255,255,255,.78), rgba(255,250,238,.42)),
    radial-gradient(circle at 82% 24%, rgba(255,255,255,.45), transparent 30%),
    linear-gradient(180deg, #dce6d4 0%, #b5c8a8 49%, #385a3e 100%);
}
.mood-board::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(0,0,0,.06));
  pointer-events: none;
}
.mood-photo {
  position: relative;
  z-index: 1;
  grid-row: 1 / span 2;
  border-radius: 18px;
  background-size: cover;
  background-position: center;
  min-height: 100%;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.35), 0 18px 28px rgba(7, 43, 30, .18);
  overflow: hidden;
  filter: saturate(.88) contrast(.96);
}
.mood-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, rgba(6, 38, 26, .18), rgba(255,255,255,.06)),
    linear-gradient(180deg, transparent 44%, rgba(8, 42, 29, .32));
}
.mood-photo-empty {
  display: grid;
  align-content: end;
  padding: .7rem;
  background:
    linear-gradient(160deg, rgba(41,84,59,.20), rgba(255,255,255,.12)),
    repeating-linear-gradient(45deg, rgba(11,92,64,.08) 0 8px, rgba(255,255,255,.08) 8px 16px);
}
.mood-photo-empty b { font-size: .85rem; }
.mood-photo-empty small { font-weight: 800; opacity: .72; }
.mood-board-label {
  position: absolute;
  z-index: 6;
  top: .65rem;
  left: .65rem;
  border-radius: 999px;
  padding: .3rem .55rem;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(11,92,64,.18);
  font-size: .61rem;
  font-weight: 950;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: #0a4b35;
  box-shadow: 0 10px 24px rgba(8,41,30,.10);
}
.mood-plan {
  position: relative;
  z-index: 2;
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.58), rgba(255,255,255,.22)),
    linear-gradient(135deg, rgba(8, 55, 38, .12), rgba(197, 138, 42, .10));
  border: 1px solid rgba(255,255,255,.48);
  box-shadow: inset 0 0 0 1px rgba(11,92,64,.06);
  overflow: hidden;
}
.mood-plan::before {
  content: "";
  position: absolute;
  inset: 20% 12% 22%;
  border: 2px solid rgba(255,255,255,.55);
  border-radius: 42% 58% 46% 54%;
  transform: rotate(-6deg);
}
.mood-route, .mood-zone, .mood-pin { position: absolute; display: block; }
.mood-route {
  height: 4px;
  left: 12%;
  right: 10%;
  bottom: 30%;
  border-radius: 999px;
  background: rgba(255,255,255,.68);
  transform: rotate(-7deg);
  box-shadow: 0 0 0 1px rgba(6,56,39,.08);
}
.route-soft { bottom: 37%; transform: rotate(4deg); }
.route-room { bottom: 26%; transform: rotate(0deg); }
.route-service { bottom: 45%; transform: rotate(-3deg); }
.route-maker { bottom: 24%; transform: rotate(-1deg); background: rgba(236,236,219,.82); }
.route-feature { bottom: 34%; transform: rotate(-10deg); }
.mood-zone {
  border-radius: 50%;
  background: rgba(197, 138, 42, .26);
  border: 2px solid rgba(255,255,255,.45);
  box-shadow: 0 12px 28px rgba(8, 41, 30, .08);
}
.zone-front { width: 56%; height: 34%; right: 7%; bottom: 22%; }
.zone-shade { width: 68%; height: 42%; left: 8%; bottom: 18%; background: rgba(80, 118, 74, .28); }
.zone-patio { width: 58%; height: 42%; left: 22%; bottom: 20%; background: rgba(162, 79, 9, .25); }
.zone-bed { width: 48%; height: 38%; left: 11%; bottom: 23%; background: rgba(92, 126, 38, .28); border-radius: 28% 42% 28% 46%; }
.zone-work { width: 60%; height: 34%; left: 15%; bottom: 18%; background: rgba(76, 99, 107, .27); border-radius: 18px; }
.zone-water { width: 44%; height: 30%; right: 11%; bottom: 32%; background: rgba(76, 143, 157, .28); }
.mood-pin {
  z-index: 3;
  max-width: 58%;
  padding: .24rem .45rem;
  border-radius: 999px;
  color: white;
  background: rgba(4, 58, 40, .82);
  font-size: .56rem;
  font-weight: 950;
  box-shadow: 0 10px 20px rgba(0,0,0,.15);
  white-space: nowrap;
}
.pin-entry { left: 13%; top: 18%; }
.pin-light { right: 8%; bottom: 18%; background: rgba(169, 103, 14, .86); }
.pin-plant { left: 10%; bottom: 17%; }
.pin-calm { right: 10%; top: 21%; }
.pin-seat { left: 11%; bottom: 18%; background: rgba(118, 70, 34, .86); }
.pin-fire { right: 12%; top: 20%; background: rgba(177, 76, 8, .88); }
.pin-herb { left: 13%; top: 20%; }
.pin-bed { right: 9%; bottom: 19%; background: rgba(89, 112, 29, .88); }
.pin-store { right: 10%; top: 20%; background: rgba(50, 70, 78, .9); }
.pin-work { left: 12%; bottom: 17%; background: rgba(76, 78, 62, .9); }
.pin-habitat { left: 11%; top: 22%; }
.pin-star { right: 10%; bottom: 21%; background: rgba(91, 60, 119, .88); }
.mood-palette {
  z-index: 2;
  display: flex;
  align-items: center;
  gap: .35rem;
  align-self: start;
  justify-self: end;
  padding: .45rem;
  border-radius: 999px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(255,255,255,.45);
  box-shadow: 0 12px 22px rgba(8,41,30,.10);
}
.mood-swatch { width: 20px; height: 20px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.swatch-leaf { background: #295c37; } .swatch-cream { background: #f3ead0; } .swatch-gold { background: #c99531; }
.swatch-sage { background: #96aa7f; } .swatch-deep { background: #173d2d; } .swatch-bark { background: #76573a; }
.swatch-ember { background: #b85011; } .swatch-charcoal { background: #27312d; } .swatch-linen { background: #e7dbc2; }
.swatch-herb { background: #5f8b38; } .swatch-soil { background: #6b4b2f; } .swatch-straw { background: #d4b463; }
.swatch-steel { background: #6e8288; } .swatch-timber { background: #8c6138; } .swatch-gravel { background: #c7c4b5; }
.swatch-meadow { background: #76a34d; } .swatch-water { background: #7db0b5; } .swatch-stone { background: #b9b4a4; }
.mood-icons {
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .35rem;
  align-self: center;
}
.mood-icon {
  min-height: 30px;
  border-radius: 11px;
  background: rgba(255,255,255,.64);
  border: 1px solid rgba(255,255,255,.45);
  display: grid;
  place-items: center;
  box-shadow: 0 10px 18px rgba(8,41,30,.08);
}
.mood-icon::before { font-size: 1rem; filter: saturate(.75); }
.icon-entry::before { content: "⌂"; } .icon-light::before, .icon-lights::before { content: "✦"; } .icon-seat::before { content: "◠"; }
.icon-shade::before { content: "◐"; } .icon-texture::before { content: "≈"; } .icon-rest::before { content: "•"; }
.icon-fire::before { content: "◉"; } .icon-herbs::before { content: "✿"; } .icon-bed::before { content: "▭"; } .icon-water::before { content: "◌"; }
.icon-bench::before { content: "▰"; } .icon-storage::before { content: "▣"; } .icon-access::before { content: "→"; }
.icon-butterfly::before { content: "✣"; } .icon-feature::before { content: "◆"; }
.mood-materials {
  z-index: 2;
  display: grid;
  gap: .25rem;
  align-self: end;
}
.mood-materials span {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  padding: .23rem .44rem;
  border-radius: 999px;
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(255,255,255,.42);
  font-size: .58rem;
  font-weight: 900;
  color: rgba(7, 55, 38, .92);
}
.mood-intent {
  z-index: 3;
  position: absolute;
  right: .72rem;
  bottom: .72rem;
  max-width: 52%;
  border-radius: 14px;
  padding: .45rem .5rem;
  background: rgba(255,250,238,.82);
  border: 1px solid rgba(255,255,255,.54);
  box-shadow: 0 16px 30px rgba(8,41,30,.12);
}
.mood-intent b { display: block; font-size: .62rem; text-transform: uppercase; letter-spacing: .06em; color: #194d37; }
.mood-intent span { display: block; font-size: .62rem; color: #40564a; line-height: 1.25; margin-top: .12rem; }
.mood-belonging { background: linear-gradient(180deg, #f0ead6 0%, #a9bd8b 48%, #315842 100%); }
.mood-minimal { background: linear-gradient(180deg, #dde8d2 0%, #91ab84 48%, #294d36 100%); }
.mood-gathering { background: linear-gradient(180deg, #d9d0bd 0%, #8c6332 48%, #253b31 100%); }
.mood-productive { background: linear-gradient(180deg, #e6e1bc 0%, #98a85f 48%, #42602e 100%); }
.mood-maker { background: linear-gradient(180deg, #d8dddd 0%, #78908d 48%, #334541 100%); }
.mood-wildlife { background: linear-gradient(180deg, #dfd6e8 0%, #7a9c7a 48%, #284a39 100%); }
.dashboard-future-copy {
  padding: 1rem;
  background: linear-gradient(180deg, #fffdf7, #fbf7eb);
}
.dashboard-future-copy h3 { font-size: 1.07rem; letter-spacing: -.01em; }
.future-feature-list { margin: .75rem 0 .8rem; padding-left: 1.1rem; color: #3e5548; }
.future-feature-list li { margin: .2rem 0; }
.dashboard-recommendation-card .panel-body { display: grid; gap: .9rem; }
.dashboard-recommendation {
  background:
    linear-gradient(135deg, rgba(11, 92, 64, .12), rgba(245, 215, 110, .22)),
    #fffdf7;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.55);
}
.compass-score {
  background: #fffaf0;
  box-shadow: inset 0 0 0 1px rgba(11,92,64,.08);
}
.evolution-step {
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(247,241,224,.82));
  box-shadow: 0 14px 28px rgba(8,41,30,.08);
}
@media (max-width: 980px) {
  .dashboard-main-grid { grid-template-columns: 1fr; }
  .dashboard-futures-grid { grid-template-columns: 1fr; }
  .dashboard-future-visual.concept-scene { min-height: 265px; }
  .mood-board { grid-template-columns: 1fr .72fr; padding: .65rem; }
  .mood-intent { max-width: 68%; }
}
@media (max-width: 520px) {
  .dashboard-future-visual.concept-scene { min-height: 250px; }
  .mood-board { grid-template-columns: 1.1fr .8fr; gap: .45rem; }
  .mood-materials span { font-size: .54rem; }
  .mood-board-label { font-size: .54rem; }
  .mood-intent { display: none; }
}

/* v4.7 public beta polish: clearer mobile dashboard, bigger boards, fewer mystery controls */
:root {
  --v37-paper: #fffdf7;
  --v37-ink: #082d22;
  --v37-soft: #edf4eb;
}
.futures-dashboard {
  gap: 1rem;
}
.dashboard-hero-card {
  border-radius: 2rem;
  overflow: hidden;
  box-shadow: 0 28px 80px rgba(7, 42, 30, .18);
}
.dashboard-hero-body {
  align-items: center;
}
.dashboard-hero-body h2 {
  letter-spacing: -.045em;
}
.dashboard-hero-body p {
  max-width: 68ch;
}
.dashboard-main-grid {
  grid-template-columns: minmax(260px, .92fr) minmax(0, 2.2fr) minmax(260px, .92fr);
  gap: 1rem;
}
.dashboard-futures-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.05rem;
}
.dashboard-future-card {
  border-radius: 1.45rem;
  overflow: hidden;
  background: var(--v37-paper);
  border: 1px solid rgba(9, 67, 47, .16);
  box-shadow: 0 20px 46px rgba(8, 41, 30, .12);
}
.dashboard-future-card.active {
  border-color: rgba(197,138,42,.75);
}
.dashboard-future-card .future-ribbon {
  top: .7rem;
  right: .7rem;
  border: 1px solid rgba(255,255,255,.55);
  box-shadow: 0 12px 24px rgba(8,41,30,.16);
}
.dashboard-future-visual.concept-scene {
  min-height: 330px;
}
.mood-board-v37 {
  grid-template-columns: 1.36fr .72fr;
  grid-template-rows: 1fr auto auto;
  padding: .85rem;
  gap: .58rem;
}
.mood-board-v37 .mood-photo {
  border-radius: 22px;
  grid-row: 1 / span 3;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.45), 0 20px 34px rgba(7, 43, 30, .18);
}
.mood-board-v37 .mood-photo::after {
  background:
    linear-gradient(180deg, rgba(5, 37, 26, .04), rgba(5, 37, 26, .18)),
    linear-gradient(120deg, rgba(255,255,255,.08), rgba(197,138,42,.08));
}
.mood-board-v37 .mood-plan {
  min-height: 126px;
  border-radius: 20px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.36)),
    radial-gradient(circle at 70% 28%, rgba(255,255,255,.36), transparent 32%),
    linear-gradient(135deg, rgba(8, 55, 38, .10), rgba(197, 138, 42, .10));
}
.mood-board-v37 .mood-icons {
  display: none;
}
.mood-board-v37 .mood-palette {
  justify-self: stretch;
  justify-content: center;
  border-radius: 18px;
}
.mood-board-v37 .mood-swatch {
  width: 24px;
  height: 24px;
}
.mood-board-v37 .mood-materials {
  grid-template-columns: 1fr;
  gap: .32rem;
}
.mood-board-v37 .mood-materials span {
  width: auto;
  justify-content: center;
  font-size: .66rem;
  padding: .34rem .52rem;
}
.mood-board-v37 .mood-intent {
  display: none;
}
.mood-board-v37 .mood-board-label {
  font-size: .6rem;
  max-width: calc(100% - 1.5rem);
}
.future-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .8rem;
}
.future-title-row > strong {
  flex: 0 0 auto;
  color: var(--green-900);
  background: #e9f3e7;
  border: 1px solid rgba(11,92,64,.16);
  border-radius: 999px;
  padding: .34rem .48rem;
  font-size: .86rem;
}
.future-intent-line {
  margin: .65rem 0 .25rem;
  padding: .62rem .68rem;
  border-radius: 1rem;
  background: linear-gradient(135deg, rgba(11,92,64,.08), rgba(197,138,42,.10));
  border: 1px solid rgba(11,92,64,.10);
}
.future-intent-line b {
  display: block;
  color: var(--green-900);
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: .62rem;
  margin-bottom: .18rem;
}
.future-intent-line span {
  color: #40584b;
  font-size: .82rem;
  line-height: 1.35;
}
.future-card-meta span:nth-child(2) {
  background: #fff6df;
  border-color: rgba(197,138,42,.22);
}
.dashboard-recommendation-card {
  position: sticky;
  top: .7rem;
}
.dashboard-recommendation {
  border-radius: 1.25rem;
  padding: 1.05rem;
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.95), transparent 28%),
    linear-gradient(135deg, rgba(11, 92, 64, .14), rgba(245, 215, 110, .24)),
    #fffdf7;
}
.dashboard-recommendation h2 {
  font-size: clamp(1.35rem, 2.4vw, 1.85rem);
}
.compass-score {
  border-radius: 1rem;
  padding: .62rem .7rem;
}
.evolution-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: .7rem;
}
.evolution-step {
  border-radius: 1.1rem;
  min-height: 135px;
}
.evolution-step span {
  background: #0b5c40;
  color: white;
}
@media (max-width: 1120px) {
  .dashboard-main-grid { grid-template-columns: 1fr; }
  .dashboard-recommendation-card { position: static; order: -1; }
  .dashboard-futures-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .dashboard-hero-card { border-radius: 1.45rem; }
  .dashboard-hero-body { padding: 1rem; }
  .dashboard-futures-grid { grid-template-columns: 1fr; }
  .dashboard-future-visual.concept-scene { min-height: 360px; }
  .mood-board-v37 { grid-template-columns: 1fr; grid-template-rows: 1.35fr auto auto auto; }
  .mood-board-v37 .mood-photo { grid-row: auto; min-height: 190px; }
  .mood-board-v37 .mood-plan { min-height: 104px; }
  .mood-board-v37 .mood-palette { justify-self: start; }
  .mood-board-v37 .mood-materials { display: flex; flex-wrap: wrap; }
  .mood-board-v37 .mood-materials span { width: fit-content; }
  .future-title-row > strong { font-size: .8rem; }
  .evolution-strip { grid-template-columns: 1fr; }
}
@media (max-width: 430px) {
  .dashboard-future-visual.concept-scene { min-height: 345px; }
  .mood-board-v37 { padding: .65rem; }
  .mood-board-v37 .mood-photo { min-height: 170px; }
  .mood-board-v37 .mood-board-label { font-size: .52rem; }
  .future-feature-list { display: none; }
  .future-intent-line span { font-size: .78rem; }
}


/* v4.7 generated Property Futures Board: public tester result board for any upload */
.app { background: radial-gradient(circle at top right, rgba(245,215,110,.10), transparent 28%), linear-gradient(180deg, #f8f6ec, #edf4eb 52%, #f7f2e4); }
.tab-row { scrollbar-width: thin; }
.tab-row .tab[data-tab="deploy"],
.tab-row .tab[data-tab="tester"],
.tab-row .tab[data-tab="history"] { opacity: .72; }
.dashboard-hero-card {
  background:
    radial-gradient(circle at 85% 14%, rgba(245,215,110,.24), transparent 28%),
    radial-gradient(circle at 12% 96%, rgba(126,173,112,.24), transparent 30%),
    linear-gradient(135deg, #072d21, #0b5c40 62%, #194734);
  color: #fffdf5;
}
.dashboard-hero-card .panel-title { color: rgba(255,255,255,.78); border-color: rgba(255,255,255,.14); }
.dashboard-hero-body { padding: clamp(1rem, 3vw, 1.55rem); }
.dashboard-hero-body h2 { font-size: clamp(2rem, 7vw, 4.25rem); line-height: .94; max-width: 780px; }
.dashboard-hero-body p { color: rgba(255,255,255,.85); font-size: 1.02rem; }
.dashboard-actions { gap: .55rem; }
.dashboard-actions #createBoardBtn { background: #f5d76e; color: #0c321f; box-shadow: 0 18px 38px rgba(0,0,0,.20); }
.dashboard-main-grid { align-items: start; }
.today-card, .futures-card, .dashboard-recommendation-card, .evolution-card { border-color: rgba(10,72,50,.12); }
.dashboard-photo-frame { min-height: 360px; border-radius: 1.35rem; box-shadow: inset 0 0 0 1px rgba(255,255,255,.24), 0 20px 50px rgba(7,42,29,.16); }
.board-generation-note { margin-top: .75rem; padding: .75rem; border: 1px solid rgba(11,92,64,.12); border-radius: 1rem; background: linear-gradient(135deg, rgba(11,92,64,.08), rgba(245,215,110,.16)); }
.board-generation-note b { display: block; color: #0b5c40; margin-bottom: .2rem; }
.board-generation-note small { display: block; color: #40584b; line-height: 1.35; }
.dashboard-futures-grid { gap: 1rem; }
.dashboard-future-card { background: #fffef9; border-radius: 1.55rem; box-shadow: 0 24px 58px rgba(9,48,34,.12); }
.dashboard-future-card.active { box-shadow: 0 0 0 4px rgba(245,215,110,.30), 0 28px 66px rgba(9,48,34,.18); }
.dashboard-future-visual.concept-scene { min-height: 360px; background: #f4f1df; }
.mood-board-v38 { grid-template-columns: 1.25fr .8fr; grid-template-rows: 1fr auto auto; gap: .72rem; padding: .92rem; background: linear-gradient(135deg, rgba(255,255,255,.52), rgba(247,242,226,.20)); }
.mood-board-v38 .mood-photo { min-height: 260px; border-radius: 24px; filter: saturate(1.03) contrast(1.02); }
.mood-board-v38 .mood-photo::before { content: "property today"; position: absolute; left: .7rem; top: .7rem; z-index: 3; padding: .25rem .48rem; border-radius: 999px; background: rgba(7,47,33,.72); color: white; font-size: .58rem; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.mood-board-v38 .mood-plan { min-height: 172px; border: 1px solid rgba(10,72,50,.12); box-shadow: inset 0 0 0 1px rgba(255,255,255,.42); }
.mood-board-v38 .mood-palette { background: rgba(255,255,255,.82); border: 1px solid rgba(10,72,50,.10); padding: .46rem; }
.mood-board-v38 .mood-swatch { width: 30px; height: 30px; box-shadow: inset 0 0 0 2px rgba(255,255,255,.55), 0 8px 18px rgba(7,42,29,.13); }
.mood-board-v38 .mood-materials { grid-template-columns: 1fr; }
.mood-board-v38 .mood-materials span { background: #fffdf5; border-color: rgba(10,72,50,.14); color: #153d2b; font-weight: 850; }
.adaptive-tag-row { display: flex; flex-wrap: wrap; gap: .36rem; margin: .55rem 0 .55rem; }
.adaptive-tag-row span { border-radius: 999px; padding: .32rem .55rem; background: #eef5ea; border: 1px solid rgba(11,92,64,.12); color: #244838; font-size: .74rem; font-weight: 850; }
.recommendation-action { margin: .78rem 0; padding: .8rem; border-radius: 1rem; background: rgba(255,255,255,.72); border: 1px solid rgba(11,92,64,.13); }
.recommendation-action b { display: block; color: #0b5c40; text-transform: uppercase; letter-spacing: .06em; font-size: .65rem; margin-bottom: .25rem; }
.recommendation-action span { display: block; color: #263f34; line-height: 1.35; }
.dashboard-compass { gap: .55rem; }
.compass-score { background: linear-gradient(180deg, #fffef8, #eef5ea); border: 1px solid rgba(11,92,64,.11); }
.evolution-card .panel-body { overflow-x: auto; }
.evolution-strip { min-width: 780px; }
.evolution-step { background: linear-gradient(180deg, #fffdf7, #f1f6ed); box-shadow: 0 12px 25px rgba(7,42,29,.06); }
.ai-dashboard-note { opacity: .92; }
@media (max-width: 980px) {
  .dashboard-hero-body { display: grid; gap: 1rem; }
  .dashboard-main-grid { grid-template-columns: 1fr; }
  .dashboard-photo-frame { min-height: 330px; }
  .dashboard-future-visual.concept-scene { min-height: 405px; }
  .mood-board-v38 { grid-template-columns: 1fr; grid-template-rows: auto auto auto; }
  .mood-board-v38 .mood-photo { min-height: 255px; }
  .mood-board-v38 .mood-plan { min-height: 135px; }
  .mood-board-v38 .mood-materials { display: flex; flex-wrap: wrap; }
}
@media (max-width: 540px) {
  .dashboard-hero-body h2 { font-size: clamp(2rem, 12vw, 3.3rem); }
  .dashboard-actions { display: grid; grid-template-columns: 1fr; }
  .dashboard-actions > * { width: 100%; text-align: center; justify-content: center; }
  .dashboard-photo-frame { min-height: 280px; }
  .dashboard-future-visual.concept-scene { min-height: 382px; }
  .mood-board-v38 { padding: .72rem; gap: .55rem; }
  .mood-board-v38 .mood-photo { min-height: 230px; }
  .mood-board-v38 .mood-plan { min-height: 122px; }
  .future-title-row { gap: .5rem; }
  .dashboard-future-copy { padding: .9rem; }
  .future-feature-list { display: none; }
  .adaptive-tag-row span { font-size: .7rem; }
  .evolution-strip { min-width: 620px; }
}

/* v4.7 result landing polish: land at a clear generated board summary, not mid-card */
.result-ready-card {
  border: 1px solid rgba(11, 92, 64, .12);
  box-shadow: 0 22px 52px rgba(7, 42, 29, .10);
  background: linear-gradient(135deg, #fffef8, #eef6ea 62%, #fff7dc);
}
.result-ready-card .panel-title {
  color: #0a4b34;
}
.result-ready-body {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(220px, .95fr) minmax(140px, .48fr);
  gap: .9rem;
  align-items: stretch;
}
.result-ready-body h2 {
  font-size: clamp(1.45rem, 4vw, 2.75rem);
  line-height: 1;
  margin: .2rem 0 .5rem;
  color: #073f2d;
  letter-spacing: -.035em;
}
.result-ready-body p { color: #465e52; }
.result-summary-answer,
.result-summary-confidence {
  border-radius: 1.25rem;
  border: 1px solid rgba(11,92,64,.12);
  background: rgba(255,255,255,.72);
  padding: .9rem;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.54);
}
.result-summary-answer span,
.result-summary-confidence span {
  display: block;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: #5f7468;
  font-weight: 900;
  font-size: .66rem;
  margin-bottom: .28rem;
}
.result-summary-answer b {
  display: block;
  color: #073f2d;
  font-size: 1.05rem;
  line-height: 1.12;
}
.result-summary-answer p {
  margin: .5rem 0 .75rem;
  font-size: .88rem;
  line-height: 1.35;
}
.result-summary-answer button {
  width: 100%;
  padding: .7rem .8rem;
}
.result-summary-confidence {
  display: grid;
  place-items: center;
  text-align: center;
}
.result-summary-confidence b {
  display: block;
  font-size: clamp(2rem, 7vw, 3.2rem);
  color: #0b5c40;
  line-height: .95;
}
.result-summary-confidence small {
  color: #64756d;
  line-height: 1.25;
}
.mood-board-v38 .mood-photo::before { display: none; content: none; }
.mood-board-v38 .mood-photo {
  min-height: 282px;
}
.dashboard-future-visual.concept-scene {
  overflow: hidden;
}
@media (max-width: 980px) {
  .result-ready-body { grid-template-columns: 1fr; }
  .result-summary-confidence { place-items: start; text-align: left; }
  .result-summary-confidence b { font-size: 2.35rem; }
}
@media (max-width: 540px) {
  .result-ready-card { border-radius: 1.35rem; }
  .result-ready-body { padding: .95rem; gap: .7rem; }
  .result-ready-body h2 { font-size: 1.75rem; }
  .result-summary-answer,
  .result-summary-confidence { border-radius: 1rem; padding: .78rem; }
  .dashboard-hero-card { margin-top: .25rem; }
  .dashboard-main-grid { gap: .82rem; }
  .dashboard-future-visual.concept-scene { min-height: 400px; }
  .mood-board-v38 .mood-photo { min-height: 250px; }
}


/* v4.0 public tester flow: fewer dashboard goblin tunnels */
.public-tabs { align-items: center; gap: .7rem; }
.advanced-tabs { display: inline-flex; position: relative; }
.advanced-tabs summary { list-style: none; cursor: pointer; border: 1px solid rgba(7,63,45,.18); border-radius: 999px; padding: .8rem 1rem; font-weight: 900; color: var(--green-dark); background: rgba(255,255,255,.92); box-shadow: var(--shadow-soft); white-space: nowrap; }
.advanced-tabs summary::-webkit-details-marker { display:none; }
.advanced-tab-list { position: absolute; top: calc(100% + .55rem); right: 0; z-index: 30; min-width: 220px; padding: .65rem; background: rgba(255,255,255,.98); border: 1px solid rgba(7,63,45,.14); border-radius: 24px; box-shadow: 0 22px 55px rgba(7,63,45,.2); display: grid; gap: .45rem; }
.advanced-tab-list .tab { width: 100%; justify-content: center; }
.public-flow-card { margin: 1rem 0; padding: clamp(1.1rem, 3vw, 1.6rem); border-radius: 30px; background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(236,247,238,.96)); border: 1px solid rgba(7,63,45,.12); box-shadow: var(--shadow-soft); display:grid; grid-template-columns: 1.2fr .8fr; gap: 1rem; align-items:center; }
.public-flow-card h2 { margin: .15rem 0 .35rem; font-family: var(--serif); color: var(--green-dark); font-size: clamp(1.6rem, 4vw, 2.6rem); }
.public-flow-card p { margin: 0; color: var(--muted); font-size: 1.05rem; line-height: 1.55; }
.public-flow-steps { display:grid; grid-template-columns: repeat(4,1fr); gap:.45rem; }
.public-flow-steps span { text-align:center; padding:.75rem .4rem; border-radius:999px; background:#fff; border:1px solid rgba(7,63,45,.12); font-weight:900; color:var(--green-dark); }
@media (max-width: 760px) {
  .public-flow-card { grid-template-columns: 1fr; }
  .public-flow-steps { grid-template-columns: repeat(2,1fr); }
  .advanced-tabs { width: auto; }
  .advanced-tab-list { right: auto; left: 0; }
  .dashboard-hero-body { gap: 1rem; }
}


/* v4.7 share-ready beta polish */
.public-share-card { border: 1px solid rgba(207,151,44,.28); background: linear-gradient(135deg, rgba(255,252,242,.98), rgba(236,247,238,.95)); }
.share-ready-body { display:flex; align-items:center; justify-content:space-between; gap: 1rem; }
.share-ready-body b { color: var(--green-dark); font-size:1.1rem; }
.share-ready-body p { color: var(--muted); margin:.25rem 0 0; line-height:1.45; }
.share-ready-body button { flex: 0 0 auto; }
.dashboard-future-card { overflow:hidden; }
.dashboard-future-copy { padding-top: 1.1rem; }
.future-title-row strong { background: linear-gradient(135deg, #e7f4df, #fff8dc); border: 1px solid rgba(207,151,44,.28); }
.result-ready-card { border-color: rgba(207,151,44,.25); }
.result-ready-body h2 { font-family: var(--serif); font-size: clamp(1.45rem, 6vw, 2.2rem); color: var(--green-dark); margin:.15rem 0 .35rem; }
@media (max-width: 760px) {
  .share-ready-body { align-items: stretch; flex-direction: column; }
  .share-ready-body button { width:100%; }
  .dashboard-future-visual { min-height: 320px; }
  .dashboard-main-grid { gap: 1.1rem; }
}


/* v4.7 public tester mobile result-flow polish */
body.board-ready .dashboard-hero-card {
  border: 1px solid rgba(245, 215, 110, .22);
}
body.board-ready .result-ready-card {
  border: 2px solid rgba(207, 151, 44, .42);
  background: linear-gradient(180deg, #fffaf0 0%, #f7fbf1 100%);
  box-shadow: 0 22px 58px rgba(7,63,45,.13);
}
.result-ready-card .panel-title {
  color: #fff !important;
  background: linear-gradient(135deg, #053f2d, #0f6a49);
  border-bottom: 0;
  letter-spacing: .08em;
}
.result-summary-answer {
  background: #ffffff;
  border: 1px solid rgba(7,63,45,.12);
  border-radius: 1.1rem;
  padding: 1rem;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.65);
}
.result-summary-answer button,
#dashboardCopyTopBtn,
#dashboardCopyBtn {
  min-height: 46px;
}
.result-summary-confidence {
  background: #0b5139;
  color: #fff;
  border-radius: 1.1rem;
  padding: 1rem;
}
.result-summary-confidence span,
.result-summary-confidence small { color: rgba(255,255,255,.82); }
.dashboard-actions button,
.dashboard-actions .primary-upload { text-align: center; }
.board-jump-note {
  display: none;
  margin-top: .55rem;
  color: rgba(255,255,255,.78);
  font-weight: 800;
}
body.board-ready .board-jump-note { display: block; }

@media (max-width: 760px) {
  body.board-ready .hero-shell {
    padding-bottom: .45rem;
  }
  body.board-ready .dashboard-hero-card {
    border-radius: 1.15rem;
    margin-top: 0;
  }
  body.board-ready .dashboard-hero-body {
    padding: .88rem;
    gap: .65rem;
  }
  body.board-ready .dashboard-hero-body h2 {
    font-size: clamp(1.85rem, 10vw, 2.85rem);
    line-height: .98;
    margin: .05rem 0 .35rem;
  }
  body.board-ready .dashboard-hero-body p {
    font-size: .96rem;
    line-height: 1.38;
  }
  body.board-ready .dashboard-actions {
    gap: .55rem;
  }
  body.board-ready .dashboard-actions .primary-upload,
  body.board-ready .dashboard-actions button {
    min-height: 48px;
    padding: .75rem 1rem;
    font-size: .92rem;
  }
  .result-ready-card {
    margin-top: .65rem;
    border-radius: 1.1rem;
  }
  .result-ready-body {
    padding: .9rem;
    gap: .75rem;
  }
  .result-ready-body h2 {
    font-size: clamp(1.45rem, 8vw, 2.15rem) !important;
    line-height: 1.02;
  }
  .result-summary-copy p,
  .result-summary-answer p {
    font-size: .95rem;
    line-height: 1.42;
  }
  .result-summary-confidence {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .8rem;
  }
  .result-summary-confidence b {
    font-size: 2rem;
    line-height: 1;
  }
  .dashboard-main-grid {
    gap: .9rem !important;
  }
  .dashboard-future-card {
    border-radius: 1.25rem;
  }
  .dashboard-future-visual.concept-scene {
    min-height: 325px !important;
  }
  .dashboard-future-copy {
    padding: .9rem !important;
  }
  .adaptive-tag-row {
    gap: .42rem;
  }
}

@media (max-width: 430px) {
  body.board-ready .dashboard-hero-body h2 {
    font-size: clamp(1.65rem, 11vw, 2.55rem);
  }
  body.board-ready .dashboard-hero-body p {
    font-size: .9rem;
  }
  body.board-ready .dashboard-actions .primary-upload,
  body.board-ready .dashboard-actions button {
    font-size: .88rem;
  }
  .result-ready-body { padding: .78rem; }
  .dashboard-future-visual.concept-scene { min-height: 300px !important; }
}

/* v4.7 public tester result polish: shorter intro, clearer result, stronger mobile flow */
body.board-ready .dashboard-hero-card {
  margin-top: .35rem;
  border-radius: 1.35rem;
  box-shadow: 0 14px 36px rgba(7,42,30,.12);
}
body.board-ready .dashboard-hero-card .panel-title { display: none; }
body.board-ready .dashboard-hero-body {
  padding: .85rem 1rem;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .75rem;
}
body.board-ready .dashboard-hero-body h2 {
  font-size: clamp(1.25rem, 4vw, 2rem);
  line-height: 1.05;
  margin: 0;
}
body.board-ready .dashboard-hero-body p {
  font-size: .9rem;
  margin: .2rem 0 0;
  max-width: 54ch;
}
body.board-ready .dashboard-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .45rem;
}
body.board-ready .dashboard-actions .self-test-btn,
body.board-ready .dashboard-actions #uploadBtn,
body.board-ready .dashboard-actions #boardJumpNote { display: none; }
body.board-ready .dashboard-actions button {
  padding: .72rem .9rem;
  font-size: .9rem;
  min-height: auto;
}
.result-ready-card {
  scroll-margin-top: 76px;
  border-color: rgba(207,151,44,.35);
  box-shadow: 0 18px 44px rgba(7, 42, 29, .12);
}
.result-ready-card .panel-title {
  color: #0b5c40;
  opacity: 1;
  background: linear-gradient(90deg, rgba(245,215,110,.22), transparent);
}
.result-ready-body {
  grid-template-columns: minmax(0, 1.25fr) minmax(210px, .78fr) minmax(170px, .58fr);
}
.result-top-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: .8rem;
}
.result-top-actions button {
  flex: 1 1 160px;
  padding: .78rem .9rem;
}
.result-summary-confidence {
  background: linear-gradient(135deg, #073f2d, #0b5c40 68%, #174a36);
  border-color: rgba(255,255,255,.20);
  color: white;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 18px 34px rgba(7,42,29,.20);
}
.result-summary-confidence b {
  color: #f5d76e;
  text-shadow: 0 2px 14px rgba(0,0,0,.20);
}
.result-summary-confidence span,
.result-summary-confidence small {
  color: rgba(255,255,255,.90);
}
.public-share-card {
  margin-top: .85rem;
  box-shadow: 0 16px 38px rgba(7,42,29,.08);
}
.public-tabs {
  gap: .45rem;
  padding-bottom: .5rem;
}
.public-tabs .tab,
.public-tabs .advanced-tabs summary {
  padding: .68rem .86rem;
  font-size: .92rem;
}
.dashboard-futures-grid {
  scroll-margin-top: 84px;
}
@media (max-width: 760px) {
  body.board-ready .dashboard-hero-body {
    grid-template-columns: 1fr;
    padding: .78rem;
  }
  body.board-ready .dashboard-hero-body h2 { font-size: 1.28rem; }
  body.board-ready .dashboard-hero-body p { display: none; }
  body.board-ready .dashboard-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .45rem;
  }
  body.board-ready .dashboard-actions button { width: 100%; }
  .result-ready-body {
    padding: .9rem;
    grid-template-columns: 1fr;
  }
  .result-ready-body h2 { font-size: 1.85rem; }
  .result-summary-answer { order: 2; }
  .result-summary-confidence { order: 3; align-items: start; text-align: left; min-height: auto; }
  .result-summary-confidence b { font-size: 2.1rem; }
  .result-top-actions { display: grid; grid-template-columns: 1fr; }
  .public-tabs .tab,
  .public-tabs .advanced-tabs summary { padding: .62rem .78rem; font-size: .88rem; }
  .dashboard-future-visual.concept-scene { min-height: 340px; }
  .mood-board-v38 .mood-photo { min-height: 220px; }
}
@media (max-width: 420px) {
  .result-ready-body h2 { font-size: 1.65rem; }
  body.board-ready .dashboard-actions { grid-template-columns: 1fr; }
  body.board-ready .dashboard-actions #dashboardCopyBtn { display: none; }
  .public-tabs .tab,
  .public-tabs .advanced-tabs summary { padding: .56rem .7rem; }
}


/* v4.7 public beta handoff + safe render path polish */
.result-ready-card .panel-title {
  color: #073f2d !important;
  background: linear-gradient(90deg, rgba(245,215,110,.42), rgba(255,255,255,.78));
  text-shadow: none;
  opacity: 1;
}
.result-summary-confidence small { font-weight: 750; }
.send-tester-card {
  border: 1px solid rgba(7,63,45,.16);
  background: linear-gradient(135deg, #fffdf4, #edf8ed);
  box-shadow: 0 18px 44px rgba(7,42,29,.09);
}
.send-tester-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, auto);
  gap: 1rem;
  align-items: center;
}
.send-tester-body h2 { margin: 0 0 .25rem; color: var(--green-dark); }
.send-tester-body p { margin: 0 0 .65rem; color: var(--muted); }
.send-tester-body ol { margin: .25rem 0 0 1.2rem; color: #41584b; line-height: 1.55; }
.ai-provider-checklist {
  border: 1px solid rgba(197,138,42,.25);
  background: linear-gradient(135deg, rgba(255,248,222,.95), rgba(238,248,238,.92));
}
.ai-provider-checklist li { margin-bottom: .35rem; }
.render-actions-panel .button-row button:first-child { background: #073f2d; }
.render-actions-panel .button-row button.secondary { border-color: rgba(197,138,42,.45); background: #fff8df; color: #4b3311; }
@media (max-width: 760px) {
  .send-tester-body { grid-template-columns: 1fr; }
  .send-tester-body button { width: 100%; }
  .result-ready-card .panel-title { letter-spacing: .12em; }
  .public-tabs { gap: .38rem; }
}

/* v5.0/v6.0 public beta handoff polish */
.share-helper {
  display: grid;
  gap: .35rem;
  margin: .9rem 0 1rem;
  padding: .95rem 1rem;
  border: 1px solid rgba(11, 92, 64, .14);
  border-radius: 1rem;
  background: linear-gradient(135deg, rgba(236,247,238,.95), rgba(255,252,242,.96));
  color: #243b2f;
}
.share-helper b { color: var(--green-dark); letter-spacing: .02em; }
.share-helper span { color: var(--muted); line-height: 1.45; }
.send-tester-card .panel-title { letter-spacing: .13em; }
.handoff-status .readiness-meter span { color: #3c574a; font-weight: 850; }
@media (max-width: 560px) {
  .send-tester-body h2 { font-size: clamp(1.65rem, 9vw, 2.2rem); }
  .share-helper { padding: .82rem; }
}

/* v5.0/v6.0 AI render roadmap and safe backend proxy prep */
.ai-roadmap-hero {
  background: linear-gradient(135deg, #073f2d, #0d6a48);
  color: #f7fff8;
  border-color: rgba(255,255,255,.16);
  box-shadow: 0 22px 54px rgba(7,63,45,.18);
}
.ai-roadmap-hero .panel-title {
  color: #e9ffed;
  border-color: rgba(255,255,255,.18);
}
.ai-roadmap-hero h2 { color: #fffef2; margin-top: 0; }
.ai-roadmap-hero p { color: rgba(255,255,255,.86); }
.render-roadmap-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .75rem;
  margin-top: 1rem;
}
.render-roadmap-steps span {
  display: grid;
  gap: .35rem;
  align-content: start;
  min-height: 6rem;
  padding: .85rem;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 1rem;
  background: rgba(255,255,255,.08);
  font-weight: 850;
}
.render-roadmap-steps b {
  display: inline-grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  background: var(--gold);
  color: #1e1608;
}
.render-ready-item {
  display: grid;
  grid-template-columns: 2rem 1fr;
  gap: .65rem;
  align-items: start;
  padding: .65rem 0;
  border-bottom: 1px solid rgba(7,63,45,.08);
}
.render-ready-item:last-child { border-bottom: 0; }
.render-ready-item span {
  display: inline-grid;
  place-items: center;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 999px;
  font-weight: 950;
}
.render-ready-item.ready span { background: rgba(24,122,76,.14); color: #075334; }
.render-ready-item.blocked span { background: rgba(210,149,37,.16); color: #6c4612; }
.render-ready-item p { margin: 0; color: #31483c; }
.backend-contract-panel {
  background: linear-gradient(135deg, #fffef7, #eef8f0);
}
.endpoint-preview {
  padding: 1rem;
  border-radius: 1rem;
  background: #082d22;
  color: #e8fff1;
  white-space: pre-wrap;
  overflow: auto;
  font-size: .9rem;
}
.provider-plan-card {
  margin-top: 1rem;
  padding: 1rem;
  border-radius: 1rem;
  border: 1px solid rgba(7,63,45,.15);
  background: rgba(255,255,255,.72);
}
.provider-plan-card ul { margin-bottom: 0; }
@media (max-width: 900px) {
  .render-roadmap-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .render-roadmap-steps { grid-template-columns: 1fr; }
  .render-roadmap-steps span { min-height: auto; }
}

.render-safety-strip{display:grid;gap:.55rem;margin:1rem 0;padding:1rem;border-radius:1.25rem;background:rgba(7,63,45,.08);border:1px solid rgba(7,63,45,.16)}
.render-safety-strip span{display:inline-flex;align-items:center;width:max-content;max-width:100%;padding:.35rem .6rem;border-radius:999px;background:#fff;color:#073f2d;border:1px solid rgba(7,63,45,.16);font-weight:800;overflow-wrap:anywhere}


/* v6.0 plain-English AI render setup */
.ai-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .75rem;
  margin-top: 1rem;
}
.ai-status-grid > div,
.provider-explainer-grid > div,
.ai-next-steps span {
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 1rem;
  padding: .85rem;
  background: rgba(255,255,255,.11);
}
.ai-status-grid b,
.provider-explainer-grid b { display:block; font-size:.82rem; letter-spacing:.05em; text-transform:uppercase; }
.ai-status-grid span { display:block; margin-top:.25rem; font-weight:900; color:#fff4b8; }
.ai-next-steps {
  display:grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap:.7rem;
}
.ai-next-steps span { background:#fffef8; border-color:var(--line); }
.ai-next-steps b {
  display:inline-grid; place-items:center; width:2rem; height:2rem; border-radius:999px;
  background:var(--green); color:white; margin-right:.35rem;
}
.provider-explainer-grid {
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:.75rem;
  margin: 1rem 0;
}
.provider-explainer-grid > div { background:rgba(7,63,45,.05); border-color:var(--line); }
.provider-explainer-grid span { display:block; color:var(--muted); margin:.4rem 0 .55rem; }
.provider-explainer-grid i {
  display:inline-block; font-style:normal; font-weight:900; font-size:.78rem; text-transform:uppercase;
  border-radius:999px; padding:.25rem .55rem; background:#fff2cd; color:#705015;
}
.developer-details summary {
  cursor:pointer; list-style:none; font-weight:900; letter-spacing:.08em; text-transform:uppercase;
  color:#fff; background:var(--green); padding:1rem 1.25rem; border-radius:1.2rem 1.2rem 0 0;
}
.developer-details summary::-webkit-details-marker { display:none; }
.render-status-statusline {
  display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:.6rem; margin-top:.7rem;
}
.render-status-statusline span {
  display:flex; justify-content:space-between; gap:.6rem; padding:.6rem .75rem; border-radius:.8rem; background:rgba(7,63,45,.06); font-weight:800;
}
.render-status-statusline em { font-style:normal; color:var(--muted); font-weight:700; }
@media (max-width: 900px) {
  .ai-status-grid, .provider-explainer-grid, .ai-next-steps { grid-template-columns:1fr; }
  .render-status-statusline { grid-template-columns:1fr; }
}

/* v6.0 one-future render simulation */
.one-render-preview { margin: 1rem 0; }
.one-render-card {
  border: 1px solid rgba(7,63,45,.16);
  background: linear-gradient(180deg, #fffef8, #f3f8ef);
  border-radius: 1.15rem;
  padding: 1rem;
  box-shadow: 0 14px 34px rgba(16,57,42,.08);
}
.one-render-top {
  display:flex;
  align-items:center;
  gap:.8rem;
  margin-bottom:.8rem;
}
.one-render-top > span {
  display:grid;
  place-items:center;
  width:2.75rem;
  height:2.75rem;
  border-radius:1rem;
  background:rgba(210,149,37,.16);
  font-size:1.4rem;
}
.one-render-top b { display:block; font-size:1.05rem; }
.one-render-top small { display:block; color:var(--muted); font-weight:700; }
.render-cost-pills {
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
  margin:.75rem 0;
}
.render-cost-pills span {
  display:inline-flex;
  align-items:center;
  border:1px solid var(--line);
  background:white;
  color:var(--green);
  border-radius:999px;
  padding:.35rem .65rem;
  font-weight:900;
  font-size:.82rem;
}
.one-render-card h3 { margin:.9rem 0 .45rem; }
.one-render-card pre {
  max-height: 15rem;
  overflow:auto;
  white-space:pre-wrap;
  font-size:.82rem;
  line-height:1.45;
  color:#123025;
  background:rgba(7,63,45,.06);
  border:1px solid rgba(7,63,45,.10);
  border-radius:.9rem;
  padding:.85rem;
}
.mock-render-card { border-left: 5px solid var(--gold); }
@media (max-width: 620px) {
  .one-render-card { padding:.9rem; }
  .render-cost-pills { gap:.4rem; }
  .one-render-card pre { max-height: 12rem; }
}

/* v6.0 mock render preview and first provider setup polish */
.mock-render-visual-panel {
  position: relative;
  overflow: hidden;
  border-radius: 1.1rem;
  border: 1px solid rgba(7,63,45,.18);
  background: linear-gradient(135deg, #173f31, #eef6e6);
  min-height: 18rem;
  margin: .85rem 0;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.28), 0 12px 28px rgba(16,57,42,.12);
}
.mock-render-visual-panel.compact { min-height: 15rem; }
.mock-render-visual-panel .mood-board {
  min-height: 18rem;
  height: 100%;
  border-radius: 0;
  box-shadow: none;
}
.mock-render-visual-panel.compact .mood-board { min-height: 15rem; }
.mock-render-watermark {
  position: absolute;
  right: .75rem;
  bottom: .75rem;
  z-index: 6;
  border-radius: 999px;
  padding: .45rem .75rem;
  background: rgba(255, 254, 248, .92);
  color: var(--green);
  font-weight: 950;
  font-size: .78rem;
  box-shadow: 0 10px 22px rgba(0,0,0,.12);
}
.prompt-summary-box {
  padding: .9rem;
  border-radius: 1rem;
  border: 1px solid rgba(210,149,37,.28);
  background: linear-gradient(135deg, rgba(255,246,212,.82), rgba(255,254,248,.88));
  margin: .75rem 0;
}
.prompt-summary-box b { display:block; margin-bottom:.35rem; color:#5e4211; text-transform:uppercase; letter-spacing:.06em; font-size:.82rem; }
.prompt-summary-box p { margin:0; color:#31483c; }
.render-safe-note {
  padding: .75rem .9rem;
  border-radius: .95rem;
  background: rgba(7,63,45,.07);
  border: 1px solid rgba(7,63,45,.12);
  color: #243f33;
}
.mock-render-card-v59 {
  display: grid;
  gap: .75rem;
  border-left: 0;
  border: 1px solid rgba(7,63,45,.16);
  background: linear-gradient(180deg, #fffef8, #f1f8ee);
}
.mock-render-card-head {
  display:flex;
  align-items:center;
  gap:.75rem;
}
.mock-render-card-head > span {
  display:grid;
  place-items:center;
  width:2.7rem;
  height:2.7rem;
  border-radius:1rem;
  background:rgba(210,149,37,.16);
  font-size:1.35rem;
}
.mock-render-card-head b { display:block; font-size:1.05rem; }
.mock-result-grid {
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:.6rem;
}
.mock-result-grid div {
  border:1px solid var(--line);
  border-radius:.9rem;
  padding:.65rem;
  background:#fff;
}
.mock-result-grid b { display:block; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-size:.75rem; }
.mock-result-grid span { display:block; margin-top:.25rem; font-weight:900; color:var(--green); }
.first-provider-setup-panel {
  background: linear-gradient(180deg, #fffef8, #eef7ec);
}
.provider-setup-grid {
  display:grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap:.65rem;
  margin-top:1rem;
}
.provider-setup-grid div {
  border:1px solid rgba(7,63,45,.14);
  border-radius:1rem;
  padding:.8rem;
  background:#fff;
  box-shadow: 0 10px 24px rgba(16,57,42,.05);
}
.provider-setup-grid b {
  display:grid;
  place-items:center;
  width:2rem;
  height:2rem;
  border-radius:999px;
  background:var(--gold);
  color:#231604;
  margin-bottom:.55rem;
}
.provider-setup-grid span { display:block; font-weight:950; color:var(--green); }
.provider-setup-grid small { display:block; margin-top:.4rem; color:var(--muted); line-height:1.35; }
.developer-details summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  background: linear-gradient(135deg, #073f2d, #0f6849);
  color:#fffef8 !important;
}
.developer-details summary span { color:#fffef8; }
.developer-details summary small {
  color:#dff7dc;
  font-size:.78rem;
  letter-spacing:0;
  text-transform:none;
}
@media (max-width: 900px) {
  .provider-setup-grid, .mock-result-grid { grid-template-columns:1fr; }
}
@media (max-width: 620px) {
  .mock-render-visual-panel, .mock-render-visual-panel .mood-board { min-height: 15rem; }
  .mock-render-visual-panel.compact, .mock-render-visual-panel.compact .mood-board { min-height: 13rem; }
  .mock-render-watermark { left:.65rem; right:auto; bottom:.65rem; }
}

/* v6.0 mock render clarity */
.mock-render-card-v60 {
  display: grid;
  gap: .85rem;
  border-left: 0;
  border: 1px solid rgba(7,63,45,.16);
  background: linear-gradient(180deg, #fffef8, #eef7ec);
  box-shadow: 0 16px 36px rgba(16,57,42,.08);
}
.mock-preview-header {
  display:flex;
  align-items:center;
  gap:.8rem;
  padding:.25rem 0 .15rem;
}
.mock-preview-header > span {
  display:grid;
  place-items:center;
  width:3rem;
  height:3rem;
  border-radius:1rem;
  background:rgba(210,149,37,.18);
  font-size:1.45rem;
}
.mock-preview-header b { display:block; font-size:1.15rem; color:var(--green); }
.mock-preview-header small { display:block; color:var(--muted); font-weight:800; line-height:1.35; }
.mock-result-grid-v60 div { background:#fffef8; }
.prompt-chip-grid {
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:.65rem;
  margin:.35rem 0;
}
.prompt-chip-card {
  padding:.75rem .85rem;
  border-radius:1rem;
  border:1px solid rgba(7,63,45,.12);
  background:#fff;
  box-shadow: 0 10px 22px rgba(16,57,42,.04);
}
.prompt-chip-card b {
  display:block;
  text-transform:uppercase;
  letter-spacing:.07em;
  color:var(--muted);
  font-size:.74rem;
  margin-bottom:.28rem;
}
.prompt-chip-card span {
  display:block;
  color:#18372b;
  font-weight:850;
  line-height:1.35;
}
.full-prompt-details {
  border:1px solid rgba(7,63,45,.14);
  border-radius:1rem;
  background:rgba(7,63,45,.045);
  overflow:hidden;
}
.full-prompt-details summary {
  cursor:pointer;
  padding:.85rem 1rem;
  color:var(--green);
  font-weight:950;
}
.full-prompt-details pre {
  margin:0;
  padding:1rem;
  max-height:16rem;
  overflow:auto;
  white-space:pre-wrap;
  background:#fffef8;
  border-top:1px solid rgba(7,63,45,.12);
  color:#17362a;
  font-size:.82rem;
  line-height:1.45;
}
@media (max-width: 700px) {
  .prompt-chip-grid { grid-template-columns:1fr; }
  .mock-preview-header > span { width:2.65rem; height:2.65rem; }
}

/* v6.3 mobile provider comparison bug fix */
.first-render-provider-panel .panel-body h2 {
  font-size: clamp(1.65rem, 8vw, 3.2rem);
  line-height: 1.08;
  margin-bottom: 1rem;
}
.provider-choice-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .85rem;
  margin: 1rem 0 1.25rem;
}
.provider-choice-card {
  display: grid;
  gap: .65rem;
  padding: 1rem;
  border: 1px solid rgba(7,63,45,.16);
  border-radius: 1.15rem;
  background: rgba(255,255,255,.78);
  box-shadow: 0 .75rem 1.8rem rgba(15, 59, 42, .08);
}
.provider-choice-card.recommended-provider {
  border-color: rgba(210,148,36,.44);
  box-shadow: 0 .75rem 2rem rgba(210,148,36,.12);
}
.provider-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .6rem;
}
.provider-card-head b {
  display: block;
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.15;
}
.provider-status-chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: .25rem .58rem;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
  background: #fff2cd;
  color: #6f4f12;
  border: 1px solid rgba(210,148,36,.28);
}
.provider-choice-card p,
.provider-choice-card small {
  margin: 0;
  line-height: 1.45;
}
.provider-choice-card p { color: var(--ink); }
.provider-choice-card small { color: var(--muted); font-weight: 700; }
@media (max-width: 900px) {
  .provider-choice-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .first-render-provider-panel .panel-body h2 {
    font-size: clamp(1.45rem, 7vw, 2.15rem);
    line-height: 1.12;
  }
  .provider-choice-grid { gap: .7rem; }
  .provider-choice-card { padding: .9rem; border-radius: 1rem; }
  .provider-card-head { align-items: center; }
}

/* v6.6 mobile checklist formatting fix */
.public-setup-checklist {
  margin-top: 1.2rem;
}
.public-setup-checklist h3 {
  margin: 0 0 .85rem;
  color: var(--green);
}
.setup-check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.setup-check-card {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: .75rem;
  padding: .9rem;
  border-radius: 1rem;
  border: 1px solid rgba(7, 63, 45, .14);
  background: #fffef8;
  box-shadow: 0 12px 26px rgba(16, 57, 42, .06);
}
.setup-check-card b {
  display: grid;
  place-items: center;
  width: 2.05rem;
  height: 2.05rem;
  border-radius: 999px;
  background: var(--gold);
  color: #241604;
  font-weight: 950;
  line-height: 1;
  flex: none;
}
.setup-check-card em {
  display: block;
  margin: .05rem 0 .32rem;
  color: var(--green);
  font-style: normal;
  font-weight: 950;
  line-height: 1.2;
}
.setup-check-card small {
  display: block;
  color: var(--muted);
  line-height: 1.4;
  font-weight: 650;
}
.setup-check-card code {
  white-space: normal;
  overflow-wrap: anywhere;
}
@media (max-width: 760px) {
  .setup-check-grid { grid-template-columns: 1fr; }
  .setup-check-card { padding: .85rem; border-radius: .95rem; }
}

/* v6.8 backend host choice guide */
.backend-host-guide-panel {
  background: linear-gradient(180deg, #fffef8, #eef7ec);
}
.backend-host-guide-panel .panel-body h2 {
  font-size: clamp(1.45rem, 5.5vw, 2.35rem);
  line-height: 1.12;
  margin-bottom: .85rem;
}
.recommended-host-card {
  display: grid;
  gap: .7rem;
  margin: 1rem 0 1.1rem;
  padding: 1rem;
  border-radius: 1.15rem;
  border: 1px solid rgba(210,148,36,.35);
  background: linear-gradient(180deg, #fff9e4, #fffef8);
  box-shadow: 0 16px 34px rgba(210,148,36,.10);
}
.recommended-host-card h3 {
  margin: 0;
  color: var(--green);
  font-size: 1.18rem;
}
.recommended-host-card p { margin: 0; }
.recommended-host-card ul {
  margin: .15rem 0 0;
  padding-left: 1.15rem;
}
.recommended-host-card li { margin: .25rem 0; }
.recommended-chip {
  justify-self: start;
  background: #073f2d;
  color: #fffef8;
  border-color: rgba(7,63,45,.25);
}
.backend-host-choice-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
  margin: 1rem 0;
}
.backend-host-choice-card {
  display: grid;
  gap: .55rem;
  padding: 1rem;
  border-radius: 1.1rem;
  border: 1px solid rgba(7,63,45,.14);
  background: rgba(255,255,255,.82);
  box-shadow: 0 12px 28px rgba(16,57,42,.06);
}
.backend-host-choice-card.preferred {
  border-color: rgba(7,63,45,.24);
  background: linear-gradient(180deg, #ffffff, #f4fbf1);
}
.backend-host-choice-card.later-option {
  opacity: .94;
}
.host-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .7rem;
}
.host-card-head b {
  color: var(--ink);
  line-height: 1.15;
}
.host-card-head span {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: .24rem .55rem;
  font-size: .7rem;
  font-weight: 950;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: #0a4934;
  background: #e9f4e3;
  border: 1px solid rgba(7,63,45,.12);
}
.backend-host-choice-card p,
.backend-host-choice-card small {
  margin: 0;
  line-height: 1.45;
}
.backend-host-choice-card small {
  color: var(--muted);
  font-weight: 700;
}
.next-setup-step-card {
  display: grid;
  gap: .45rem;
  margin-top: 1rem;
  padding: 1rem;
  border-radius: 1.15rem;
  background: #073f2d;
  color: #fffef8;
  box-shadow: 0 16px 34px rgba(7,63,45,.16);
}
.next-setup-step-card b {
  display: block;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.next-setup-step-card p {
  margin: 0;
  color: rgba(255,255,255,.88);
}
.next-setup-step-card code {
  color: #fff4b8;
}
@media (max-width: 760px) {
  .backend-host-choice-grid { grid-template-columns: 1fr; gap: .75rem; }
  .recommended-host-card, .backend-host-choice-card, .next-setup-step-card { border-radius: 1rem; padding: .9rem; }
  .host-card-head { align-items: center; }
}
@media (max-width: 460px) {
  .host-card-head { display: grid; gap: .45rem; }
  .host-card-head span { justify-self: start; }
}


/* v7.0 recommended first-render setup package */
.recommended-setup-package-panel {
  background: linear-gradient(180deg, #fffef8, #eef7ec);
}
.recommended-setup-package-panel .panel-body h2 {
  font-size: clamp(1.45rem, 5.2vw, 2.25rem);
  line-height: 1.12;
  margin-bottom: .8rem;
}
.setup-package-hero,
.later-work-note {
  display: grid;
  gap: .6rem;
  margin: 1rem 0;
  padding: 1rem;
  border-radius: 1.15rem;
  border: 1px solid rgba(210,148,36,.35);
  background: linear-gradient(180deg, #fff9e4, #fffef8);
  box-shadow: 0 16px 34px rgba(210,148,36,.10);
}
.setup-package-hero h3,
.later-work-note b {
  margin: 0;
  color: var(--green);
}
.setup-package-hero p,
.later-work-note p {
  margin: 0;
  color: var(--muted);
}
.setup-package-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
  margin: 1rem 0;
}
.setup-package-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .8rem;
  align-items: start;
  padding: 1rem;
  border-radius: 1.1rem;
  border: 1px solid rgba(7,63,45,.14);
  background: rgba(255,255,255,.86);
  box-shadow: 0 12px 28px rgba(16,57,42,.06);
}
.setup-package-card > b {
  display: grid;
  place-items: center;
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 999px;
  background: var(--gold);
  color: #241604;
  font-weight: 950;
  line-height: 1;
}
.setup-package-card strong {
  display: block;
  color: var(--green);
  font-size: 1.02rem;
  line-height: 1.2;
  margin: 0 0 .35rem;
}
.setup-package-card span {
  display: block;
  color: var(--muted);
  line-height: 1.42;
  font-weight: 650;
}
.setup-package-card code {
  white-space: normal;
  overflow-wrap: anywhere;
}
@media (max-width: 760px) {
  .setup-package-grid { grid-template-columns: 1fr; gap: .75rem; }
  .setup-package-hero, .setup-package-card, .later-work-note { border-radius: 1rem; padding: .9rem; }
}


/* v7.1 plain-English real render readiness guide */
.real-render-ready-panel {
  background: linear-gradient(180deg, #fffef8, #eef7ec);
}
.real-render-ready-panel .panel-body h2 {
  font-size: clamp(1.45rem, 5vw, 2.2rem);
  line-height: 1.12;
  margin-bottom: .75rem;
}
.ready-path-strip {
  display: grid;
  gap: .75rem;
  margin: 1rem 0;
}
.ready-path-strip article {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-areas: "num title" "num note";
  gap: .25rem .75rem;
  align-items: start;
  padding: .95rem;
  border-radius: 1.1rem;
  border: 1px solid rgba(7,63,45,.14);
  background: rgba(255,255,255,.9);
  box-shadow: 0 12px 26px rgba(16,57,42,.06);
}
.ready-path-strip article > b {
  grid-area: num;
  display: grid;
  place-items: center;
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 999px;
  background: var(--gold);
  color: #241604;
  font-weight: 950;
  line-height: 1;
}
.ready-path-strip article span {
  grid-area: title;
  color: var(--green);
  font-weight: 950;
  line-height: 1.2;
}
.ready-path-strip article small {
  grid-area: note;
  color: var(--muted);
  line-height: 1.42;
  font-weight: 650;
}
.money-safety-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
  margin: 1rem 0;
}
.cost-card,
.do-not-card {
  padding: 1rem;
  border-radius: 1.15rem;
  border: 1px solid rgba(7,63,45,.14);
  background: rgba(255,255,255,.9);
  box-shadow: 0 12px 28px rgba(16,57,42,.06);
}
.cost-card h3 {
  margin: 0 0 .55rem;
  color: var(--green);
}
.cost-card ul {
  margin: 0;
  padding-left: 1.15rem;
}
.cost-card li { margin: .35rem 0; }
.warning-card { border-color: rgba(210,148,36,.35); background: linear-gradient(180deg, #fff8e2, #fffef8); }
.free-card { border-color: rgba(7,63,45,.18); background: linear-gradient(180deg, #f2fbf0, #fffef8); }
.do-not-card {
  display: grid;
  gap: .45rem;
  border-color: rgba(180,55,45,.28);
  background: linear-gradient(180deg, #fff2ed, #fffef8);
}
.do-not-card b {
  color: #7a221b;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.do-not-card p { margin: 0; color: var(--muted); }
.do-not-card code { white-space: normal; overflow-wrap: anywhere; }
@media (max-width: 760px) {
  .money-safety-grid { grid-template-columns: 1fr; gap: .75rem; }
  .ready-path-strip article, .cost-card, .do-not-card { border-radius: 1rem; padding: .9rem; }
}

/* v7.2 real-render guide polish */
.real-render-jump-card,
.real-render-summary-card,
.ready-status-card,
.simple-render-summary {
  display: grid;
  gap: .65rem;
  margin: 1rem 0;
  padding: 1rem;
  border-radius: 1.15rem;
  border: 1px solid rgba(210,148,36,.35);
  background: linear-gradient(180deg, #fff9e4, #fffef8);
  box-shadow: 0 16px 34px rgba(210,148,36,.10);
}
.real-render-jump-card {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: .85rem;
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.28);
}
.real-render-jump-card b,
.real-render-jump-card span {
  display: block;
  color: #fff;
}
.real-render-jump-card span { color: rgba(255,255,255,.82); font-weight: 650; }
.button-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border-radius: 999px;
  padding: .8rem 1rem;
  font-weight: 950;
  background: #fff4b8;
  color: #073f2d;
  border: 1px solid rgba(255,255,255,.4);
  box-shadow: 0 10px 22px rgba(0,0,0,.12);
}
.ai-setup-summary-panel { background: linear-gradient(180deg, #fffef8, #eef7ec); }
.real-render-summary-card h2,
.ready-status-card h3,
.simple-render-summary b { margin: 0; color: var(--green); }
.real-render-summary-card p { margin: 0; color: var(--muted); }
.setup-summary-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}
.setup-summary-chips span {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  padding: .45rem .7rem;
  border-radius: 999px;
  background: rgba(7,63,45,.08);
  border: 1px solid rgba(7,63,45,.15);
  color: var(--green);
  font-weight: 850;
  font-size: .92rem;
}
.simple-render-summary ul {
  margin: 0;
  padding-left: 1.2rem;
  color: var(--muted);
  font-weight: 700;
}
.simple-render-summary li { margin: .35rem 0; }
.compact-ready-path article small { font-size: .92rem; }
@media (max-width: 760px) {
  .real-render-jump-card { grid-template-columns: 1fr; }
  .button-link { width: 100%; }
  .real-render-summary-card,
  .ready-status-card,
  .simple-render-summary { border-radius: 1rem; padding: .9rem; }
}


/* v7.3 backend connection checklist */
.backend-connection-checklist-panel { scroll-margin-top: 120px; }
.connection-flow-grid,
.before-connecting-grid {
  display: grid;
  gap: 14px;
  margin: 18px 0;
}
.connection-flow-grid article,
.before-connecting-grid article {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px 14px;
  align-items: start;
  padding: 16px;
  border: 1px solid rgba(5, 79, 51, 0.16);
  border-radius: 22px;
  background: rgba(255,255,255,0.86);
  box-shadow: 0 10px 24px rgba(4, 52, 33, 0.06);
}
.connection-flow-grid article > b {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: #d29725;
  color: #09251a;
  font-weight: 900;
}
.connection-flow-grid article > span {
  font-weight: 900;
  color: #10251b;
  line-height: 1.25;
}
.connection-flow-grid article > small {
  grid-column: 2;
  color: #50645b;
  font-size: 0.95rem;
  line-height: 1.5;
}
.before-connecting-card,
.backend-connection-note {
  margin-top: 20px;
  padding: 18px;
  border-radius: 24px;
  background: #f8fbf6;
  border: 1px solid rgba(5,79,51,0.14);
}
.before-connecting-grid article {
  grid-template-columns: 1fr;
}
.before-connecting-grid article > b {
  color: #073f2b;
  font-weight: 900;
}
.before-connecting-grid article > span {
  color: #52645d;
}
.backend-connection-note {
  background: #fff6dc;
  border-color: rgba(210,151,37,0.42);
}
@media (min-width: 760px) {
  .connection-flow-grid,
  .before-connecting-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* v7.6 backend checklist polish */
.setup-status-line {
  padding: 12px 14px;
  border-radius: 16px;
  background: #fff6dc;
  border: 1px solid rgba(210,151,37,0.38);
  color: #314239;
  font-weight: 750;
}
.ready-real-render-card {
  margin-top: 20px;
  padding: 18px;
  border-radius: 24px;
  background: #eef7f1;
  border: 1px solid rgba(5,79,51,0.18);
}
.ready-real-render-card h3 { margin-top: 0; }
.ready-real-render-card ul { margin-bottom: 0; }


/* v7.9 tester/result board polish */
.result-cue-row {
  display:flex; flex-wrap:wrap; gap:.45rem; margin:.75rem 0 .35rem;
}
.result-cue-row span, .recommendation-proof span, .selected-future-note {
  display:inline-flex; align-items:center; border-radius:999px; padding:.34rem .58rem;
  background:rgba(11,92,64,.08); color:#0b5c40; font-weight:900; font-size:.76rem;
  border:1px solid rgba(11,92,64,.12);
}
.result-summary-copy p { max-width: 58ch; }
.today-readable .mini-label {
  display:block; text-transform:uppercase; letter-spacing:.08em; font-size:.68rem; font-weight:900; color:#6a7d71; margin-bottom:.25rem;
}
.today-readable p { margin:.45rem 0 0; color:#445c50; line-height:1.48; }
.recommendation-proof {
  display:flex; flex-wrap:wrap; gap:.4rem; margin:.65rem 0 .7rem;
}
.recommendation-action {
  background:linear-gradient(135deg, rgba(245,215,110,.28), rgba(255,255,255,.72));
  border:1px solid rgba(207,151,44,.22); border-radius:1rem; padding:.75rem;
}
.next-step-focus {
  border-left:5px solid #cf972c; background:#fffaf0; border-radius:1rem; padding:.82rem .85rem;
}
.next-step-focus span {
  display:block; text-transform:uppercase; letter-spacing:.08em; font-size:.68rem; font-weight:900; color:#8d631d; margin-bottom:.2rem;
}
.next-step-focus b { display:block; color:#073f2d; font-size:1.05rem; margin-bottom:.25rem; }
.next-step-focus p { margin:.25rem 0 .35rem; }
.next-step-focus small { color:#5c6b63; font-weight:750; }
.selected-future-note { margin-left:.38rem; background:#fff4c4; color:#704b08; border-color:rgba(207,151,44,.3); }
.public-share-card .share-ready-body b { color:#073f2d; font-size:1.05rem; }
.public-share-card .share-ready-body p { max-width: 52ch; }
.dashboard-recommendation-card { scroll-margin-top:84px; }
@media (max-width: 760px) {
  .result-cue-row { display:grid; grid-template-columns:1fr; }
  .result-cue-row span { justify-content:center; }
  .recommendation-proof { display:grid; grid-template-columns:1fr; }
  .recommendation-proof span { justify-content:center; }
  .today-readable p, .result-summary-copy p { font-size:.98rem; }
  .selected-future-note { display:block; margin:.25rem 0 0; width:max-content; }
}


/* v8.0 futures-card polish: cleaner concept/status labels and recommended path */
.futures-card .tab-help {
  max-width: 58ch;
  color: #4b6155;
  line-height: 1.5;
}
.dashboard-future-card {
  overflow: hidden;
}
.future-card-status-row {
  position: relative;
  z-index: 12;
  display: flex;
  flex-wrap: wrap;
  gap: .42rem;
  align-items: center;
  justify-content: space-between;
  padding: .72rem .78rem .55rem;
  background: linear-gradient(180deg, #fffdf7, rgba(255,253,247,.92));
  border-bottom: 1px solid rgba(9, 70, 49, .10);
}
.concept-status-pill,
.future-ribbon.future-ribbon-inline {
  position: static !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  border-radius: 999px;
  padding: .36rem .58rem;
  line-height: 1;
  font-size: .68rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  box-shadow: none;
}
.concept-status-pill {
  color: #0b5c40;
  background: #edf6ea;
  border: 1px solid rgba(11,92,64,.15);
}
.future-ribbon.future-ribbon-inline {
  color: #1f2815;
  background: linear-gradient(135deg, #f7dd88, #cf972c);
  border: 1px solid rgba(143, 97, 20, .18);
}
.dashboard-future-visual .concept-preview-note {
  display: inline-flex !important;
  top: auto !important;
  left: .72rem !important;
  bottom: .72rem !important;
  max-width: calc(100% - 1.44rem);
  white-space: normal;
  background: rgba(7, 47, 33, .82);
  color: #fffdf5;
  border-color: rgba(255,255,255,.18);
  backdrop-filter: blur(8px);
}
.dashboard-future-card.active .future-card-status-row {
  background: linear-gradient(180deg, #fff8dc, #fffdf7);
}
.future-title-row {
  align-items: center;
}
.future-title-row h3 {
  line-height: 1.08;
}
.dashboard-future-copy > p {
  font-size: .92rem;
  line-height: 1.42;
}
.future-card-meta {
  border-top: 1px solid rgba(9,70,49,.08);
  padding-top: .55rem;
  margin-top: .15rem;
}
@media (max-width: 540px) {
  .future-card-status-row {
    padding: .68rem .7rem .52rem;
    align-items: flex-start;
  }
  .concept-status-pill,
  .future-ribbon.future-ribbon-inline {
    font-size: .62rem;
    padding: .34rem .48rem;
  }
  .dashboard-future-card.active .future-card-status-row {
    gap: .36rem;
  }
  .dashboard-future-copy > p {
    font-size: .9rem;
  }
}


/* v8.1 mobile result-board hierarchy: answer first, shorter cards, clearer selection */
.future-card-status-group {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .38rem;
}
.selected-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: .36rem .58rem;
  line-height: 1;
  font-size: .68rem;
  font-weight: 950;
  letter-spacing: .055em;
  text-transform: uppercase;
  color: #fffdf5;
  background: #0b5c40;
  border: 1px solid rgba(7,47,33,.22);
}
.dashboard-future-card.active {
  border-color: rgba(207,151,44,.72);
  box-shadow: 0 0 0 3px rgba(245,215,110,.28), 0 28px 66px rgba(9,48,34,.18);
}
.dashboard-future-card.active .future-title-row h3 { color: #073f2d; }
.dashboard-future-card:focus-visible {
  outline: 4px solid rgba(207,151,44,.42);
  outline-offset: 3px;
}
.result-first-move {
  margin-top: .7rem;
  padding: .72rem .76rem;
  border-radius: 1rem;
  background: linear-gradient(135deg, rgba(245,215,110,.34), rgba(255,255,255,.82));
  border: 1px solid rgba(207,151,44,.24);
}
.result-first-move span {
  color: #805916;
  margin-bottom: .2rem;
}
.result-first-move p {
  margin: 0;
  color: #233c31;
  font-weight: 820;
}
.future-card-meta { justify-content: flex-start; }
.future-card-meta span { font-weight: 850; }
body.board-ready .dashboard-hero-card {
  box-shadow: 0 14px 34px rgba(7,42,29,.10);
}
@media (max-width: 760px) {
  body.board-ready .dashboard-hero-body > div:first-child { display: none; }
  body.board-ready .dashboard-hero-card .panel-title {
    padding-bottom: .5rem;
    font-size: .72rem;
  }
  body.board-ready .dashboard-actions { grid-template-columns: 1fr 1fr; }
  body.board-ready .dashboard-actions .primary-upload,
  body.board-ready .dashboard-actions button {
    min-height: 44px;
    padding: .66rem .7rem;
    font-size: .84rem;
  }
  body.board-ready .public-share-card { display: none; }
  .result-ready-body { gap: .62rem; }
  .result-summary-copy { order: 1; }
  .result-summary-answer { order: 2; }
  .result-summary-confidence {
    order: 3;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .18rem .7rem;
    align-items: center;
    padding: .72rem .8rem;
  }
  .result-summary-confidence b {
    grid-row: 1 / span 2;
    font-size: 1.85rem;
  }
  .result-summary-confidence span,
  .result-summary-confidence small {
    margin: 0;
    text-align: left;
  }
  .result-cue-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .32rem;
  }
  .result-cue-row span {
    justify-content: center;
    min-width: 0;
    padding: .32rem .35rem;
    font-size: .65rem;
    line-height: 1.15;
    text-align: center;
  }
  .result-top-actions { grid-template-columns: 1fr 1fr; gap: .42rem; }
  .result-top-actions button { min-width: 0; padding: .7rem .62rem; font-size: .84rem; }
  .dashboard-future-visual.concept-scene { min-height: 318px; }
  .mood-board-v38 { padding: .64rem; gap: .48rem; }
  .mood-board-v38 .mood-photo { min-height: 188px; }
  .mood-board-v38 .mood-plan { min-height: 94px; }
  .mood-board-v38 .mood-materials { display: none; }
  .dashboard-future-copy { padding: .82rem; }
  .dashboard-future-copy > p { margin: .36rem 0 .52rem; }
  .future-intent-line { margin: .48rem 0 .22rem; padding: .55rem .6rem; }
  .adaptive-tag-row { margin: .42rem 0; }
  .future-card-status-row { padding: .58rem .64rem .48rem; }
  .concept-status-pill,
  .future-ribbon.future-ribbon-inline,
  .selected-status-pill { font-size: .6rem; padding: .32rem .44rem; }
  .dashboard-future-visual .concept-preview-note {
    left: .58rem !important;
    bottom: .58rem !important;
    max-width: calc(100% - 1.16rem);
    font-size: .62rem;
  }
}
@media (max-width: 430px) {
  body.board-ready .dashboard-actions { grid-template-columns: 1fr 1fr; }
  body.board-ready .dashboard-actions #dashboardCopyBtn { display: inline-flex; }
  .result-ready-body h2 { font-size: 1.55rem; }
  .result-summary-copy > p { font-size: .92rem; }
  .result-top-actions { grid-template-columns: 1fr; }
  .dashboard-future-visual.concept-scene { min-height: 302px; }
  .mood-board-v38 .mood-photo { min-height: 174px; }
  .mood-board-v38 .mood-plan { min-height: 88px; }
  .future-card-status-row { align-items: center; }
  .future-card-status-group { gap: .3rem; }
}

/* v8.1 final mobile concept-board declutter */
.mood-board-v38 .mood-board-label { display: none; }
@media (max-width: 760px) {
  .mood-board-v38 .mood-palette { display: none; }
}


/* v8.2 real-phone result pass: remove setup repetition, reveal the answer, fix sticky scroll */
.result-ready-card { scroll-margin-top: 112px; }
.result-ready-card .panel-title { letter-spacing: .105em; }
.result-summary-copy .eyebrow { margin-bottom: .45rem; }
.result-summary-copy h2 { margin-bottom: .45rem; }
.result-fit-reason { max-width: 58ch; }
.result-summary-answer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: linear-gradient(135deg, rgba(245,215,110,.34), rgba(255,255,255,.94));
  border-color: rgba(207,151,44,.30);
}
.result-summary-answer > span {
  color: #805916;
  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.result-summary-answer > p {
  margin: .42rem 0 0;
  color: #173b2d;
  font-size: 1.02rem;
  font-weight: 860;
  line-height: 1.42;
}
.result-summary-answer > small {
  margin-top: .55rem;
  color: #627168;
  font-weight: 760;
  line-height: 1.35;
}
.result-top-actions button { min-height: 46px; }
body.board-ready .quick-start-card {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .75rem;
  padding: .78rem .9rem;
}
body.board-ready .quick-start-card .eyebrow,
body.board-ready .quick-start-steps,
body.board-ready .self-test-card { display: none; }
body.board-ready .quick-start-card h2 {
  font-family: inherit;
  font-size: 1rem;
  letter-spacing: 0;
}
body.board-ready .quick-start-card p {
  margin-top: .16rem;
  font-size: .86rem;
  line-height: 1.35;
}
body.board-ready .smart-next-card {
  grid-column: auto;
  min-width: 210px;
  padding: .58rem;
  box-shadow: none;
}
body.board-ready .smart-next-card > div { display: none; }
body.board-ready .smart-next-card button { width: 100%; min-height: 42px; }

@media (max-width: 760px) {
  .result-ready-card { scroll-margin-top: 96px; }
  .result-ready-card .panel-title {
    padding: .68rem .86rem;
    font-size: .72rem;
  }
  .result-ready-body { padding: .82rem; gap: .68rem; }
  .result-summary-copy .eyebrow { margin-bottom: .32rem; }
  .result-ready-body h2 {
    margin: 0;
    font-size: clamp(1.72rem, 8vw, 2.15rem) !important;
    line-height: 1.04;
  }
  .result-fit-reason {
    margin: .5rem 0 0;
    font-size: .94rem !important;
    line-height: 1.42 !important;
  }
  .result-summary-answer {
    order: 2;
    padding: .82rem;
    border-radius: 1rem;
  }
  .result-summary-answer > p { font-size: .97rem; }
  .result-summary-answer > small { font-size: .77rem; }
  .result-summary-confidence { display: none; }
  .result-top-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .42rem;
    margin-top: .68rem;
  }
  .result-top-actions button {
    min-width: 0;
    padding: .7rem .55rem;
    font-size: .84rem;
  }
  body.board-ready .quick-start-card {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    margin-bottom: .65rem;
  }
  body.board-ready .smart-next-card { min-width: 112px; }
}

@media (max-width: 430px) {
  body.board-ready .quick-start-card { grid-template-columns: 1fr auto; }
  body.board-ready .quick-start-card p { max-width: 25ch; }
  body.board-ready .smart-next-card { min-width: 104px; }
  body.board-ready .smart-next-card button { padding-inline: .62rem; font-size: .82rem; }
}


/* v8.3 overlay + futures audit: clearer photo anchor, distinct concepts, shorter mobile cards */
/* v8.8 multi-scenario credibility, stable recommendation/selection, and tester handoff */
.build-pill { display: inline-flex; align-items: center; gap: .48rem; }
.build-pill small { padding-left: .48rem; border-left: 1px solid rgba(255,255,255,.28); font-size: .68rem; font-weight: 850; opacity: .82; letter-spacing: .03em; }
.site-footer { display: flex; flex-wrap: wrap; justify-content: center; gap: .55rem 1rem; margin: .85rem auto 1.25rem; padding: .8rem 1rem; max-width: 1500px; color: #5d7066; font-size: .76rem; font-weight: 780; text-align: center; }
.site-footer span + span::before { content: "·"; margin-right: 1rem; color: #a1afa7; }
.futures-section-intro { display: flex; align-items: flex-start; justify-content: space-between; gap: .8rem; margin-bottom: .85rem; }
.futures-section-intro .tab-help { margin: 0; }
.concept-trust-label { flex: 0 0 auto; display: inline-flex; align-items: center; border-radius: 999px; padding: .42rem .62rem; background: #eef5ea; border: 1px solid rgba(11,92,64,.14); color: #0b5c40; font-size: .66rem; font-weight: 950; letter-spacing: .055em; text-transform: uppercase; white-space: nowrap; }

/* Premium abstract planting masses replace emoji stickers. */
.plant-sprite { width: 6rem; height: 3.2rem; border: 0; border-radius: 52% 48% 44% 56% / 66% 58% 42% 34%; background: radial-gradient(circle at 22% 68%, rgba(32,82,48,.94) 0 20%, transparent 21%), radial-gradient(circle at 48% 38%, rgba(56,111,66,.94) 0 24%, transparent 25%), radial-gradient(circle at 74% 62%, rgba(74,124,70,.92) 0 22%, transparent 23%), linear-gradient(180deg, rgba(78,132,78,.76), rgba(21,75,42,.82)); box-shadow: 0 18px 30px rgba(5,37,27,.22); opacity: .92; filter: saturate(.92); }
.plant-sprite::after { content: ""; position: absolute; left: 11%; right: 11%; bottom: -8%; height: 28%; border-radius: 50%; background: rgba(8,48,31,.28); filter: blur(5px); }
.plant-sprite.fern { transform: rotate(-4deg) scale(1.05); background: radial-gradient(ellipse at 20% 60%, rgba(43,109,67,.96) 0 17%, transparent 18%), radial-gradient(ellipse at 47% 40%, rgba(70,139,84,.96) 0 23%, transparent 24%), radial-gradient(ellipse at 76% 62%, rgba(34,96,60,.94) 0 19%, transparent 20%), linear-gradient(180deg, rgba(86,150,94,.72), rgba(17,70,43,.84)); }
.plant-sprite.grass { height: 3.7rem; border-radius: 44% 56% 34% 66%; background: repeating-linear-gradient(76deg, transparent 0 9%, rgba(166,176,91,.92) 10% 12%, transparent 13% 20%), linear-gradient(180deg, rgba(181,188,111,.52), rgba(72,103,53,.76)); }
.plant-sprite.pot { width: 4.7rem; height: 4.2rem; border-radius: 48% 52% 42% 44%; background: radial-gradient(circle at 30% 28%, rgba(63,123,70,.96) 0 22%, transparent 23%), radial-gradient(circle at 68% 35%, rgba(78,139,76,.94) 0 25%, transparent 26%), linear-gradient(180deg, transparent 0 48%, rgba(145,102,65,.94) 49% 100%); }
.plant-sprite.flower { background: radial-gradient(circle at 18% 52%, rgba(235,203,92,.95) 0 11%, transparent 12%), radial-gradient(circle at 46% 34%, rgba(246,226,142,.98) 0 12%, transparent 13%), radial-gradient(circle at 74% 58%, rgba(217,173,64,.92) 0 10%, transparent 11%), linear-gradient(180deg, rgba(77,137,79,.72), rgba(26,84,48,.88)); }
.plant-sprite.veg, .plant-sprite.herb { border-radius: 42% 58% 48% 52%; background: radial-gradient(circle at 20% 60%, rgba(56,135,64,.96) 0 19%, transparent 20%), radial-gradient(circle at 48% 35%, rgba(90,159,79,.98) 0 25%, transparent 26%), radial-gradient(circle at 76% 58%, rgba(43,116,59,.94) 0 21%, transparent 22%), linear-gradient(180deg, rgba(91,160,82,.72), rgba(24,88,48,.86)); }
.plant-sprite.herb { transform: scale(.82); }
.overlay-badge { background: rgba(247,250,244,.92); color: #0b5c40; border: 1px solid rgba(11,92,64,.18); }
.overlay-legend span[data-index], .dashboard-overlay-key span[data-index] { position: relative; padding-left: 2.15rem; }
.overlay-legend span[data-index]::before, .dashboard-overlay-key span[data-index]::before { content: attr(data-index); position: absolute; left: .52rem; top: 50%; transform: translateY(-50%); width: 1.15rem; height: 1.15rem; display: grid; place-items: center; border-radius: 50%; background: #0b5c40; color: white; font-size: .66rem; font-weight: 950; }
.dashboard-overlay-key { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .42rem; margin-top: .58rem; }
.dashboard-overlay-key span { display: flex; align-items: center; min-height: 2.15rem; border-radius: .8rem; padding: .45rem .55rem .45rem 2.15rem; background: #f8fbf5; border: 1px solid rgba(11,92,64,.12); color: #395347; font-size: .72rem; font-weight: 820; line-height: 1.25; }

/* Each future keeps the same property photo but receives a visibly different concept treatment. */
.photo-concept-layer { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.photo-mass, .photo-route-line, .photo-focus-dot { position: absolute; display: block; }
.photo-mass { border: 1px solid rgba(255,255,255,.28); box-shadow: inset 0 0 0 1px rgba(7,47,33,.10), 0 14px 30px rgba(7,42,29,.14); backdrop-filter: blur(1px); }
.photo-route-line { height: 7px; border-radius: 999px; background: rgba(245,233,191,.72); box-shadow: 0 2px 8px rgba(0,0,0,.22); }
.photo-focus-dot { width: 2.6rem; height: 2.6rem; border-radius: 50%; border: 2px solid rgba(255,255,255,.66); box-shadow: 0 12px 26px rgba(0,0,0,.18); }
.mood-belonging .mass-one { width: 44%; height: 24%; left: 8%; bottom: 12%; border-radius: 48% 52% 38% 62%; background: rgba(45,104,60,.55); }
.mood-belonging .mass-two { width: 31%; height: 30%; right: 9%; bottom: 20%; border-radius: 50%; background: rgba(79,128,70,.50); }
.mood-belonging .photo-route-line { width: 62%; left: 18%; bottom: 23%; transform: rotate(-9deg); }
.mood-belonging .photo-focus-dot { right: 13%; top: 23%; background: rgba(222,172,72,.38); }
.mood-minimal .mass-one { width: 72%; height: 20%; left: 9%; bottom: 13%; border-radius: 999px; background: rgba(46,96,58,.48); }
.mood-minimal .mass-two { width: 24%; height: 42%; right: 8%; bottom: 18%; border-radius: 42% 58% 48% 52%; background: rgba(69,111,73,.48); }
.mood-minimal .photo-route-line { width: 56%; left: 14%; bottom: 31%; transform: rotate(2deg); background: rgba(221,224,201,.68); }
.mood-minimal .photo-focus-dot { left: 14%; top: 20%; background: rgba(96,138,105,.34); }
.mood-gathering .mass-one { width: 56%; height: 34%; left: 22%; bottom: 14%; border-radius: 50%; background: rgba(131,83,45,.42); }
.mood-gathering .mass-two { width: 25%; height: 24%; right: 7%; top: 22%; border-radius: 50%; background: rgba(223,157,69,.35); }
.mood-gathering .photo-route-line { width: 46%; left: 10%; bottom: 26%; transform: rotate(-4deg); background: rgba(238,202,131,.76); }
.mood-gathering .photo-focus-dot { left: 43%; top: 38%; background: rgba(202,101,35,.42); }
.mood-productive .mass-one { width: 47%; height: 28%; left: 9%; bottom: 16%; border-radius: 28% 44% 30% 48%; background: rgba(86,129,48,.50); }
.mood-productive .mass-two { width: 30%; height: 25%; right: 10%; bottom: 18%; border-radius: 28% 46% 32% 42%; background: rgba(111,151,58,.48); }
.mood-productive .photo-route-line { width: 58%; left: 20%; bottom: 37%; transform: rotate(-3deg); background: rgba(224,211,157,.72); }
.mood-productive .photo-focus-dot { right: 19%; top: 18%; background: rgba(100,151,69,.36); }
.mood-maker .mass-one { width: 48%; height: 27%; left: 7%; bottom: 12%; border-radius: 16px; background: rgba(60,85,88,.42); }
.mood-maker .mass-two { width: 29%; height: 34%; right: 8%; bottom: 16%; border-radius: 14px; background: rgba(77,96,92,.40); }
.mood-maker .photo-route-line { width: 72%; left: 14%; bottom: 26%; transform: rotate(0deg); background: rgba(223,216,190,.78); }
.mood-maker .photo-focus-dot { right: 10%; top: 18%; border-radius: 12px; background: rgba(108,122,119,.40); }
.mood-wildlife .mass-one { width: 35%; height: 58%; left: 5%; bottom: 8%; border-radius: 44% 56% 38% 62%; background: rgba(47,103,61,.52); }
.mood-wildlife .mass-two { width: 38%; height: 42%; right: 6%; bottom: 10%; border-radius: 54% 46% 60% 40%; background: rgba(75,124,72,.48); }
.mood-wildlife .photo-route-line { width: 52%; left: 24%; bottom: 23%; transform: rotate(-12deg); background: rgba(229,219,172,.68); }
.mood-wildlife .photo-focus-dot { right: 18%; top: 20%; background: rgba(77,137,152,.38); }
.mood-belonging .mood-photo::after { background: linear-gradient(135deg, rgba(63,101,47,.04), rgba(218,165,65,.13)), linear-gradient(180deg, transparent 58%, rgba(8,42,29,.23)); }
.mood-minimal .mood-photo::after { background: linear-gradient(135deg, rgba(55,92,67,.08), rgba(208,226,208,.12)), linear-gradient(180deg, transparent 58%, rgba(8,42,29,.22)); }
.mood-gathering .mood-photo::after { background: linear-gradient(135deg, rgba(154,78,17,.06), rgba(238,176,82,.14)), linear-gradient(180deg, transparent 58%, rgba(70,35,14,.20)); }
.mood-productive .mood-photo::after { background: linear-gradient(135deg, rgba(83,126,44,.06), rgba(177,202,83,.12)), linear-gradient(180deg, transparent 58%, rgba(24,69,35,.21)); }
.mood-maker .mood-photo::after { background: linear-gradient(135deg, rgba(70,86,88,.09), rgba(203,194,164,.08)), linear-gradient(180deg, transparent 58%, rgba(27,42,42,.24)); }
.mood-wildlife .mood-photo::after { background: linear-gradient(135deg, rgba(43,98,70,.08), rgba(79,150,160,.10)), linear-gradient(180deg, transparent 58%, rgba(10,55,38,.22)); }
.future-quick-tags { display: flex; flex-wrap: wrap; gap: .38rem; margin-top: .5rem; }
.future-quick-tags span { border-radius: 999px; padding: .32rem .55rem; background: #eef5ea; border: 1px solid rgba(11,92,64,.12); color: #244838; font-size: .72rem; font-weight: 850; }
.combined-status-pill { white-space: nowrap; }

@media (max-width: 760px) {
  .build-pill { gap: .35rem; }
  .build-pill small { font-size: .61rem; padding-left: .35rem; }
  .site-footer { display: grid; gap: .25rem; margin-bottom: 5.2rem; }
  .site-footer span + span::before { content: none; }
  .futures-section-intro { display: grid; gap: .55rem; margin-bottom: .65rem; }
  .concept-trust-label { justify-self: start; font-size: .61rem; padding: .36rem .5rem; }
  .dashboard-overlay-key { grid-template-columns: 1fr; }
  .overlay-legend { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; }
  .overlay-legend span { width: auto !important; justify-content: flex-start !important; text-align: left; }
  .tester-visual-stage-inner .overlay-label,
  .dashboard-photo-frame .overlay-label,
  .compare-image .overlay-label {
    width: 1.85rem; height: 1.85rem; max-width: none; display: grid; place-items: center; padding: 0; border-radius: 50%; font-size: 0; background: rgba(7,63,45,.92); border: 2px solid rgba(255,255,255,.88); color: white; box-shadow: 0 8px 20px rgba(0,0,0,.24);
  }
  .tester-visual-stage-inner .overlay-label::before,
  .dashboard-photo-frame .overlay-label::before,
  .compare-image .overlay-label::before { content: attr(data-index); font-size: .74rem; font-weight: 950; }
  .tester-visual-stage-inner .overlay-label.label-a,
  .dashboard-photo-frame .overlay-label.label-a,
  .compare-image .overlay-label.label-a { left: 8%; bottom: 15%; }
  .tester-visual-stage-inner .overlay-label.label-b,
  .dashboard-photo-frame .overlay-label.label-b,
  .compare-image .overlay-label.label-b { right: 8%; top: 29%; }
  .tester-visual-stage-inner .overlay-label.label-c,
  .dashboard-photo-frame .overlay-label.label-c,
  .compare-image .overlay-label.label-c { left: 32%; top: 13%; }
  .tester-visual-stage-inner .overlay-label.label-d,
  .dashboard-photo-frame .overlay-label.label-d,
  .compare-image .overlay-label.label-d { right: 12%; bottom: 10%; background: rgba(197,138,42,.94); color: #1f1607; }
  .plant-sprite { width: 4.8rem; height: 2.7rem; }
  .plant-sprite.pot { width: 3.8rem; height: 3.5rem; }
  .dashboard-future-visual.concept-scene { min-height: 244px !important; }
  .mood-board-v38 { display: block; padding: .58rem; }
  .mood-board-v38 .mood-photo { display: block; width: 100%; min-height: 228px !important; border-radius: 20px; }
  .mood-board-v38 .mood-plan { position: absolute; z-index: 7; right: .78rem; bottom: .78rem; width: 41%; min-height: 82px !important; height: 82px; border-radius: 15px; background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(239,240,224,.76)); box-shadow: 0 12px 28px rgba(7,42,29,.20); }
  .mood-board-v38 .mood-plan .mood-pin { font-size: .47rem; padding: .18rem .3rem; max-width: 68%; }
  .dashboard-future-visual .concept-preview-note { top: .85rem !important; left: .85rem !important; bottom: auto !important; max-width: max-content; background: rgba(7,47,33,.76); font-size: .58rem; }
  .future-card-status-row { min-height: 2.45rem; }
  .dashboard-future-copy { padding: .74rem .78rem .78rem; }
  .future-title-row h3 { font-size: 1.03rem; }
  .future-card-summary { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin: .32rem 0 .42rem !important; font-size: .84rem !important; line-height: 1.32 !important; }
  .future-intent-line { margin: .38rem 0 0; padding: .5rem .55rem; }
  .future-intent-line b { display: inline; margin-right: .28rem; }
  .future-intent-line span { font-size: .76rem; }
  .future-quick-tags { margin-top: .4rem; gap: .3rem; }
  .future-quick-tags span { font-size: .64rem; padding: .28rem .44rem; }
  .future-feature-list { display: none; }
  .adaptive-tag-row, .future-card-meta { display: none !important; }
}

@media (max-width: 430px) {
  .overlay-legend { grid-template-columns: 1fr; }
  .mood-board-v38 .mood-photo { min-height: 215px !important; }
  .dashboard-future-visual.concept-scene { min-height: 231px !important; }
  .mood-board-v38 .mood-plan { width: 43%; height: 76px; min-height: 76px !important; }
  .future-title-row > strong { font-size: .76rem; }
}


/* v8.8 multi-scenario credibility + tester handoff */
.quick-feedback {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .55rem;
  margin: .7rem 0 .45rem;
}
.quick-feedback button { min-height: 44px; padding: .65rem .5rem; font-size: .92rem; }
.feedback-helper { margin: 0; color: var(--muted); font-size: .94rem; }
.feedback-saved-status { min-height: 1.35em; margin: .25rem 0 .45rem; color: var(--green); font-weight: 800; }
.selection-note {
  display: grid;
  gap: .2rem;
  margin: .75rem 0;
  padding: .7rem .8rem;
  border: 1px solid rgba(11,92,64,.2);
  border-radius: 14px;
  background: rgba(245,250,245,.88);
}
.selection-note b { color: var(--green); font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; }
.selection-note span { color: var(--ink); }
.dashboard-future-card[aria-pressed="true"] { box-shadow: 0 0 0 3px rgba(11,92,64,.18), var(--shadow); }

@media (max-width: 720px) {
  body.board-ready .session-recovery-card,
  body.board-ready .beta-test-card { display: none; }
  .quick-feedback { grid-template-columns: 1fr; }
  .quick-feedback button { width: 100%; }
  .future-feature-list { margin-top: .45rem; }
  .future-feature-list li:nth-child(n+3) { display: none; }
  .dashboard-future-copy { gap: .42rem; }
  .public-share-card .share-ready-body { gap: .65rem; }
}

@media (max-width: 720px) {
  body.board-ready .today-card { order: 1; }
  body.board-ready .futures-card { order: 2; }
  body.board-ready .dashboard-recommendation-card { order: 3; }
}

.dashboard-feedback-card { border: 1px solid rgba(11,92,64,.16); background: linear-gradient(135deg, #fffdf6, #eef7ee); }
.dashboard-feedback-body { display: grid; grid-template-columns: minmax(0,1fr) minmax(300px,.8fr); gap: .8rem 1.2rem; align-items: center; }
.dashboard-feedback-body p { margin: .25rem 0 0; color: var(--muted); }
.dashboard-feedback-body .quick-feedback { margin: 0; }
.dashboard-feedback-status { grid-column: 1 / -1; margin: 0; }
@media (max-width: 720px) {
  .dashboard-feedback-body { grid-template-columns: 1fr; }
  .dashboard-feedback-card .quick-feedback { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .dashboard-feedback-card .quick-feedback button { min-height: 48px; padding: .55rem .35rem; font-size: .78rem; }
}


/* v8.8 public tester feedback, privacy, and accessibility */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.privacy-note{margin:.72rem 0 1rem;padding:.72rem .8rem;border-left:4px solid var(--green-700);border-radius:0 12px 12px 0;background:rgba(234,245,235,.76);color:#34483d;font-size:.87rem;line-height:1.45}.privacy-note.compact{margin:.65rem 0;font-size:.8rem}
.privacy-callout{margin:1rem 0;padding:.9rem 1rem;border:1px solid rgba(11,92,64,.2);border-radius:16px;background:linear-gradient(135deg,#f4faf4,#fffdf5)}.privacy-callout b{color:var(--green-900)}.privacy-callout p{margin:.35rem 0 0;color:var(--muted);line-height:1.5}.privacy-callout.compact{margin:.5rem 0 1rem;padding:.75rem .85rem}
.feedback-review-heading{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}.feedback-review-heading h2{margin:0;color:var(--green-900);font-family:var(--serif)}.feedback-review-heading .button-row{flex:0 0 auto}
.feedback-review-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem;margin:1rem 0}.feedback-review-summary article{min-height:96px;display:grid;place-content:center;text-align:center;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,#fff,#f4f8f2)}.feedback-review-summary b{color:var(--green-900);font-size:1.75rem;line-height:1}.feedback-review-summary span{margin-top:.35rem;color:var(--muted);font-size:.8rem;font-weight:800}
.feedback-review-list{display:grid;gap:.75rem}.feedback-review-item{position:relative;padding:1rem;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:var(--shadow-soft)}.feedback-review-top{display:flex;justify-content:space-between;gap:.75rem;align-items:center}.feedback-review-top time{color:var(--muted);font-size:.78rem}.feedback-review-item h3{margin:.65rem 0 .35rem;color:var(--green-900)}.feedback-review-meta{display:flex;flex-wrap:wrap;gap:.35rem}.feedback-review-meta span{padding:.28rem .48rem;border-radius:999px;background:var(--green-050);color:#405248;font-size:.72rem;font-weight:750}.feedback-review-item p{margin:.7rem 0 0;line-height:1.45}.feedback-review-item .muted-note{color:var(--muted);font-style:italic}
.reaction-badge{display:inline-flex;align-items:center;min-height:30px;padding:.3rem .58rem;border-radius:999px;font-size:.75rem;font-weight:900}.reaction-useful{background:#e5f5e8;color:#0a593c}.reaction-confusing{background:#fff1cf;color:#704900}.reaction-not-believable{background:#ffe8e1;color:#7c2f21}.reaction-detailed{background:#eef2f5;color:#40515a}.feedback-delete{margin-top:.75rem;padding:.5rem .72rem;font-size:.76rem}
.feedback-empty{padding:1.2rem;border:1px dashed var(--line);border-radius:18px;text-align:center;background:var(--green-050)}.feedback-empty p{margin:.4rem auto 0;max-width:52ch;color:var(--muted)}.quick-feedback button[aria-pressed="true"]{background:var(--gold);color:#211706;border-color:#a66f16;box-shadow:0 0 0 3px rgba(197,138,42,.2)}.screen:focus{outline:none}.tab:focus-visible,.advanced-tabs summary:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
@media(max-width:720px){.feedback-review-heading{display:grid}.feedback-review-heading .button-row{width:100%}.feedback-review-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.feedback-review-summary article{min-height:82px}.feedback-review-top{align-items:flex-start}.feedback-review-meta{display:grid}.feedback-review-meta span{border-radius:10px}}
@media(prefers-contrast:more){:root{--muted:#314138;--line:#7b8c82}button.secondary,.panel,.feedback-review-item,.privacy-callout{border-width:2px}.reaction-badge{outline:1px solid currentColor}}
@media(forced-colors:active){button,.tab,.reaction-badge,.feedback-review-item,.privacy-callout{forced-color-adjust:auto;border:1px solid ButtonText}}


/* v8.8 evidence-led feedback review, filtering, and persistence */
.feedback-review-actions{align-items:center}.file-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.68rem .9rem;border:1px solid var(--line);border-radius:12px;font-weight:850;cursor:pointer;background:#fff;color:var(--green-900)}.file-button:hover{border-color:var(--green);background:var(--green-050)}
.feedback-filter-bar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:.7rem;align-items:end;margin:1rem 0 .35rem;padding:.85rem;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,#f8fbf7,#eef5ed)}.feedback-filter-bar label{display:grid;gap:.32rem;color:var(--green-900);font-size:.76rem;font-weight:900}.feedback-filter-bar select{width:100%;min-height:44px}.feedback-filter-bar button{min-height:44px}
.feedback-review-count{margin:.4rem 0 .8rem;color:var(--muted);font-size:.84rem;font-weight:750}.feedback-review-summary{grid-template-columns:repeat(5,minmax(0,1fr))}.feedback-review-summary article:last-child{background:linear-gradient(180deg,#fff8e5,#f6ecd0)}
.feedback-disagreement-summary{display:flex;gap:.8rem;align-items:center;margin:.2rem 0 .8rem;padding:.85rem 1rem;border:1px solid rgba(166,111,22,.28);border-radius:16px;background:#fff9e9}.feedback-disagreement-summary b{color:#704900;white-space:nowrap}.feedback-disagreement-summary span{color:#5f5543;font-size:.86rem;line-height:1.4}
.feedback-evidence-insight{margin:.8rem 0;padding:1rem;border:1px solid var(--line);border-radius:18px;background:#f5f8f4}.feedback-evidence-insight b{display:block;color:var(--green-900)}.feedback-evidence-insight p{margin:.35rem 0 0;color:var(--muted);line-height:1.45}.feedback-evidence-insight.warning{border-color:#d7a73e;background:#fff6dc}.feedback-evidence-insight.warning b{color:#704900}.feedback-evidence-insight.positive{border-color:#7ab291;background:#eaf6ee}
.feedback-group-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem;margin:1rem 0}.feedback-group-summary article{padding:.85rem;border:1px solid var(--line);border-radius:16px;background:#fff}.feedback-group-summary h3{margin:0 0 .55rem;color:var(--green-900);font-size:.86rem}.feedback-group-summary ul{display:grid;gap:.35rem;margin:0;padding:0;list-style:none}.feedback-group-summary li{display:flex;justify-content:space-between;gap:.5rem;color:var(--muted);font-size:.76rem}.feedback-group-summary li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.feedback-group-summary li b{color:var(--green-900)}.feedback-group-summary li.empty{display:block;font-style:italic}
.feedback-review-meta .choice-different{background:#fff1cf;color:#704900}.feedback-review-meta .choice-same{background:#e5f5e8;color:#0a593c}
@media(max-width:900px){.feedback-filter-bar{grid-template-columns:repeat(2,minmax(0,1fr))}.feedback-group-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.feedback-review-summary{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.feedback-review-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.feedback-review-actions>*{width:100%;margin:0}.feedback-review-actions #clearFeedbackBtn{grid-column:1/-1}.feedback-filter-bar{grid-template-columns:1fr}.feedback-filter-bar button{width:100%}.feedback-review-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.feedback-review-summary article:first-child{grid-column:1/-1}.feedback-disagreement-summary{display:grid;gap:.25rem}.feedback-group-summary{grid-template-columns:1fr}.feedback-group-summary article{padding:.75rem}.feedback-review-meta span{white-space:normal;overflow-wrap:anywhere}}


/* v8.8 genuine tester evidence boundary and issue tagging */
.feedback-evidence-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;margin:.75rem 0}.feedback-evidence-controls .field{margin:0}.feedback-evidence-details{margin:.75rem 0 0;padding:.65rem .75rem;border:1px solid var(--line);border-radius:14px;background:#f8fbf7}.feedback-evidence-details summary{cursor:pointer;color:var(--green-900);font-size:.82rem;font-weight:900}.feedback-evidence-details[open] summary{margin-bottom:.4rem}
.feedback-filter-bar{grid-template-columns:repeat(4,minmax(0,1fr)) auto}.feedback-review-summary{grid-template-columns:repeat(6,minmax(0,1fr))}.feedback-review-summary article:nth-child(2){background:linear-gradient(180deg,#effaf2,#e5f5e8)}.feedback-review-summary article:nth-child(3){background:linear-gradient(180deg,#f3f5f7,#e9eef1)}
.feedback-evidence-boundary{display:flex;gap:.8rem;align-items:center;margin:.2rem 0 .8rem;padding:.85rem 1rem;border:1px solid rgba(11,92,64,.22);border-radius:16px;background:#eef8f0}.feedback-evidence-boundary b{color:var(--green-900);white-space:nowrap}.feedback-evidence-boundary span{color:var(--muted);font-size:.86rem;line-height:1.4}
.feedback-group-summary{grid-template-columns:repeat(5,minmax(0,1fr))}.feedback-note-themes{margin:1rem 0;padding:1rem;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,#fff,#f7faf6)}.feedback-note-themes>b{display:block;color:var(--green-900)}.feedback-note-themes p{margin:.35rem 0 .7rem;color:var(--muted);font-size:.86rem}.feedback-note-themes>div{display:flex;flex-wrap:wrap;gap:.45rem}.feedback-note-themes span{padding:.35rem .55rem;border-radius:999px;background:var(--green-050);color:#405248;font-size:.76rem;font-weight:750}.feedback-note-themes strong{color:var(--green-900)}
.feedback-review-item.evidence-tester{border-left:5px solid #1b7c52}.feedback-review-item.evidence-internal{border-left:5px solid #71808a}.feedback-review-item.evidence-unclassified{border-left:5px solid #b27a25}.feedback-review-meta .evidence-kind-badge{font-weight:900}.evidence-tester .evidence-kind-badge{background:#e5f5e8;color:#0a593c}.evidence-internal .evidence-kind-badge{background:#edf1f3;color:#40515a}.evidence-unclassified .evidence-kind-badge{background:#fff1cf;color:#704900}
@media(max-width:1000px){.feedback-filter-bar{grid-template-columns:repeat(2,minmax(0,1fr))}.feedback-review-summary{grid-template-columns:repeat(3,minmax(0,1fr))}.feedback-group-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.feedback-evidence-controls{grid-template-columns:1fr}.feedback-evidence-boundary{display:grid;gap:.25rem}.feedback-review-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.feedback-review-summary article:first-child{grid-column:auto}.feedback-group-summary{grid-template-columns:1fr}}


/* v8.9 calibrated photo-first concept overlays ------------------------------------------------ */
.photo-first-card{border-color:rgba(11,92,64,.24);background:linear-gradient(180deg,#fffdf8,#f3f8f1);overflow:visible}
.photo-first-card .panel-title{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(90deg,#073f2d,#0d7250)}
.photo-first-body{padding:.78rem}
.dashboard-today-visual{min-height:0;background:transparent;overflow:visible;box-shadow:none;border-radius:0}
.photo-first-visual-shell{display:grid;gap:.66rem;min-width:0}
.visual-mode-switch{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.38rem;padding:.35rem;border:1px solid rgba(11,92,64,.17);border-radius:1rem;background:#edf4ec}
.visual-mode-switch button{min-width:0;min-height:44px;padding:.62rem .45rem;border:1px solid transparent;border-radius:.75rem;background:transparent;color:#385247;font-size:.78rem;font-weight:900;line-height:1.15;box-shadow:none}
.visual-mode-switch button:hover{background:rgba(255,255,255,.75)}
.visual-mode-switch button.active,.visual-mode-switch button[aria-pressed="true"]{background:#fff;color:#073f2d;border-color:rgba(11,92,64,.2);box-shadow:0 5px 16px rgba(7,63,45,.12)}
.photo-concept-stage{position:relative;isolation:isolate;overflow:hidden;min-height:clamp(340px,56vw,690px);border-radius:1.35rem;background-size:cover;background-position:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.26),0 22px 55px rgba(7,42,29,.17)}
.photo-concept-stage::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(4,20,14,.04),rgba(4,20,14,.08) 55%,rgba(4,20,14,.30));pointer-events:none}
.photo-concept-stage.mode-original::before{background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.12))}
.photo-concept-stage.no-photo{display:grid;place-items:center;background-image:linear-gradient(135deg,#315f49,#9ebc91)!important}
.visual-mode-chip{position:absolute;z-index:8;left:.75rem;bottom:.75rem;display:inline-flex;max-width:calc(100% - 1.5rem);padding:.48rem .7rem;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:rgba(4,33,23,.82);color:#fff;font-size:.72rem;font-weight:950;letter-spacing:.015em;box-shadow:0 8px 24px rgba(0,0,0,.22);backdrop-filter:blur(8px)}
.concept-overlay-trust{position:absolute;z-index:8;right:.72rem;top:.72rem;display:inline-flex;max-width:58%;padding:.42rem .58rem;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(5,37,27,.72);color:#f6fff5;font-size:.62rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase;line-height:1.2;text-align:center;backdrop-filter:blur(8px)}
.concept-overlay-svg{position:absolute;inset:0;z-index:3;width:100%;height:100%;overflow:visible;pointer-events:none;filter:drop-shadow(0 7px 12px rgba(3,31,21,.16))}
.concept-depth-wash{position:absolute;inset:0;z-index:2;background:linear-gradient(135deg,rgba(45,103,72,.04),rgba(10,55,38,.12));mix-blend-mode:multiply;pointer-events:none}
.concept-overlay-svg .surface-zone{fill:rgba(158,132,84,.30);stroke:rgba(255,244,207,.58);stroke-width:5}
.concept-overlay-svg .surface-mulch{fill:rgba(117,91,53,.42)}
.concept-overlay-svg .surface-lawn{fill:rgba(86,131,75,.20)}
.concept-overlay-svg .surface-recovery{fill:rgba(95,89,60,.24)}
.concept-overlay-svg .surface-hard{fill:rgba(103,114,112,.35)}
.concept-overlay-svg .plant-mass{fill:rgba(27,111,65,.48);stroke:rgba(221,250,220,.48);stroke-width:4}
.concept-overlay-svg .mass-right{fill:rgba(50,125,73,.44)}
.concept-overlay-svg .access-route,.concept-overlay-svg .maker-route{fill:none;stroke:rgba(215,194,145,.58);stroke-width:68;stroke-linecap:round;stroke-linejoin:round}
.concept-overlay-svg .access-route-highlight,.concept-overlay-svg .arrival-path-highlight{fill:none;stroke:rgba(255,244,212,.88);stroke-width:8;stroke-linecap:round;stroke-dasharray:26 18}
.concept-overlay-svg .access-wide{stroke-width:92}
.concept-overlay-svg .arrival-path{fill:rgba(206,184,137,.55);stroke:rgba(255,246,220,.52);stroke-width:5}
.concept-overlay-svg .feature-tree rect{fill:rgba(82,57,35,.82)}
.concept-overlay-svg .feature-tree circle{fill:rgba(34,114,63,.58);stroke:rgba(222,246,217,.45);stroke-width:4}
.concept-overlay-svg .edge-line,.concept-overlay-svg .soft-edge-line,.concept-overlay-svg .clean-edge{fill:none;stroke:rgba(239,226,177,.92);stroke-width:10;stroke-linecap:round}
.concept-overlay-svg .focal-zone,.concept-overlay-svg .arrival-glow{fill:rgba(225,176,69,.36);stroke:rgba(255,239,182,.88);stroke-width:6}
.concept-overlay-svg .constraint-zone{fill:rgba(18,27,23,.24);stroke:rgba(245,230,181,.35);stroke-width:4;stroke-dasharray:20 15}
.concept-overlay-svg .retained-structure circle{fill:rgba(24,80,45,.46);stroke:rgba(207,236,203,.44);stroke-width:5}
.concept-overlay-svg .removal-zone,.concept-overlay-svg .storage-zone,.concept-overlay-svg .maker-storage{fill:rgba(156,86,45,.20);stroke:rgba(255,208,154,.80);stroke-width:6;stroke-dasharray:24 16}
.concept-overlay-svg .work-pad,.concept-overlay-svg .maker-pad{fill:rgba(84,102,108,.50);stroke:rgba(230,243,243,.70);stroke-width:6}
.concept-overlay-svg .screen-mass,.concept-overlay-svg .maker-screen{fill:rgba(27,104,64,.56);stroke:rgba(221,250,220,.45);stroke-width:4}
.concept-overlay-svg .arrival-glow{fill:rgba(238,184,61,.28)}
.concept-overlay-svg .path-lights circle,.concept-overlay-svg .light-dots circle{fill:#ffe7a0;stroke:rgba(255,255,255,.95);stroke-width:4}
.concept-overlay-svg .welcome-seat{fill:rgba(127,76,42,.55);stroke:rgba(255,232,196,.75);stroke-width:5}
.concept-overlay-svg .mulch-blanket{fill:rgba(111,89,54,.40);stroke:rgba(228,210,165,.52);stroke-width:5}
.concept-overlay-svg .low-foliage ellipse{fill:rgba(58,116,61,.55);stroke:rgba(219,241,205,.42);stroke-width:4}
.concept-overlay-svg .habitat-clusters ellipse{fill:rgba(35,118,65,.50);stroke:rgba(205,240,202,.45);stroke-width:4}
.concept-overlay-svg .wildflower-dots circle{fill:rgba(237,190,78,.88);stroke:rgba(255,245,213,.92);stroke-width:3}
.concept-overlay-svg .water-point{fill:rgba(73,144,152,.50);stroke:rgba(215,250,252,.75);stroke-width:5}
.concept-overlay-svg .gathering-floor{fill:rgba(174,125,74,.42);stroke:rgba(255,229,188,.74);stroke-width:6}
.concept-overlay-svg .table{fill:rgba(90,55,34,.68);stroke:rgba(255,231,196,.72);stroke-width:5}
.concept-overlay-svg .chairs rect{fill:rgba(124,76,42,.64);stroke:rgba(255,231,196,.70);stroke-width:4}
.concept-overlay-svg .string-light{fill:none;stroke:rgba(255,232,155,.90);stroke-width:5}
.concept-overlay-svg .food-beds path{fill:rgba(96,119,55,.50);stroke:rgba(229,242,183,.70);stroke-width:6}
.concept-overlay-svg .crop-rows path{fill:none;stroke:rgba(236,225,160,.88);stroke-width:6;stroke-linecap:round}
.concept-overlay-svg .water-route{fill:none;stroke:rgba(90,175,190,.78);stroke-width:12;stroke-dasharray:18 14;stroke-linecap:round}
.concept-overlay-svg .route-arrow{fill:rgba(255,225,144,.90)}
.concept-map-marker circle{fill:#fff;stroke:#0b5c40;stroke-width:7;filter:drop-shadow(0 5px 8px rgba(0,0,0,.28))}
.concept-map-marker text{fill:#073f2d;font-family:system-ui,sans-serif;font-size:25px;font-weight:950}
.concept-map-marker.marker-first circle{fill:#f2c85f;stroke:#5b3c08;}
.concept-map-marker.marker-first text{fill:#2c1c03}
@keyframes firstMovePulse{0%,100%{transform:scale(1);transform-origin:center}50%{transform:scale(1.12);transform-origin:center}}
.visual-context-line{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.05rem .15rem;color:#29473a}
.visual-context-line span{font-weight:950}.visual-context-line small{color:var(--muted);font-weight:800;text-align:right}
.concept-map-legend{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.45rem}
.concept-legend-item{display:grid;grid-template-columns:1.65rem minmax(0,1fr);gap:.45rem;align-items:start;min-width:0;padding:.55rem;border:1px solid rgba(11,92,64,.14);border-radius:.9rem;background:#f8fbf5}
.concept-legend-item>span{display:grid;place-items:center;width:1.55rem;height:1.55rem;border-radius:50%;background:#0b5c40;color:#fff;font-size:.72rem;font-weight:950}
.concept-legend-item b{display:block;color:#173b2d;font-size:.7rem;line-height:1.15}.concept-legend-item small{display:block;margin-top:.18rem;color:#52685d;font-size:.66rem;line-height:1.3}
.concept-legend-item.is-first-move{border-color:rgba(166,111,22,.35);background:#fff8e5}.concept-legend-item.is-first-move>span{background:#c58a2a;color:#201603}
.visual-first-move{display:grid;grid-template-columns:2.35rem minmax(0,1fr);gap:.72rem;align-items:center;padding:.72rem .82rem;border:1px solid rgba(166,111,22,.32);border-radius:1rem;background:linear-gradient(135deg,#fff9e8,#f5eed7)}
.visual-first-move>span{display:grid;place-items:center;width:2.15rem;height:2.15rem;border-radius:50%;background:#c58a2a;color:#201603;font-weight:950}.visual-first-move b{color:#5e410d;font-size:.78rem;text-transform:uppercase;letter-spacing:.045em}.visual-first-move p{margin:.16rem 0 0;color:#4d473b;font-size:.86rem;line-height:1.4}
.today-summary{margin-top:.15rem}.today-readable{padding:.72rem .78rem;border:1px solid rgba(11,92,64,.13);border-radius:1rem;background:#fff}.today-readable p{margin:.35rem 0 0;line-height:1.5}.visual-detail-disclosure{padding:.62rem .72rem;border:1px solid rgba(11,92,64,.12);border-radius:.85rem;background:#f7faf5}.visual-detail-disclosure summary{cursor:pointer;color:#0b5c40;font-weight:900}.visual-detail-disclosure p{margin:.5rem 0 0;color:var(--muted);font-size:.86rem;line-height:1.45}
.result-ready-card{margin-top:.72rem}.result-ready-body{grid-template-columns:minmax(0,1.45fr) minmax(260px,.85fr)!important}.result-summary-confidence{display:none!important}.result-top-actions{grid-template-columns:repeat(3,minmax(0,1fr))}
.return-to-visual{display:flex;margin:.85rem auto 0;min-height:44px}.view-future-photo{width:100%;min-height:42px;margin-top:.3rem;font-size:.78rem}
.dashboard-future-copy{gap:.42rem}.future-feature-list{display:none!important}.future-intent-line{min-height:auto}
.compare-concept-host{min-height:0!important;background:none!important;overflow:visible!important}.compare-concept-host .photo-concept-stage{min-height:360px}.compare-concept-host .concept-map-legend,.compare-concept-host .visual-first-move{display:none}
.tester-visual-stage-inner{min-height:0;background:none!important}.tester-visual-stage .photo-concept-stage{min-height:min(66vh,560px)}
.tester-visual-stage .visual-context-line,.tester-visual-stage .visual-first-move{padding-left:.75rem;padding-right:.75rem}.tester-visual-stage .concept-map-legend{padding:0 .75rem .75rem}
.overlay-legend span b{color:#173b2d}.overlay-legend span{line-height:1.35}
@media(max-width:980px){.concept-map-legend{grid-template-columns:repeat(2,minmax(0,1fr))}.concept-legend-item:last-child{grid-column:1/-1}.result-ready-body{grid-template-columns:1fr!important}}
@media(max-width:720px){
  body.board-ready .photo-first-card{margin-top:.25rem}
  .photo-first-body{padding:.58rem}
  .photo-concept-stage{min-height:clamp(310px,92vw,520px);border-radius:1.05rem}
  .visual-mode-switch{gap:.25rem;padding:.28rem;border-radius:.8rem}
  .visual-mode-switch button{min-height:46px;padding:.55rem .25rem;font-size:.7rem}
  .concept-overlay-trust{top:.55rem;right:.55rem;max-width:55%;font-size:.54rem;padding:.35rem .45rem}
  .visual-mode-chip{left:.55rem;bottom:.55rem;max-width:calc(100% - 1.1rem);font-size:.65rem;padding:.4rem .55rem}
  .concept-map-legend{grid-template-columns:1fr 1fr;gap:.36rem}
  .concept-legend-item{grid-template-columns:1.45rem minmax(0,1fr);gap:.38rem;padding:.48rem}
  .concept-legend-item>span{width:1.35rem;height:1.35rem;font-size:.64rem}.concept-legend-item b{font-size:.66rem}.concept-legend-item small{font-size:.62rem}
  .concept-legend-item:last-child{grid-column:1/-1}
  .visual-context-line{align-items:flex-start}.visual-context-line span{font-size:.82rem}.visual-context-line small{font-size:.68rem}
  .visual-first-move{padding:.62rem .68rem;grid-template-columns:2rem minmax(0,1fr);gap:.55rem}.visual-first-move>span{width:1.85rem;height:1.85rem}.visual-first-move b{font-size:.68rem}.visual-first-move p{font-size:.78rem}
  .today-readable p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:.84rem}
  .result-top-actions{grid-template-columns:1fr 1fr}.result-top-actions #resultCopyTopBtn{grid-column:1/-1}
  .dashboard-futures-grid{grid-template-columns:1fr}
  .dashboard-future-visual{min-height:142px}
  .future-intent-line span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .return-to-visual{width:100%}
  .compare-concept-host .photo-concept-stage{min-height:310px}
}
@media(max-width:430px){
  .photo-concept-stage{min-height:330px}
  .concept-legend-item small{font-size:.65rem}
  .visual-mode-switch button{font-size:.66rem}
}
@media(prefers-reduced-motion:reduce){.concept-map-marker.marker-first circle{animation:none}}

.photo-first-card,#dashboardTodayVisual{scroll-margin-top:96px}


/* v8.9 user-guided calibration ---------------------------------------------------- */
.calibration-closed{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.72rem .78rem;border:1px solid rgba(11,92,64,.18);border-radius:1rem;background:#fff}
.calibration-closed>div{display:grid;gap:.18rem;min-width:0}.calibration-closed b{color:#073f2d}.calibration-closed span{color:#5c6b64;font-size:.86rem;line-height:1.35}.calibration-closed button{flex:0 0 auto}
.calibration-panel{display:grid;gap:.62rem;padding:.75rem;border:2px solid rgba(11,92,64,.32);border-radius:1rem;background:#fbfff9;box-shadow:0 9px 24px rgba(7,63,45,.08)}
.calibration-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:.65rem}.calibration-heading>div{display:grid;gap:.18rem}.calibration-heading b{font-size:1rem;color:#073f2d}.calibration-heading span,.calibration-instruction{font-size:.84rem;line-height:1.4;color:#52655b;margin:0}
.calibration-tools{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.35rem}.calibration-tools button{min-width:0;min-height:44px;padding:.5rem .35rem;border:1px solid rgba(11,92,64,.2);border-radius:.72rem;background:#edf4ec;color:#244c3d;font-size:.72rem;font-weight:900;box-shadow:none}.calibration-tools button.active{background:#075239;color:#fff;border-color:#075239}
.calibration-actions{display:flex;gap:.4rem;flex-wrap:wrap}.calibration-actions button{min-height:42px;padding:.5rem .7rem;font-size:.78rem}.calibration-actions button:disabled{opacity:.45;cursor:not-allowed}
.photo-concept-stage.is-calibrating{outline:3px solid #f2c85f;outline-offset:3px;touch-action:none;user-select:none}
.calibration-editor-svg{position:absolute;inset:0;z-index:8;width:100%;height:100%;overflow:visible;pointer-events:auto}
.calibration-editor-svg .calibration-usable-outline,.calibration-editor-svg .calibration-protected-route,.calibration-editor-svg .calibration-keep-clear>rect,.calibration-editor-svg .calibration-keep-clear>text{pointer-events:none}
.calibration-editor-svg .calibration-usable-outline{fill:rgba(42,143,82,.13);stroke:#d7f6c4;stroke-width:8;stroke-dasharray:22 14;filter:drop-shadow(0 3px 6px rgba(0,0,0,.35))}
.calibration-editor-svg .calibration-protected-route{fill:none;stroke:rgba(255,220,125,.38);stroke-width:84;stroke-linecap:round}.calibration-editor-svg .calibration-protected-route+*{}
.calibration-editor-svg .calibration-keep-clear rect{fill:rgba(105,37,37,.38);stroke:#ffd3c6;stroke-width:7;stroke-dasharray:18 12}.calibration-editor-svg .calibration-keep-clear text{fill:#fff;font:900 22px system-ui,sans-serif;paint-order:stroke;stroke:#5d2222;stroke-width:6px}
.calibration-handle{pointer-events:auto;cursor:grab;outline:none}.calibration-handle:active{cursor:grabbing}.calibration-handle circle{fill:#fff;stroke:#075239;stroke-width:8;filter:drop-shadow(0 4px 7px rgba(0,0,0,.35))}.calibration-handle text{fill:#073f2d;font:950 22px system-ui,sans-serif}.calibration-handle:focus-visible circle{stroke:#f3c85c;stroke-width:13}.keep-handle circle{fill:#ffd3c6;stroke:#772f2f}.access-handle circle{fill:#fff1b8;stroke:#735414}.opportunity-handle circle{fill:#d8f6d3;stroke:#17633d}.first-handle circle{fill:#f2c85f;stroke:#5b3c08}.first-handle text{fill:#2c1c03}
.concept-overlay-svg .calibration-mask-route{fill:none;stroke:black;stroke-width:82;stroke-linecap:round}.concept-overlay-svg .calibration-protected-route{fill:none;stroke:rgba(255,232,165,.68);stroke-width:72;stroke-linecap:round}.concept-overlay-svg .concept-access-protection .calibration-protected-route{stroke:rgba(255,236,183,.42)}
.concept-overlay-svg .surface-courtyard{fill:rgba(108,118,114,.20);stroke:rgba(255,255,255,.35)}.concept-overlay-svg .courtyard-edge-planter,.concept-overlay-svg .courtyard-planter-strip{fill:rgba(30,110,63,.48);stroke:rgba(221,250,220,.6);stroke-width:5}.concept-overlay-svg .courtyard-edge-planter.right,.concept-overlay-svg .courtyard-planter-strip.right{fill:rgba(51,124,73,.46)}.concept-overlay-svg .courtyard-containers ellipse{fill:rgba(40,118,67,.55);stroke:rgba(220,245,211,.58);stroke-width:5}.concept-overlay-svg .container-food-beds path{fill:rgba(96,119,55,.48);stroke:rgba(237,231,177,.72);stroke-width:6}
.calibration-summary{display:grid;gap:.15rem;padding:.62rem .72rem;border-left:4px solid #0b5c40;background:#edf5ec;border-radius:.35rem .75rem .75rem .35rem}.calibration-summary b{color:#073f2d;font-size:.86rem}.calibration-summary span{color:#56665e;font-size:.78rem;line-height:1.35}
@media(max-width:760px){.calibration-closed{align-items:stretch;flex-direction:column}.calibration-closed button{width:100%}.calibration-heading{align-items:stretch;flex-direction:column}.calibration-heading button{width:100%}.calibration-tools{grid-template-columns:repeat(2,minmax(0,1fr))}.calibration-tools button:last-child{grid-column:1/-1}.calibration-actions{display:grid;grid-template-columns:1fr 1fr}.calibration-actions button{width:100%}.photo-concept-stage.is-calibrating{min-height:clamp(340px,96vw,540px)}.calibration-editor-svg .calibration-keep-clear text{font-size:18px}}
@media(max-width:380px){.calibration-tools button{font-size:.67rem}.calibration-actions{grid-template-columns:1fr}.visual-mode-switch button{font-size:.62rem}}

/* v8.9.1 deployment hotfix: make concept calibration impossible to miss. */
.concept-adjust-hotfix{background:#fff8df!important;border:2px solid #b88716!important;color:#073f2d!important;font-weight:900!important;box-shadow:0 8px 20px rgba(84,66,13,.12)}
.concept-adjust-hotfix:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(84,66,13,.18)}
.concept-adjust-hotfix:disabled{background:#edf1eb!important;border-color:#c8d2c8!important;color:#637068!important;box-shadow:none;cursor:not-allowed}
@media(max-width:760px){.dashboard-actions .concept-adjust-hotfix,.result-top-actions .concept-adjust-hotfix{width:100%;min-height:52px}.result-top-actions .concept-adjust-hotfix{order:-1}}


/* v9.0 restored-analysis + visual-panel integrity hotfix ---------------------- */
.visual-edit-actions{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:.65rem}
.visual-edit-actions .secondary,.visual-edit-actions label{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.65rem .85rem;border-radius:.8rem;cursor:pointer;font-weight:900;text-decoration:none}
.replace-photo-external{position:static!important;inset:auto!important;transform:none!important;z-index:auto!important}
.dashboard-today-visual[data-visual-module="calibration-v9.1"]{contain:layout paint}
.dashboard-today-visual[data-visual-module="calibration-v9.1"] .photo-first-visual-shell>.intake-panel,
.dashboard-today-visual[data-visual-module="calibration-v9.1"] #uploadDrop,
.dashboard-today-visual[data-visual-module="calibration-v9.1"] #photoPrivacyNote{display:none!important}
.calibration-module-status{border-color:rgba(11,92,64,.3)!important;background:#eef8ee!important}
.calibration-module-status span{color:#075239!important;font-weight:900}
body.board-ready #dashboard .photo-first-card{order:-2}
body.board-ready #dashboard .dashboard-hero-card{order:-3}
@media(max-width:760px){
  .visual-edit-actions{display:grid;grid-template-columns:1fr 1fr}
  .visual-edit-actions .secondary,.visual-edit-actions label{width:100%;font-size:.84rem}
  .photo-first-card .panel-title{position:relative;z-index:1}
  .dashboard-today-visual[data-visual-module="calibration-v9.1"]{overflow:visible}
}
@media(max-width:380px){.visual-edit-actions{grid-template-columns:1fr}}

/* v9.0 phone-first calibration hardening --------------------------------------- */
.calibration-kicker{color:#8a6519!important;font-size:.7rem!important;font-weight:950;letter-spacing:.055em;text-transform:uppercase}
.calibration-done-primary{min-height:48px;padding:.68rem .95rem;border:0;border-radius:.82rem;background:#075239;color:#fff;font-weight:950;box-shadow:0 7px 18px rgba(7,82,57,.18)}
.calibration-done-primary:hover{background:#063f2d}
.calibration-step-status{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:.58rem;row-gap:.08rem;align-items:center;padding:.62rem .7rem;border:1px solid rgba(184,135,22,.28);border-radius:.85rem;background:#fff9e7}
.calibration-step-status>span{grid-row:1/3;align-self:stretch;display:grid;place-items:center;min-width:4.4rem;padding:.32rem .5rem;border-radius:.65rem;background:#f2c85f;color:#312106;font-size:.72rem;font-weight:950}
.calibration-step-status>b{color:#073f2d;font-size:.9rem}.calibration-step-status>small{color:#5a625c;font-size:.76rem;line-height:1.3}
.calibration-tools button{min-height:48px;line-height:1.2}
.calibration-actions button{min-height:46px}
.calibration-instruction{padding:.55rem .62rem;border-radius:.75rem;background:#edf5ec;color:#29483a!important;font-weight:800}
.calibration-editor-svg{touch-action:none;overscroll-behavior:contain}
.calibration-handle{touch-action:none;-webkit-tap-highlight-color:transparent}
.calibration-handle .calibration-hit-target{fill:rgba(0,0,0,.001)!important;stroke:none!important;filter:none!important;pointer-events:all}
.calibration-handle .calibration-handle-face{filter:drop-shadow(0 5px 8px rgba(0,0,0,.38))}
.calibration-handle.is-inactive{opacity:.38;pointer-events:none}
.calibration-handle.is-inactive .calibration-handle-face{fill:#eef2ed;stroke:#718078;stroke-width:6}
.calibration-handle.is-inactive text{fill:#526057}
.calibration-handle.is-active{opacity:1;pointer-events:auto}
.calibration-handle.is-active .calibration-handle-face{stroke-width:9}
.calibration-handle.is-active:focus-visible .calibration-handle-face{stroke:#f3c85c;stroke-width:14}
.calibration-handle.is-active .calibration-hit-target{cursor:grab}
.calibration-handle.is-active:active .calibration-hit-target{cursor:grabbing}
.calibration-finish-bar{display:grid;grid-template-columns:minmax(110px,.7fr) minmax(0,1.5fr);gap:.5rem;padding:.55rem;border:1px solid rgba(11,92,64,.2);border-radius:.9rem;background:#f7fbf5;box-shadow:0 9px 24px rgba(7,63,45,.08)}
.calibration-finish-bar button{min-height:50px;width:100%;font-weight:950}
.calibration-finish-bar button:not(.secondary){background:#075239;color:#fff}
body.calibration-dragging{overscroll-behavior:none;touch-action:none;user-select:none;-webkit-user-select:none}
body.calibration-dragging .sticky-nav,body.calibration-dragging .mobile-tab-strip{pointer-events:none}
.photo-concept-stage.is-calibrating{overscroll-behavior:contain;cursor:default}
.photo-concept-stage.is-calibrating .visual-mode-chip,.photo-concept-stage.is-calibrating .concept-overlay-trust{pointer-events:none;opacity:.78}
.dashboard-today-visual[data-visual-module="calibration-v9.1"]{contain:layout paint}
@media(max-width:760px){
  .calibration-panel{gap:.55rem;padding:.65rem}
  .calibration-heading{gap:.5rem}
  .calibration-heading .calibration-done-primary{order:-1;min-height:52px;font-size:.92rem}
  .calibration-step-status{grid-template-columns:auto minmax(0,1fr);padding:.55rem}
  .calibration-step-status>span{min-width:3.9rem}
  .calibration-tools{grid-template-columns:repeat(2,minmax(0,1fr));gap:.38rem}
  .calibration-tools button{min-height:52px;padding:.56rem .4rem;font-size:.72rem}
  .calibration-tools button:last-child{grid-column:1/-1}
  .calibration-actions{grid-template-columns:1fr 1fr;gap:.42rem}
  .calibration-actions button{min-height:50px;padding:.55rem .45rem;font-size:.75rem}
  .calibration-finish-bar{position:relative;z-index:2;background:#f7fbf5}
  .photo-concept-stage.is-calibrating{min-height:clamp(350px,96vw,545px)}
}
@media(max-width:380px){
  .calibration-step-status{grid-template-columns:1fr}.calibration-step-status>span{grid-row:auto;min-height:34px}.calibration-step-status>b,.calibration-step-status>small{grid-column:1}
  .calibration-actions{grid-template-columns:1fr}
  .calibration-finish-bar{grid-template-columns:1fr 1.45fr}
  .calibration-tools button{font-size:.69rem}
}
@media(prefers-reduced-motion:reduce){.calibration-handle .calibration-handle-face,.calibration-finish-bar{transition:none!important}}
.calibration-handle.is-inactive,.calibration-handle.is-inactive *{pointer-events:none!important}
body.calibration-active .public-tabs{display:none!important}
body.calibration-active .skip-link{display:none!important}
.calibration-handle-shape{transform-origin:0 0}
.photo-concept-stage.is-calibrating .concept-overlay-trust{display:none!important}
.calibration-editor-svg .calibration-keep-clear text{font-size:28px!important;letter-spacing:.02em}
@media(max-width:760px){.calibration-editor-svg .calibration-keep-clear text{font-size:26px!important}}


/* v9.1 clean visual presentation and active-step calibration ------------------ */
.dashboard-today-visual[data-panel-integrity="clean"]{min-width:0}
.photo-first-visual-shell[data-clean-visual-panel="v9.1"]{isolation:isolate}
.photo-concept-image{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;user-select:none}
.photo-concept-stage.is-finished{outline:0;box-shadow:0 18px 42px rgba(7,42,29,.16),inset 0 0 0 1px rgba(255,255,255,.24)}
.photo-concept-stage.is-finished .concept-map-marker:not(.marker-first){display:none!important}
.photo-concept-stage.is-finished .marker-first{opacity:.96}
.photo-concept-stage.is-calibrating .concept-marker-layer{display:none!important}
.photo-concept-stage.is-calibrating .visual-mode-chip{display:none!important}
.calibration-handle.is-inactive{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
.calibration-keep-clear.is-inactive{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
.calibration-keep-clear.is-active{opacity:1;visibility:visible}
.calibration-protected-route.is-inactive{opacity:0!important;visibility:hidden!important}
.calibration-protected-route.is-active{opacity:1;visibility:visible}
.calibration-editor-svg .calibration-usable-outline{opacity:.58;stroke-width:6}
.calibration-editor-svg.tool-usable .calibration-usable-outline{opacity:1;stroke-width:8}
.calibration-editor-svg.tool-keep .calibration-usable-outline,.calibration-editor-svg.tool-access .calibration-usable-outline,.calibration-editor-svg.tool-opportunity .calibration-usable-outline,.calibration-editor-svg.tool-firstMove .calibration-usable-outline{stroke-dasharray:14 16}
.calibration-panel{overflow:hidden}
.calibration-panel .calibration-heading>div>span:last-child{max-width:54ch}
.visual-edit-disclosure{margin-top:.65rem;border:1px solid rgba(11,92,64,.16);border-radius:.9rem;background:#f7faf5;overflow:hidden}
.visual-edit-disclosure>summary{cursor:pointer;padding:.72rem .82rem;color:#073f2d;font-weight:950;list-style-position:inside}
.visual-edit-disclosure[open]>summary{border-bottom:1px solid rgba(11,92,64,.12)}
.visual-edit-disclosure .visual-edit-actions{padding:.68rem .75rem 0}
.visual-edit-disclosure .privacy-note{margin:.55rem .75rem .75rem;padding:.6rem .7rem;font-size:.78rem}
.dashboard-today-visual[data-panel-integrity="clean"] :is(.intake-panel,.upload-drop,#photoPrivacyNote,.field-grid,.starter-coaching,.privacy-callout){display:none!important}
@media(max-width:760px){
  .photo-first-card .panel-body{padding:.62rem}
  .photo-first-visual-shell{gap:.5rem}
  .calibration-handle.is-inactive,.calibration-keep-clear.is-inactive{display:none!important}
  .concept-map-legend{grid-template-columns:1fr 1fr}
  .visual-edit-disclosure .visual-edit-actions{grid-template-columns:1fr}
}
@media(max-width:760px){
  /* v9.1: mobile tabs remain in normal flow so they cannot cover the visual card. */
  .public-tabs{position:static!important;top:auto!important;z-index:auto!important;backdrop-filter:none!important}
}