/* Marragacha product experience: V5 visual system, real account flows. */
.product-page {
  --product-night: #0b0e0d;
  --product-paper: #f1efe7;
  --product-white: #fcfbf6;
  --product-acid: #e6f05a;
  --product-orange: #ff704f;
  --product-ink: #171c19;
  --product-muted: #737b73;
  min-height: 100vh;
  background: var(--product-paper);
  color: var(--product-ink);
  font-family: "Manrope", system-ui, sans-serif;
}
.product-top {
  min-height: 68px; padding: 14px clamp(18px, 4vw, 54px); display:flex; align-items:center; justify-content:space-between; gap:18px;
  background: var(--product-night); color:var(--product-white); border-bottom:1px solid #ffffff18;
}
.product-brand { display:inline-flex; align-items:center; gap:10px; color:inherit; text-decoration:none; font:700 19px/1 "Space Grotesk",sans-serif; letter-spacing:-.07em; }
.product-brand > span:last-child { color:var(--product-acid); margin-left:-10px; }
.product-brand__mark { width:30px;height:30px;display:grid;place-items:center;border:1px solid #ffffff42;border-radius:9px;color:var(--product-acid);font-size:17px; }
.product-top__step,.product-eyebrow { color:#8c988b; font:500 9px/1.5 "DM Mono",monospace; letter-spacing:.14em; text-transform:uppercase; }
.onboard-wrap { width:min(850px,calc(100% - 36px)); margin:0 auto; padding:58px 0 28px; }
.onboard-intro { max-width:680px; margin-bottom:28px; }
.onboard-intro h1 { margin:13px 0 13px; color:var(--product-ink); font:700 clamp(43px,7vw,72px)/.92 "Space Grotesk",sans-serif; letter-spacing:-.09em; text-transform:none; }
.onboard-intro h1 em { color:#879747;font-style:normal; }
.onboard-intro p { max-width:560px; color:#737b73; font-size:13px; line-height:1.8; }
.onboard-card { background:var(--product-white); border:1px solid #171c1918; border-radius:22px; box-shadow:0 24px 70px #171c1910; overflow:hidden; }
.onboard-progress { height:4px; background:#e5e4db; }
.onboard-progress span { display:block; width:33.333%; height:100%; background:#879747; transition:width .3s ease; }
#profileForm { padding:clamp(22px,4vw,42px); }
.onboard-step { display:none; animation:productRise .28s ease both; }
.onboard-step.is-active { display:block; }
.onboard-step h2 { margin:14px 0 10px; color:var(--product-ink); font:700 clamp(28px,4.5vw,43px)/.98 "Space Grotesk",sans-serif; letter-spacing:-.075em; text-transform:none; }
.step-copy { max-width:600px; margin:0 0 26px; color:#778075; font-size:12px; line-height:1.8; }
.form-field { display:grid; gap:8px; margin:21px 0; }
.form-field > label,.form-field legend { color:#343c34; font-size:11px; font-weight:800; }
.form-field small { color:#8a9387; font-size:9px; line-height:1.6; }
.form-field select,.form-field input[type="date"] { width:100%; min-height:49px; border:1px solid #171c1926; border-radius:10px; padding:0 13px; background:#fffefa; color:var(--product-ink); font:600 12px "Manrope",sans-serif; }
.form-field select:focus,.form-field input:focus { outline:2px solid #e6f05a99; border-color:#879747; }
.form-field select:disabled { color:#596254; background:#f0f1e7; opacity:1; }
.form-field--plain { padding:0; border:0; min-width:0; }
.level-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:8px; }
.level-choice input,.days-grid input { position:absolute; opacity:0; pointer-events:none; }
.level-choice span,.days-grid span { display:grid;place-items:center;min-height:48px;border:1px solid #171c1926;border-radius:10px;background:#fffefa;color:#596254;font:700 16px "Space Grotesk",sans-serif;cursor:pointer;transition:.18s; }
.level-choice input:checked + span,.days-grid input:checked + span { background:var(--product-night);border-color:var(--product-night);color:var(--product-acid);box-shadow:0 6px 18px #0b0e0d18; }
.level-choice input:focus-visible + span,.days-grid input:focus-visible + span { outline:3px solid var(--product-orange);outline-offset:3px; }
.days-grid { display:grid;grid-template-columns:repeat(7,1fr);gap:8px; }
.days-grid span { min-height:43px;font-size:13px; }
.time-estimate { margin-top:14px;padding:13px 15px;border-radius:10px;background:#edf0df;color:#596647;font-size:10px;font-weight:700; }
.profile-summary { display:grid;grid-template-columns:1fr 1fr;gap:0 20px;margin:23px 0;border-top:1px solid #171c191a; }
.profile-summary div { padding:14px 0;border-bottom:1px solid #171c191a; }
.profile-summary dt { color:#899187;font:500 8px "DM Mono",monospace;letter-spacing:.1em;text-transform:uppercase; }
.profile-summary dd { margin:5px 0 0;color:#252d25;font-size:13px;font-weight:800; }
.honesty-note { padding:15px 16px;border-left:3px solid #879747;border-radius:0 10px 10px 0;background:#eff0e4;color:#6e776b;font-size:10px;line-height:1.8; }
.honesty-note strong { color:#3e4b33; }
.onboard-actions { display:flex;align-items:center;gap:12px;margin-top:34px;padding-top:20px;border-top:1px solid #171c1918; }
.onboard-actions__hint { flex:1;color:#8b9388;font-size:9px;line-height:1.5; }
.product-btn { display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:46px;padding:0 19px;border:1px solid var(--product-acid);border-radius:999px;background:var(--product-acid);color:var(--product-night);font:800 11px "Manrope",sans-serif;cursor:pointer;transition:transform .2s,background .2s; }
.product-btn:hover { transform:translateY(-2px);background:#f0fa78; }
.product-btn:disabled { opacity:.55;cursor:wait;transform:none; }
.product-btn span { display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#0b0e0d12;font-size:15px; }
.product-btn--quiet { border-color:#171c1926;background:transparent;color:#707a6d; }
.product-btn--quiet:hover { background:#e8e8dc; }
.onboard-foot { display:flex;justify-content:space-between;gap:15px;margin:19px 2px;color:#90998e;font:500 8px "DM Mono",monospace;letter-spacing:.1em;text-transform:uppercase; }
.onboard-foot a { color:#6d786a;text-decoration:none; }
.product-message { margin:18px 0 0;padding:12px 15px;border-radius:10px;background:#fce9e4;color:#a34838;font-size:11px; }
.product-message.ok { background:#edf0df;color:#53643d; }
@keyframes productRise { from {opacity:0;transform:translateY(8px)} to {opacity:1;transform:none} }

/* Real dashboard */
.dashboard-wrap { width:min(1180px,calc(100% - 36px)); margin:0 auto; padding:40px 0 80px; }
.dashboard-head { display:flex;justify-content:space-between;align-items:flex-end;gap:22px;margin-bottom:24px; }
.dashboard-head h1 { margin:9px 0 8px;font:700 clamp(37px,5vw,59px)/.92 "Space Grotesk",sans-serif;letter-spacing:-.09em;text-transform:none; }
.dashboard-head p { color:#747d73;font-size:12px;line-height:1.7; }
.dashboard-head__actions { display:flex;flex-wrap:wrap;gap:8px; }
.product-link { display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 14px;border:1px solid #171c1924;border-radius:999px;color:#404a3c;text-decoration:none;font-size:10px;font-weight:800; }
.product-link--dark { background:#0b0e0d;color:#f1efe7;border-color:#0b0e0d; }
.goal-panel { display:grid;grid-template-columns:1.4fr .6fr;gap:25px;align-items:center;padding:26px 28px;border-radius:19px;background:#0b0e0d;color:#f1efe7;box-shadow:0 25px 65px #0b0e0d19; }
.goal-panel__label { color:#98a494;font:500 8px "DM Mono",monospace;letter-spacing:.14em;text-transform:uppercase; }
.goal-panel h2 { margin:9px 0 8px;font:700 clamp(25px,3.5vw,39px)/.98 "Space Grotesk",sans-serif;letter-spacing:-.07em;text-transform:none; }
.goal-panel p { color:#aeb8aa;font-size:11px;line-height:1.7; }
.goal-panel__target { padding-left:22px;border-left:1px solid #ffffff24; }
.goal-panel__target strong { display:block;color:#e6f05a;font:700 38px/.95 "Space Grotesk",sans-serif;letter-spacing:-.08em; }
.goal-panel__target span { display:block;margin-top:8px;color:#929d8d;font:500 8px "DM Mono",monospace;letter-spacing:.1em;text-transform:uppercase; }
.dashboard-kpis { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:16px 0 28px; }
.dashboard-kpi { padding:17px 18px;border:1px solid #171c1917;border-radius:13px;background:#fcfbf6; }
.dashboard-kpi b { display:block;color:#3f5031;font:700 30px/1 "Space Grotesk",sans-serif;letter-spacing:-.07em; }
.dashboard-kpi span { display:block;margin-top:7px;color:#8b9388;font:500 8px "DM Mono",monospace;letter-spacing:.1em;text-transform:uppercase; }
.dashboard-columns { display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,.6fr);gap:17px;align-items:start; }
.product-panel { border:1px solid #171c1917;border-radius:17px;background:#fcfbf6;overflow:hidden; }
.product-panel__head { display:flex;justify-content:space-between;align-items:flex-end;gap:15px;padding:20px 22px;border-bottom:1px solid #171c1917; }
.product-panel__head h2 { margin:0;font:700 24px/.98 "Space Grotesk",sans-serif;letter-spacing:-.06em;text-transform:none; }
.product-panel__head p { margin-top:6px;color:#879084;font-size:9px;line-height:1.6; }
.week-progress { min-width:90px;text-align:right;color:#75804b;font:500 9px "DM Mono",monospace; }
.week-progress__bar { height:4px;margin-top:8px;border-radius:9px;background:#e5e5da;overflow:hidden; }
.week-progress__bar i { display:block;height:100%;background:#879747;border-radius:9px;transition:width .25s; }
.plan-days { padding:5px 20px 18px; }
.dashboard-page .plan-day { margin-top:14px;border:1px solid #171c1914;border-radius:12px;overflow:hidden; }
.dashboard-page .plan-day__head { display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;background:#f0efe7; }
.dashboard-page .plan-day__head strong { font:700 14px "Space Grotesk",sans-serif;letter-spacing:-.03em; }
.dashboard-page .plan-day__head span { color:#7f897c;font:500 8px "DM Mono",monospace; }
.plan-task { display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:11px;align-items:center;padding:13px 14px;border-top:1px solid #171c1912; }
.plan-task.is-done .plan-task__title { color:#91998d;text-decoration:line-through; }
.plan-task__check { width:24px;height:24px;border:1px solid #c8cebd;border-radius:50%;background:#fffefa;color:#74804e;font-size:12px;cursor:pointer; }
.plan-task__check[aria-pressed="true"] { border-color:#879747;background:#879747;color:white; }
.plan-task__title { display:block;color:#2d352d;font-size:11px;font-weight:800;line-height:1.4; }
.plan-task__desc { display:block;margin-top:4px;color:#879084;font-size:9px;line-height:1.6; }
.plan-task__meta { display:flex;flex-direction:column;align-items:flex-end;gap:7px; }
.plan-task__meta small { color:#92998e;font:500 8px "DM Mono",monospace;white-space:nowrap; }
.plan-task__meta a { color:#687c38;font-size:9px;font-weight:800;text-decoration:none;white-space:nowrap; }
.topic-list { display:grid;gap:12px;padding:18px 20px 20px; }
.topic-row { display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center; }
.topic-row__name { color:#555f52;font-size:10px;font-weight:800; }
.topic-row__score { color:#687c38;font:500 9px "DM Mono",monospace; }
.topic-row__bar { grid-column:1 / -1;height:5px;border-radius:9px;background:#e5e5da;overflow:hidden; }
.topic-row__bar i { display:block;height:100%;border-radius:9px;background:#879747; }
.topic-row.is-weak .topic-row__bar i { background:#d98269; }
.topic-empty { padding:19px 20px;color:#828b80;font-size:10px;line-height:1.8; }
.next-step { padding:19px 20px; }
.next-step h3 { margin:0 0 8px;font:700 20px/.98 "Space Grotesk",sans-serif;letter-spacing:-.05em;text-transform:none; }
.next-step p { margin:0 0 15px;color:#7e887b;font-size:10px;line-height:1.8; }
.next-step .product-link { width:100%; }
.dashboard-disclaimer { margin:18px 2px 0;color:#939a8f;font-size:9px;line-height:1.7; }
.dashboard-loading { padding:45px 20px;color:#838c81;text-align:center;font-size:11px; }
.dashboard-error { margin:15px 0;padding:13px 15px;border-radius:10px;background:#fce9e4;color:#a34838;font-size:11px; }
@media(max-width:800px) {
  .goal-panel { grid-template-columns:1fr; }
  .goal-panel__target { padding:16px 0 0;border-left:0;border-top:1px solid #ffffff24; }
  .dashboard-columns { grid-template-columns:1fr; }
  .dashboard-kpis { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:520px) {
  .onboard-wrap { padding-top:35px; }
  .product-top { min-height:58px; }
  .product-top__step { font-size:7px; }
  .level-grid { grid-template-columns:repeat(3,1fr); }
  .profile-summary { grid-template-columns:1fr; }
  .onboard-actions { flex-wrap:wrap; }
  .onboard-actions__hint { flex-basis:100%;order:3; }
  .onboard-actions button { flex:1; }
  .onboard-foot { flex-direction:column; }
  .dashboard-wrap { padding-top:28px; }
  .dashboard-head { align-items:flex-start;flex-direction:column; }
  .dashboard-head__actions { width:100%; }
  .dashboard-head__actions .product-link { flex:1; }
  .goal-panel { padding:21px; }
  .dashboard-kpi { padding:14px; }
  .dashboard-kpi b { font-size:26px; }
  .product-panel__head { padding:17px; }
  .plan-days { padding:4px 12px 14px; }
  .plan-task { grid-template-columns:25px minmax(0,1fr); }
  .plan-task__meta { grid-column:2;flex-direction:row;justify-content:space-between;align-items:center; }
}

/* Landing feature explainer — explanatory, not fabricated live data. */
.feature-facts { display:grid;gap:10px; }
.feature-fact { display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:center;padding:13px 14px;border:1px solid #ffffff18;border-radius:10px;background:#ffffff06;color:#d8e0d4;font-size:10px;line-height:1.6; }
.feature-fact b { display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#e6f05a;color:#0b0e0d;font:500 9px "DM Mono",monospace; }
.route-step { display:flex;gap:15px;padding:19px 0;border-top:1px solid #171c1918;align-items:flex-start; }
.route-step > span { flex:none;width:31px;height:31px;display:grid;place-items:center;border:1px solid #879747;border-radius:50%;color:#71843b;font:500 9px "DM Mono",monospace; }
.route-step b { display:block;color:#273027;font:700 16px "Space Grotesk",sans-serif;letter-spacing:-.04em; }
.route-step p { margin:5px 0 0;color:#7c8679;font-size:10px;line-height:1.7; }
.experience .exp-content > .btn { margin-top:24px; }
.experience .exp-content > .plan-preview { margin-top:22px; }
.dashboard-page .product-top { position:relative; }
.dashboard-page #adminLink { color:#687c38;text-decoration:none;font-size:10px;font-weight:800; }
.dashboard-next-panel { margin-top:16px; }
