/* GENERADO por scripts/build-landing-app-ui.py a partir de styles.css.
   No editar a mano: son los estilos reales de la app, acotados a .appui. */
@keyframes app-taskIn { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: none; } }
.appui { --ivory: #f4f2fb;   --ivory-deep: #e9e6f5;   --paper: #fdfcff;   --night: #1c1a3d;   --graphite: #43505f;   --muted: #7b837f;   --electric: #3d3a8c;   --electric-dark: #2c2a6b;   --electric-soft: #ecebfa;   --mint: #87dbc5;   --mint-dark: #287d69;   --mint-soft: #e4f7f0;   /* Paleta Sukkiri. Marca: índigo y lavanda. Apoyo: cada color tiene un trabajo. */   --lavender: #a99cf0;   --lavender-soft: #f0edfd;   --sun: #f5c451;        /* rachas, celebración, logros */   --sun-soft: #fdf3d6;   --sun-deep: #8a5d00;   --sky: #6fb8e8;        /* Calendar, horarios, información */   --sky-soft: #e3f2fc;   --sky-deep: #1f6a99;   --rose: #e27aa6;       /* bienestar, lo personal */   --rose-soft: #fbe6f0;   --rose-deep: #a63d6b;   --coral: #ec8c7d;       /* grabando, urgente */   --coral-soft: #fde9e4;   --line: rgba(28, 26, 61, 0.1);   --shadow: 0 18px 50px rgba(28, 26, 61, 0.11);   --shadow-soft: 0 8px 24px rgba(28, 26, 61, 0.07);   --radius-xl: 32px;   --radius-lg: 24px;   --radius-md: 18px;   --font-brand: "Comfortaa", ui-rounded, "SF Pro Rounded", system-ui, sans-serif;   --safe-bottom: max(18px, env(safe-area-inset-bottom));   color-scheme: light;   font-family: Inter, ui-rounded, "SF Pro Rounded", "Avenir Next", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;   font-synthesis: none; color: var(--night); line-height: 1.5; -webkit-font-smoothing: antialiased; }
.appui .legal-nav { display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  font-size: 0.82rem; }
.appui .legal-nav a, .appui .legal-card a { color: var(--night, #1c1a3d);
  text-underline-offset: 0.18em; }
.appui .legal-shell { width: min(100% - 2rem, 760px);
  margin: 0 auto;
  padding: 2rem 0 3rem; }
.appui .legal-brand { display: inline-flex;
  margin-bottom: 1.4rem;
  text-decoration: none; }
.appui .legal-card { padding: clamp(1.35rem, 4vw, 2.6rem);
  border: 1px solid rgba(23, 35, 61, 0.11);
  border-radius: 1.6rem;
  background: rgba(253, 252, 255, 0.9);
  box-shadow: 0 18px 50px rgba(23, 35, 61, 0.08); }
.appui .legal-card h1 { margin: 0.35rem 0 0.35rem;
  font-size: clamp(2rem, 7vw, 3.2rem);
  line-height: 1.02; }
.appui .legal-card h2 { margin: 1.8rem 0 0.45rem;
  font-size: 1.08rem; }
.appui .legal-card p { margin: 0;
  color: #44506a;
  line-height: 1.7; }
.appui .legal-nav { margin-top: 1.2rem; }
.appui button, .appui textarea, .appui input, .appui select { font: inherit; }
.appui button { color: inherit; -webkit-tap-highlight-color: transparent; }
.appui .topbar { position: sticky;
  z-index: 20;
  top: 0;
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr) 70px;
  align-items: center;
  min-height: 72px;
  padding: max(14px, env(safe-area-inset-top)) 14px 10px;
  background: linear-gradient(to bottom, rgba(247, 241, 231, 0.98) 72%, rgba(247, 241, 231, 0)); }
.appui .brand { display: inline-flex; align-items: center; color: var(--night); text-decoration: none; }
.appui .brand--small { grid-column: 2; justify-self: center; gap: 9px; }
.appui .wordmark { display: block; width: auto; height: 22px; }
.appui .brand-logo { display: block; flex: 0 0 auto; object-fit: cover; border-radius: 23%; }
.appui .brand-logo--small { width: 28px; height: 28px; }
.appui .icon-button { display: grid;
  width: 42px;
  height: 42px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: rgba(253, 252, 255, 0.72);
  font-size: 24px;
  cursor: pointer; }
.appui .quick-plan-button { grid-column: 1;
  justify-self: start;
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  gap: 5px;
  padding: 0 11px;
  border: 1px solid rgba(61, 58, 140, .22);
  border-radius: 14px;
  color: var(--electric-dark);
  background: var(--electric-soft);
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer; }
.appui .quick-plan-button:hover { background: #e2dff7; }
.appui .quick-plan-button[hidden] { display: none; }
.appui .topbar-back-button { grid-column: 1;
  justify-self: start;
  display: grid;
  width: 42px;
  height: 42px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(21, 44, 78, .1);
  border-radius: 50%;
  color: var(--night);
  background: rgba(253, 252, 255, .8);
  box-shadow: 0 6px 14px rgba(21,44,78,.05);
  font: inherit;
  cursor: pointer; }
.appui .topbar-back-button span { font-size: 25px; line-height: 1; transform: translateY(-1px); }
.appui .topbar-back-button:hover { border-color: rgba(61, 58, 140,.3); color: var(--electric-dark); }
.appui .topbar-back-button[hidden] { display: none; }
.appui .profile-button { grid-column: 3;
  display: inline-flex;
  width: auto;
  min-width: 70px;
  height: 42px;
  padding: 0 10px;
  justify-self: end;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 1px solid rgba(61, 58, 140, .2);
  border-radius: 14px;
  color: var(--electric-dark);
  background: var(--electric-soft);
  box-shadow: 0 6px 16px rgba(61, 58, 140, .12);
  transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease; }
.appui .profile-button:hover { background: #e2dff7; box-shadow: 0 8px 18px rgba(61, 58, 140, .17); transform: translateY(-1px); }
.appui .profile-button:active { transform: translateY(1px) scale(.98); }
.appui .profile-button__icon { font-size: 18px; line-height: 1; }
.appui .profile-button__label { font-size: 10px; font-weight: 850; letter-spacing: -.01em; }
.appui .view { min-height: calc(100svh - 72px); padding: 30px 24px calc(34px + var(--safe-bottom)); }
.appui .view[hidden], .appui .topbar[hidden] { display: none !important; }
.appui h1, .appui h2, .appui h3, .appui p { margin-top: 0; }
.appui h1 { margin-bottom: 14px; font-family: var(--font-brand); font-size: clamp(34px, 9vw, 48px); font-weight: 700; line-height: 1.08; letter-spacing: -0.03em; }
.appui h2 { font-family: var(--font-brand); font-weight: 700; letter-spacing: -0.015em; }
.appui .page-heading > p:last-child { color: var(--graphite); font-size: 17px; line-height: 1.55; }
.appui .eyebrow { margin-bottom: 11px; color: var(--electric-dark); font-size: 12px; font-weight: 850; letter-spacing: 0.16em; text-transform: uppercase; }
.appui .primary-button { display: flex;
  width: 100%;
  min-height: 58px;
  padding: 16px 20px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border: 0;
  border-radius: 19px;
  color: white;
  background: var(--electric);
  box-shadow: 0 12px 26px rgba(61, 58, 140, 0.24);
  font-weight: 800;
  cursor: pointer;
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease; }
.appui .primary-button--large { min-height: 64px; border-radius: 21px; }
.appui .primary-button:hover:not(:disabled) { background: var(--electric-dark); box-shadow: 0 15px 34px rgba(61, 58, 140, 0.3); transform: translateY(-2px); }
.appui .primary-button:active:not(:disabled) { transform: translateY(1px) scale(0.99); }
.appui .primary-button:disabled { color: rgba(255,255,255,.72); background: #abb7c8; box-shadow: none; cursor: not-allowed; }
.appui .text-button { padding: 4px; border: 0; color: var(--electric-dark); background: transparent; font-size: 13px; font-weight: 800; cursor: pointer; }
.appui .secondary-button { display: flex; min-height: 50px; padding: 13px 16px; align-items: center; justify-content: center; border-radius: 16px; font-weight: 800; cursor: pointer; }
.appui .secondary-button { border: 1px solid var(--line); color: var(--night); background: var(--paper); }
.appui .page-heading { margin-bottom: 22px; }
.appui .page-heading h1 { margin-bottom: 10px; }
.appui .capture-view { display: flex; flex-direction: column; }
.appui .capture-options { margin-top: 18px; }
.appui .capture-options > summary { padding: 12px 0; color: var(--muted); font-size: 12px; cursor: pointer; }
.appui .capture-options[open] > summary { margin-bottom: 10px; }
.appui .capture-view .map-portal-button { margin: 6px 0 0; min-height: 44px; padding: 8px 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
.appui .capture-view .recorder { min-height: 172px; margin: 8px 0; }
.appui .capture-view .recorder-status { max-width: calc(100% - 76px); text-align: center; font-size: 12px; font-weight: 600; }
.appui .capture-view .sound-ring--outer { display: none; }
.appui .capture-view .sound-ring--inner { border: 0; background: transparent; }
.appui .capture-view .clear-dump-button:disabled { visibility: hidden; }
.appui .capture-view .fallback-heading label { font-size: 13px; color: var(--muted); font-weight: 500; }
.appui .capture-view .page-heading { margin-bottom: 12px; }
.appui .capture-view .page-heading > p:last-child { margin-bottom: 0; font-size: 15px; line-height: 1.48; }
.appui .recorder { position: relative; display: flex; min-height: 164px; flex-direction: column; align-items: center; justify-content: center; }
.appui .mic-button { position: relative;
  z-index: 3;
  display: grid;
  width: 92px;
  height: 92px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: white;
  background: linear-gradient(145deg, #6c66d6, var(--electric-dark));
  box-shadow: 0 20px 38px rgba(61, 58, 140, 0.28), inset 0 1px 0 rgba(255,255,255,.25);
  cursor: pointer;
  transition: transform 200ms ease; }
.appui .mic-button:hover { transform: scale(1.035); }
.appui .mic-icon { position: relative; width: 29px; height: 39px; border: 4px solid currentColor; border-radius: 16px; }
.appui .mic-icon::before { content: ""; position: absolute; width: 43px; height: 28px; left: -11px; bottom: -12px; border: 4px solid currentColor; border-top: 0; border-radius: 0 0 24px 24px; }
.appui .mic-icon::after { content: ""; position: absolute; width: 4px; height: 13px; left: 9px; bottom: -23px; border-radius: 4px; background: currentColor; }
.appui .sound-ring { position: absolute; z-index: 1; border: 1px solid rgba(61, 58, 140, 0.18); border-radius: 50%; }
.appui .sound-ring--inner { width: 124px; height: 124px; background: rgba(61, 58, 140, 0.055); }
.appui .sound-ring--outer { width: 162px; height: 162px; }
.appui .recorder-status { position: absolute; bottom: 4px; margin: 0; color: var(--graphite); font-size: 14px; font-weight: 780; }
.appui .recording-time { position: absolute; bottom: -17px; color: var(--graphite); font-size: 12px; font-variant-numeric: tabular-nums; }
.appui .pause-listening-button { position: absolute; z-index: 4; right: 0; bottom: 0; display: inline-grid; width: 40px; height: 40px; place-items: center; padding: 0; border: 1px solid rgba(61, 58, 140,.22); border-radius: 50%; color: var(--electric-dark); background: var(--paper); box-shadow: var(--shadow-soft); font-size: 16px; font-weight: 900; cursor: pointer; }
.appui .pause-listening-button:hover { background: var(--electric-soft); }
.appui .pause-listening-button[data-state="resume"] { color: #28725f; border-color: rgba(70, 171, 144, .28); }
.appui .pause-listening-button[hidden] { display: none; }
.appui .text-fallback { margin: 14px 0 14px; }
.appui .map-portal-button { display: flex; width: 100%; min-height: 54px; margin: 18px 0 12px; align-items: center; gap: 12px; padding: 9px 14px; border: 1px solid rgba(61, 58, 140, .2); border-radius: 17px; color: var(--ink); background: rgba(255, 255, 255, .52); box-shadow: 0 10px 26px rgba(21, 44, 78, .05); cursor: pointer; text-align: left; }
.appui .map-portal-button:hover { border-color: rgba(61, 58, 140, .42); background: var(--electric-soft); }
.appui .map-portal-button[hidden] { display: none; }
.appui .fallback-heading { display: flex; margin-bottom: 10px; align-items: center; justify-content: space-between; }
.appui .fallback-heading label, .appui .sheet-label { font-size: 14px; font-weight: 820; }
.appui .fallback-actions { display: flex; align-items: center; gap: 9px; }
.appui .clear-dump-button { color: #a7483d; }
.appui .clear-dump-button:disabled { opacity: .45; cursor: default; }
.appui .live-pill { display: inline-flex; padding: 5px 8px; align-items: center; gap: 6px; border-radius: 999px; color: var(--electric-dark); background: var(--electric-soft); font-size: 10px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.appui .live-pill[hidden] { display: none; }
.appui .live-pill > span { width: 7px; height: 7px; border-radius: 50%; background: var(--electric); animation: liveBlink 1.3s ease-in-out infinite; }
.appui textarea { display: block;
  width: 100%;
  padding: 16px 17px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  color: var(--night);
  background: rgba(253, 252, 255, 0.9);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5);
  font-size: 16px;
  line-height: 1.5; }
.appui .capture-view textarea { min-height: 124px; background: var(--paper); }
.appui .voice-input { position: relative; }
.appui .voice-input textarea[hidden] { display: none; }
.appui textarea::placeholder { color: #9b9f9c; }
.appui .field-hint { margin: 9px 3px 0; color: var(--muted); font-size: 11px; line-height: 1.4; }
.appui .review-list { display: grid; margin: 24px 0 18px; gap: 10px; }
.appui .review-task { display: grid; min-height: 66px; padding: 12px 13px 12px 15px; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 17px; background: var(--paper); box-shadow: var(--shadow-soft); }
.appui .review-task strong { display: block; font-size: 14px; line-height: 1.3; }
.appui .review-task small { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; }
.appui .review-actions { display: flex; align-items: center; gap: 4px; }
.appui .review-icon-button { display: grid; width: 34px; height: 34px; padding: 0; place-items: center; border: 1px solid var(--line); border-radius: 10px; color: var(--graphite); background: var(--ivory); cursor: pointer; }
.appui .review-icon-button--delete { color: #a7483d; background: var(--coral-soft); border-color: rgba(184,73,60,.12); }
.appui .review-back-button { display: block; margin: 17px auto 0; }
.appui .carryover-note { margin: 20px 0 14px; padding: 13px 15px; border: 1px solid rgba(61, 58, 140,.16); border-radius: 16px; color: var(--electric-dark); background: var(--electric-soft); font-size: 13px; font-weight: 750; line-height: 1.4; }
.appui .carryover-note { margin-top: -3px; color: var(--mint-dark); border-color: rgba(40,125,105,.16); background: var(--mint-soft); }
.appui .plan-view { padding-top: 22px; }
.appui .plan-header { display: flex; margin-bottom: 24px; align-items: flex-start; justify-content: space-between; gap: 16px; }
.appui .plan-header h1 { margin: 0; font-size: clamp(33px, 8vw, 42px); }
.appui .plan-guidance { margin: -16px 4px 26px; color: var(--muted); font-size: 12px; line-height: 1.5; transition: color 220ms ease, transform 220ms ease; }
.appui .top-three { margin: 0 0 22px; padding: 16px 15px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--paper); box-shadow: var(--shadow-soft); }
.appui .top-three[hidden] { display: none; }
.appui .top-three__header { display: flex; margin-bottom: 4px; align-items: baseline; justify-content: space-between; gap: 12px; }
.appui .top-three__header h2 { margin: 0; font-size: 17px; }
.appui .top-three__progress { color: var(--electric-dark); font-size: 12px; font-weight: 900; }
.appui .top-three__list { display: grid; gap: 8px; }
.appui .top-three__item { display: flex; width: 100%; min-height: 60px; padding: 6px 8px 6px 6px; align-items: center; gap: 4px; border: 1px solid rgba(28, 26, 61,.08); border-radius: var(--radius-md); background: var(--ivory); transition: border-color 180ms ease, background 180ms ease, opacity 220ms ease; }
.appui .top-three__item:hover { border-color: rgba(61, 58, 140,.28); }
.appui .top-three__check:focus-visible, .appui .top-three__copy:focus-visible { outline: 3px solid rgba(61, 58, 140,.28); outline-offset: 2px; }
.appui .top-three__item.is-done { opacity: .55; background: rgba(228,247,240,.7); }
.appui .top-three__item.is-done strong { text-decoration: line-through; text-decoration-thickness: 1.5px; }
.appui .top-three__check { display: grid; width: 48px; height: 48px; flex: 0 0 auto; place-items: center; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #fff; font: inherit; font-size: 15px; font-weight: 900; cursor: pointer; position: relative; }
.appui .top-three__check::before { content: ""; position: absolute; inset: 10px; border: 2.5px solid #bcc3c5; border-radius: 50%; background: transparent; transition: background 160ms ease, border-color 160ms ease; }
.appui .top-three__check { isolation: isolate; }
.appui .top-three__item:nth-child(1) .top-three__check::before { border-color: var(--electric); }
.appui .top-three__item:nth-child(2) .top-three__check::before { border-color: var(--rose); }
.appui .top-three__item:nth-child(3) .top-three__check::before { border-color: var(--sun); }
.appui .top-three__item:nth-child(2):hover { border-color: rgba(226,122,166,.4); background: var(--rose-soft); }
.appui .top-three__item:nth-child(3):hover { border-color: rgba(245,196,81,.5); background: var(--sun-soft); }
.appui .top-three__item.is-done .top-three__check::before { z-index: -1; border-color: var(--mint-dark); background: var(--mint-dark); }
.appui .top-three__copy { min-width: 0; flex: 1; min-height: 48px; padding: 4px 6px; border: 0; border-radius: 12px; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.appui .top-three__copy strong { display: block; color: var(--night); font-size: 16px; line-height: 1.25; }
.appui .top-three__copy small { display: block; margin-top: 2px; color: var(--muted); font-size: 12px; }
.appui .top-three__done { margin-top: 14px; padding: 13px 14px; border: 1px solid rgba(40,125,105,.16); border-radius: 16px; background: var(--mint-soft); }
.appui .top-three__done[hidden] { display: none; }
.appui .top-three__done strong { display: block; color: var(--mint-dark); font-size: 15px; }
.appui .top-three__done p { margin: 4px 0 0; color: var(--graphite); font-size: 12px; line-height: 1.45; }
.appui .usage-streak { position: relative; width: 100%; min-height: 74px; display: flex; align-items: center; gap: 11px; margin: 0 0 22px; padding: 11px 14px; border: 1px solid #efcea0; border-radius: 20px; color: #72340e; background: linear-gradient(115deg,#fff9ed,#ffedcf); box-shadow: 0 3px 0 #efd7b1, inset 0 1px 0 #fff; text-align: left; cursor: pointer; transition: transform 180ms, box-shadow 180ms; }
.appui .usage-streak:hover { transform: translateY(-2px); box-shadow: 0 5px 0 #efd7b1,0 8px 20px #c7891910; }
.appui .usage-streak:active { transform: translateY(2px); box-shadow: 0 1px 0 #efd7b1; }
.appui .usage-streak .streak-flame { width: 38px; height: 46px; flex-shrink: 0; filter: drop-shadow(0 3px 2px #bd672622); }
.appui .usage-streak__copy { display: grid; gap: 4px; flex: 1; min-width: 0; }
.appui .usage-streak__copy strong { font-size: 17px; line-height: 1.15; letter-spacing: -.5px; font-weight: 900; }
.appui .usage-streak__copy small { font-size: 10px; color: #815325; }
.appui .usage-streak__trail { display: grid; gap: 7px; justify-items: end; flex-shrink: 0; }
.appui .usage-streak__trail small { font-size: 10px; color: #865629; font-weight: 700; }
.appui [data-streak-mini] i.is-active { background: linear-gradient(#ffa546,#ee692b); box-shadow: inset 0 1px 0 #ffce70; }
.appui .usage-streak.is-earned .streak-flame { animation: flameEarn 1100ms cubic-bezier(.16,1,.3,1) both; }
.appui .usage-streak.is-earned [data-streak-count] { animation: countEarn 700ms 220ms both; }
.appui .streak-hero { position: relative; display: grid; justify-items: center; padding-top: 2px; }
.appui .streak-hero__halo { position: absolute; width: 170px; height: 170px; top: -20px; border-radius: 50%; background: radial-gradient(#ffc86844,transparent 70%); }
.appui .streak-hero > .streak-flame { width: 78px; height: 94px; filter: drop-shadow(0 8px 12px #df8a2922); }
.appui .streak-hero > strong { font-size: 68px; line-height: 1; letter-spacing: -4px; font-weight: 950; color: #cf591f; margin: 3px 0; }
.appui .streak-hero h2 { font-size: 18px; margin: 0; color: #8a431f; }
.appui .streak-today { margin-top: 12px; padding: 5px 10px; color: #39785a; background: #e4f1e7; border-radius: 99px; font-size: 11px; font-weight: 750; }
.appui .streak-week { list-style: none; display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 6px; padding: 0; margin: 20px 0; }
.appui .streak-day { display: grid; justify-items: center; gap: 8px; }
.appui .streak-day small { font-size: 11px; color: #776855; }
.appui .streak-day span { display: grid; place-items: center; width: 32px; height: 36px; border-radius: 12px; background: #eee8dd; border: 1px solid #e4daca; color: #8f8474; }
.appui .streak-day.is-active span { background: linear-gradient(#ffb74b,#f78c32); border-color: #e78428; color: #63300d; font-weight: 900; box-shadow: 0 3px 0 #dc7927; }
.appui .streak-goal { padding: 14px 16px; border: 1px solid #eadcc5; border-radius: 16px; background: #fffcf6; }
.appui .streak-goal > div { display:flex; justify-content:space-between; gap:8px; font-size:12px; color:#775030; }
.appui .streak-goal progress { appearance:none; width:100%; height:9px; display:block; margin:11px 0 8px; border:0; border-radius:99px; overflow:hidden; background:#e8e5f3; accent-color:#f29a36; }
.appui .streak-goal progress::-webkit-progress-bar { background:#e8e5f3; }
.appui .streak-goal progress::-webkit-progress-value { background:linear-gradient(90deg,#ffbd54,#f3872c); border-radius:99px; }
.appui .streak-goal progress::-moz-progress-bar { background:#f29a36; border-radius:99px; }
.appui .streak-goal p { font-size:11px; color:#87694b; margin:0; }
.appui .streak-record { display: flex; justify-content: space-between; padding: 14px 0 8px; margin-bottom: 8px; font-size:12px; color:#7c674f; }
.appui .time-group { position: relative; }
.appui .time-group[hidden] { display: none; }
.appui .time-group__heading { display: flex; margin-bottom: 12px; align-items: center; gap: 14px; }
.appui .time-group__heading h2 { margin: 0 0 2px; font-size: 19px; }
.appui .time-group__heading p { margin: 0; color: var(--muted); font-size: 11px; }
.appui .time-indicator { position: relative; z-index: 1; width: 15px; height: 15px; flex: 0 0 auto; border: 4px solid var(--ivory); border-radius: 50%; box-shadow: 0 0 0 1px rgba(28, 26, 61,.06); }
.appui .time-indicator--now { background: var(--electric); }
.appui .time-indicator--next { background: var(--mint); }
.appui .time-indicator--later { background: #b8b5ad; }
.appui .time-indicator--completed { display: grid; place-items: center; color: white; background: var(--mint-dark); font-size: 8px; font-weight: 900; }
.appui .time-group--completed { margin-top: 8px; opacity: .78; }
.appui .task-list { display: grid; min-height: 32px; margin-left: 28px; gap: 10px; border-radius: var(--radius-md); transition: min-height 180ms ease, background 180ms ease; }
.appui .task-list--completed { padding-bottom: 4px; }
.appui .task-card { position: relative; display: grid; min-height: 86px; padding: 15px 14px; grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: 12px; overflow: visible; border: 1px solid rgba(28, 26, 61,.08); border-radius: var(--radius-md); background: var(--paper); box-shadow: 0 6px 19px rgba(28, 26, 61,.055); transition: opacity 300ms ease, transform 300ms ease, background 300ms ease, box-shadow 180ms ease; }
.appui .task-card.just-added { animation: app-taskIn 430ms cubic-bezier(.2,.8,.2,1) both; }
.appui .task-card.is-completing { background: var(--mint-soft); transform: scale(.985); }
.appui .task-card.is-complete { opacity: .58; background: rgba(228,247,240,.7); }
.appui .task-card.is-complete h3 { text-decoration: line-through; text-decoration-thickness: 1.5px; }
.appui .check-button { display: grid; width: 31px; height: 31px; flex: 0 0 auto; padding: 0; place-items: center; border: 1.5px solid #bcc3c5; border-radius: 50%; color: transparent; background: transparent; cursor: pointer; transition: background 220ms ease, border 220ms ease, color 220ms ease, transform 220ms ease; }
.appui .check-button:hover { border-color: var(--mint-dark); transform: scale(1.08); }
.appui .task-card.is-complete .check-button, .appui .task-card.is-completing .check-button { border-color: var(--mint-dark); color: white; background: var(--mint-dark); }
.appui .task-card__body { min-width: 0; flex: 1; cursor: pointer; border-radius: 10px; }
.appui .task-card__body > h3 { padding-right: 42px; }
.appui .task-card__body:focus-visible { outline: 3px solid rgba(61, 58, 140,.28); outline-offset: 4px; }
.appui .task-card h3 { margin: 0 0 5px; font-size: 15px; line-height: 1.25; }
.appui .task-card p { margin: 0; color: var(--muted); font-size: 11px; }
.appui .task-subtasks { margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(28, 26, 61,.08); cursor: default; }
.appui .task-subtasks[hidden] { display: none; }
.appui .task-subtasks ul { display: grid; margin: 0; padding: 0; gap: 6px; list-style: none; }
.appui .urgency-badge { padding: 5px 7px; border-radius: 7px; color: #a7483d; background: var(--coral-soft); font-size: 9px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.appui .task-more-button { position: absolute; top: 11px; right: 11px; display: grid; width: 31px; height: 31px; padding: 0; place-items: center; border: 1px solid transparent; border-radius: 10px; color: var(--graphite); background: transparent; font-size: 22px; line-height: 1; cursor: pointer; }
.appui .task-more-button:hover, .appui .task-more-button:focus-visible { border-color: rgba(61, 58, 140,.2); color: var(--electric-dark); background: var(--electric-soft); }
.appui .urgency-badge { display: none !important; }
.appui .task-card__controls { position: absolute; right: 10px; bottom: 5px; display: flex; gap: 4px; }
.appui .task-card__controls[hidden] { display: none; }
.appui .task-card:not(.is-complete) { padding-bottom: 52px; }
.appui .task-reminder-button { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: transparent; color: #89918f; cursor: pointer; }
.appui .task-reminder-button[data-reminder-state="on"] { color: #21836b; }
.appui .task-reminder-button[data-reminder-state="off"] { color: #b44d44; }
.appui .task-reminder-button:hover { background: rgba(28, 26, 61,.04); }
.appui .task-reminder-button:focus-visible, .appui .drag-handle:focus-visible { outline: 3px solid var(--electric); outline-offset: 2px; }
.appui #editTaskForm .sheet__header { margin-bottom: 18px; }
.appui .task-when { display: grid; gap: 12px; padding: 14px; margin: 6px 0 22px; border: 1px solid rgba(61, 58, 140, .12); border-radius: 20px; background: rgba(253, 252, 255, .8); }
.appui .task-when > .sheet-label { margin: 0; }
.appui .when-row { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 10px; }
.appui .when-field { display: grid; gap: 6px; min-width: 0; font-size: 13px; font-weight: 800; color: var(--night); }
.appui .when-field small { font-weight: 500; color: var(--muted); }
.appui .when-field .sheet-input, .appui .when-field .sheet-select, .appui .task-when > .sheet-input { width: 100%; min-width: 0; min-height: 46px; margin: 0; padding-inline: 12px; font: inherit; font-size: 15px; }
.appui .task-when .field-hint { margin: -4px 0 0; font-size: 12px; line-height: 1.45; }
.appui .task-when .field-hint:empty { display: none; }
.appui #editTaskForm > .sheet-input, .appui #editTaskForm > .sheet-label { margin-bottom: 12px; }
.appui #editTaskForm > .primary-button { margin-top: 20px; }
.appui .reorder-button { display: grid; width: 32px; height: 30px; padding: 0; place-items: center; border: 1px solid var(--line); border-radius: 9px; color: var(--graphite); background: var(--ivory); font-weight: 850; cursor: pointer; }
.appui .reorder-button:hover:not(:disabled) { color: var(--electric-dark); border-color: rgba(61, 58, 140,.28); background: var(--electric-soft); }
.appui .reorder-button:disabled { opacity: .3; cursor: not-allowed; }
.appui .drag-handle { width: 44px; height: 44px; border: 0; border-radius: 50%; color: var(--electric-dark); background: transparent; touch-action: none; cursor: grab; }
.appui .drag-handle:active { cursor: grabbing; transform: scale(.96); }
.appui .task-card__body > h3 { padding-right: 48px; }
.appui .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.appui .sheet { width: min(calc(100% - 24px), 496px); max-width: none; max-height: min(78svh, 660px); margin: auto auto 12px; padding: 0; overflow: visible; border: 0; border-radius: 29px; color: var(--night); background: transparent; }
.appui .sheet[open] { animation: sheetIn 330ms cubic-bezier(.2,.8,.2,1) both; }
.appui .sheet__surface { max-height: min(78svh, 660px); padding: 10px 20px calc(22px + var(--safe-bottom)); overflow-y: auto; border-radius: 29px; background: var(--ivory); box-shadow: var(--shadow); }
.appui .sheet__handle { width: 38px; height: 4px; margin: 1px auto 18px; border-radius: 4px; background: rgba(28, 26, 61,.18); }
.appui .sheet__header { display: flex; margin-bottom: 22px; align-items: flex-start; justify-content: space-between; gap: 12px; }
.appui .sheet__header h2 { margin: 0; font-size: 27px; }
.appui .sheet__header .eyebrow { margin-bottom: 5px; }
.appui .sheet-label { display: block; margin-bottom: 9px; }
.appui .sheet-input, .appui .sheet-select { width: 100%; min-height: 50px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; color: var(--night); background: var(--paper); font: inherit; font-size: 15px; }
.appui .sheet .primary-button { margin-top: 15px; }
.appui .completion-reward { position:absolute; z-index:2; top:calc(78px + env(safe-area-inset-top,0px)); left:50%; transform:translateX(-50%); width:max-content; max-width:calc(100% - 32px); display:flex; align-items:center; gap:12px; padding:14px 18px; border:1px solid #b9e2d3; border-radius:22px; background:linear-gradient(120deg,#fefdff,#e9f8ef); box-shadow:0 12px 36px #205d4224,inset 0 1px 0 white; }
.appui .completion-reward > div { min-width:0; }
.appui .completion-reward strong { display:block; font-size:15px; letter-spacing:-.35px; color:#235941; }
.appui .completion-reward small { display:block; max-width:240px; margin-top:4px; font-size:11px; color:#567564; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.appui .day-status { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 0 18px; }
.appui .day-chip { display: flex; min-width: 0; min-height: 46px; padding: 0 10px; align-items: center; justify-content: center; gap: 7px; border: 0; border-radius: 15px; font: inherit; font-size: 14px; font-weight: 850; white-space: nowrap; }
.appui .day-chip strong { overflow: hidden; text-overflow: ellipsis; }
.appui button.day-chip { cursor: pointer; transition: transform 160ms ease; }
.appui button.day-chip:active { transform: scale(.97); }
.appui button.day-chip:focus-visible { outline: 3px solid rgba(61, 58, 140, .3); outline-offset: 2px; }
.appui .day-chip--streak { color: #7a3d10; background: #fdf1d3; }
.appui .day-chip--streak .streak-flame { width: 16px; height: 20px; flex: 0 0 auto; }
.appui .day-chip--medals { color: var(--electric); background: var(--electric-soft, #ebe8fb); }
.appui .day-chip__medal { display: block; width: 17px; height: 22px; flex: 0 0 auto; }
.appui .day-chip__medal svg { width: 100%; height: 100%; }
.appui .day-chip--progress { color: #185c49; background: #e3f5ef; }
.appui .day-chip--progress .progress-orb { --progress: 0deg; width: 18px; height: 18px; flex: 0 0 auto; border-radius: 50%; background: conic-gradient(var(--mint-dark) var(--progress), rgba(24, 92, 73, .2) 0); }
.appui .plan-header { display: flex; margin-bottom: 18px; align-items: flex-start; justify-content: space-between; gap: 12px; }
.appui .plan-header h1 { margin: 2px 0 4px; font-size: clamp(32px, 8vw, 40px); }
.appui .plan-subtitle { margin: 0; color: var(--muted); font-size: 13px; font-weight: 650; }
.appui .plan-more-button { display: grid; width: 46px; height: 46px; flex: 0 0 auto; place-items: center; border: 1.5px solid rgba(61, 58, 140, .16); border-radius: 15px; background: var(--paper); color: var(--electric); cursor: pointer; }
.appui .plan-more-button:focus-visible { outline: 3px solid rgba(61, 58, 140, .3); outline-offset: 2px; }
.appui .plan-guidance { margin: 0 4px 14px; }
.appui .plan-guidance:empty { display: none; }
.appui .upcoming-days { margin: 6px 0 16px; }
.appui .upcoming-days[hidden] { display: none; }
.appui .upcoming-days__summary { display: flex; min-height: 50px; padding: 0 15px; align-items: center; justify-content: space-between; border-radius: 15px; background: var(--electric-soft, #ebe8fb); color: var(--electric); font-size: 15px; font-weight: 850; cursor: pointer; list-style: none; }
.appui .upcoming-days__summary::-webkit-details-marker { display: none; }
.appui .upcoming-days__summary::after { content: "\25BE"; transition: transform 200ms ease; }
.appui .upcoming-days[open] .upcoming-days__summary { margin-bottom: 12px; }
.appui .upcoming-days[open] .upcoming-days__summary::after { transform: rotate(180deg); }
.appui .task-list--upcoming .drag-handle { display: none !important; }
.appui .top-three__item.just-added, .appui .task-card.just-added { animation: app-taskIn 430ms cubic-bezier(.2,.8,.2,1) both, addedGlow 2800ms ease-out both; }
.appui .calendar-nudge { display: flex; gap: 12px; align-items: flex-start; margin: 4px 0 16px; padding: 14px 16px; border: 1px solid rgba(47,111,223,.18); border-radius: 18px; background: linear-gradient(135deg, rgba(47,111,223,.08), rgba(47,111,223,.02)); }
.appui .calendar-nudge[hidden] { display: none; }
.appui .first-win { display: flex; gap: 12px; align-items: flex-start; margin: 4px 0 16px; padding: 14px 16px; border: 1px solid rgba(245,196,81,.55); border-radius: 18px; background: linear-gradient(135deg, rgba(245,196,81,.22), rgba(245,196,81,.05)); }
.appui .first-win[hidden] { display: none; }
.appui .first-win__icon { display: grid; flex: 0 0 36px; height: 36px; place-items: center; border-radius: 12px; background: #f5c451; font-size: 18px; }
.appui .first-win__copy { min-width: 0; }
.appui .first-win__copy strong { display: block; color: var(--ink); font-size: 15px; }
.appui .first-win__copy p { margin: 4px 0 10px; color: var(--muted); font-size: 13px; line-height: 1.45; }
.appui .first-win__actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.appui .first-win__actions .primary-button { width: auto; min-height: 38px; margin: 0; padding: 0 20px; font-size: 14px; }
.appui .calendar-nudge__icon { display: grid; flex: 0 0 36px; height: 36px; place-items: center; border-radius: 12px; background: #2f6fdf; color: #fff; font-size: 18px; }
.appui .calendar-nudge__copy { min-width: 0; }
.appui .calendar-nudge__copy strong { display: block; color: var(--ink); font-size: 15px; }
.appui .calendar-nudge__copy p { margin: 4px 0 10px; color: var(--muted); font-size: 13px; line-height: 1.45; }
.appui .calendar-nudge__actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.appui .calendar-nudge__actions .primary-button { width: auto; min-height: 38px; margin: 0; padding: 0 20px; font-size: 14px; }
.appui .delegate-open-button { display: flex; width: 100%; margin-top: 18px; padding: 12px 14px; align-items: center; gap: 12px; border: 1px dashed rgba(61, 58, 140, .3); border-radius: 16px; color: var(--night); background: var(--lavender-soft); font: inherit; text-align: left; cursor: pointer; }
.appui .delegate-open-button > span:first-child { font-size: 22px; }
.appui .delegate-open-button strong { display: block; font-size: 14px; }
.appui .delegate-open-button small { display: block; margin-top: 2px; color: var(--graphite); font-size: 12px; }
.appui .delegate-task { margin: 4px 0 14px; padding: 12px 14px; border-radius: 14px; color: var(--night); background: var(--electric-soft); font-weight: 800; line-height: 1.35; }
.appui .delegate-whatsapp { background: #1f8f55; }
.appui .delegate-status { margin-bottom: 4px; padding: 12px 14px; border-radius: 16px; background: var(--mint-soft); color: var(--night); }
.appui .delegate-status p { margin: 0 0 10px; font-weight: 700; line-height: 1.4; }
.appui .delegate-badge { display: inline-flex; margin-top: 6px; padding: 3px 8px; border-radius: 999px; color: var(--electric-dark); background: var(--lavender-soft); font-size: 11px; font-weight: 800; }
.appui .delegate-badge[data-state="accepted"] { color: var(--mint-dark); background: var(--mint-soft); }
.appui .delegate-badge[data-state="declined"] { color: #a7483d; background: var(--coral-soft); }
.appui .delegate-badge[data-state="done"] { color: var(--mint-dark); background: var(--mint-soft); }
.appui .favor-shell .favor-card { text-align: left; }
.appui .favor-task { margin: 14px 0 6px; padding: 14px 16px; border-radius: 16px; color: var(--night); background: var(--electric-soft); font-size: 18px; font-weight: 800; line-height: 1.35; }
.appui .favor-when { margin: 0 0 8px; color: var(--electric); font-weight: 800; text-transform: none; }
.appui .favor-actions { display: grid; gap: 10px; margin-top: 18px; }
.appui .favor-actions .primary-button { width: 100%; margin: 0; text-decoration: none; color: #fff; }
.appui .favor-note { margin-top: 14px; color: var(--graphite); font-size: 13px; }
.appui .delegate-sheet a.primary-button, .appui .delegate-sheet a.secondary-button { color: inherit; text-decoration: none; }
.appui .delegate-sheet a.primary-button { color: #fff; }
.appui .delegate-sheet a[aria-disabled="true"] { opacity: .55; pointer-events: none; }
.appui .delegate-badge[data-state="ai"] { color: #0f6b57; background: #e3f6ef; }
.appui .delegated-days__hint { margin: 2px 4px 10px; color: var(--graphite); font-size: 13px; line-height: 1.45; }
.appui .delegate-hint { display: flex; width: fit-content; margin-top: 6px; padding: 4px 10px; border: 1px dashed rgba(138, 93, 0, .35); border-radius: 999px; color: var(--sun-deep); background: var(--sun-soft); font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.appui .delegate-hint[hidden] { display: none; }
.appui .delegate-sheet__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.appui .delegate-sheet__head h2 { margin: 0; color: var(--night); font-size: 24px; }
.appui .delegate-sheet .delegate-task { margin: 0 0 14px; }
.appui .delegate-status { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.appui .delegate-status p { margin: 0; }
.appui .delegate-status .text-button { flex: 0 0 auto; padding: 6px 0; }
.appui .delegate-person { display: grid; gap: 10px; }
.appui .delegate-person .sheet-input { margin: 0; }
.appui .delegate-person .primary-button { width: 100%; margin: 0; }
.appui .delegate-person__note { margin: 0; color: var(--graphite); font-size: 12.5px; text-align: center; }
.appui .delegate-link { padding: 0; border: 0; background: none; color: var(--electric); font: inherit; font-weight: 800; text-decoration: underline; cursor: pointer; }
.appui .delegate-link:disabled { opacity: .5; }
.appui .delegate-or { display: grid; gap: 10px; margin-top: 12px; text-align: center; }
.appui .delegate-or > span { color: var(--muted); font-size: 13px; }
.appui .delegate-or[hidden] { display: none; }
.appui .delegate-ai { width: 100%; }
.appui .delegate-status[hidden], .appui .delegate-person[hidden] { display: none; }
.appui .delegate-or > span { display: flex; align-items: center; gap: 10px; }
.appui .delegate-or > span::before, .appui .delegate-or > span::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.appui .delegate-people { display: flex; flex-wrap: wrap; gap: 6px; }
.appui .delegate-people[hidden] { display: none; }
.appui .delegate-spaces { display: grid; gap: 8px; margin-bottom: 16px; }
.appui .delegate-spaces[hidden], .appui .delegate-label[hidden] { display: none; }
.appui .delegate-label { margin: 0; color: var(--graphite); font-size: 12.5px; font-weight: 800; }
.appui .space-assign { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 8px; }
.appui .space-assign[hidden] { display: none; }
.appui .space-assign > span { color: var(--graphite); font-size: 12px; font-weight: 800; }
.appui .space-assign .space-chip[aria-pressed="true"] { border-color: var(--electric); background: var(--electric); color: #fff; }
.appui .delegate-badge[hidden] { display: none; }
.appui .spaces { margin: 18px 0; }
.appui .spaces[hidden] { display: none; }
.appui .spaces-start { display: flex; width: 100%; gap: 12px; align-items: center; padding: 14px 16px; border: 1px dashed rgba(61, 58, 140, .3); border-radius: 18px; background: var(--paper); color: var(--night); font: inherit; text-align: left; cursor: pointer; }
.appui .spaces-start[hidden] { display: none; }
.appui .spaces-new { display: flex; width: 100%; align-items: baseline; justify-content: center; gap: 6px; padding: 12px 14px; border: 1px dashed rgba(61, 58, 140, .35); border-radius: 16px; background: transparent; color: var(--electric); font: inherit; font-size: 14px; font-weight: 800; cursor: pointer; }
.appui .spaces-new small { color: var(--graphite); font-size: 12px; font-weight: 700; }
.appui .spaces-new[hidden] { display: none; }
.appui .spaces-start > span:first-child { font-size: 24px; }
.appui .spaces-start strong { display: block; font-size: 15px; }
.appui .spaces-start small { display: block; margin-top: 2px; color: var(--graphite); font-size: 12.5px; line-height: 1.4; }
.appui .space-card { margin-bottom: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 20px; background: var(--paper); box-shadow: 0 10px 26px rgba(21, 44, 78, .05); }
.appui .space-card__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.appui .space-card__head strong { display: block; color: var(--night); font-size: 16px; }
.appui .space-card__head small { color: var(--graphite); font-size: 12.5px; }
.appui .space-invite { flex: 0 0 auto; padding: 8px 12px; border-radius: 999px; background: #1f8f55; color: #fff; font-size: 13px; font-weight: 800; text-decoration: none; }
.appui .space-tasks { display: grid; gap: 6px; margin: 0 0 8px; padding: 0; list-style: none; }
.appui .space-task { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 14px; background: var(--ivory); }
.appui .space-task.is-done .space-task__title { color: var(--muted); text-decoration: line-through; }
.appui .space-check { flex: 0 0 30px; height: 30px; border: 2px solid var(--line); border-radius: 50%; background: var(--paper); color: transparent; font-weight: 900; cursor: pointer; }
.appui .space-check[aria-pressed="true"] { border-color: var(--mint-dark); background: var(--mint-dark); color: #fff; }
.appui .space-task__body { display: grid; flex: 1; min-width: 0; }
.appui .space-task__title { color: var(--night); font-size: 14px; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.appui .space-task__who { color: var(--electric); font-size: 11.5px; font-weight: 800; }
.appui .space-task__who[hidden] { display: none; }
.appui .space-chip { flex: 0 0 auto; padding: 5px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--paper); color: var(--night); font: inherit; font-size: 12px; font-weight: 800; cursor: pointer; }
.appui .space-chip--take { border-color: rgba(61, 58, 140, .3); color: var(--electric); }
.appui .space-remove { flex: 0 0 auto; width: 26px; height: 26px; border: 0; border-radius: 50%; background: transparent; color: var(--muted); font-size: 18px; cursor: pointer; }
.appui .space-empty { margin: 0 0 8px; color: var(--graphite); font-size: 13px; }
.appui .space-empty[hidden] { display: none; }
.appui .space-add { display: flex; gap: 8px; }
.appui .space-add .sheet-input { flex: 1; min-width: 0; margin: 0; }
.appui .space-add__button { flex: 0 0 auto; padding: 0 14px; border: 0; border-radius: 14px; background: var(--electric); color: #fff; font: inherit; font-weight: 800; cursor: pointer; }
.appui .space-leave { display: block; margin: 8px auto 0; font-size: 12px; color: var(--muted); }
.appui .space-sheet h2 { margin: 0; color: var(--night); font-size: 22px; }
.appui .space-sheet .delegate-people { margin-bottom: 10px; }
.appui .space-sheet .primary-button { width: 100%; }
.appui .time-group--spaces[hidden] { display: none; }
.appui .time-indicator--spaces { background: #1f8f55; }
.appui .task-card--space .task-card__body p { color: #1f8f55; font-weight: 700; }
.appui .task-list .task-card.task-card--space { min-height: 0; padding-bottom: 15px; grid-template-rows: auto; }
.appui button, .appui input, .appui select, .appui textarea { touch-action: manipulation; }
.appui .delegate-block-title { margin: 22px 0 6px; color: var(--ink); font-size: 17px; font-weight: 850; }
.appui .habit-week__dots { display: inline-flex; gap: 5px; }
.appui .habit-dot { display: block; width: 14px; height: 14px; border-radius: 50%; background: rgba(61, 58, 140, .1); }
.appui .habit-dot--done { background: #34a853; }
.appui .habit-dot--missed { background: rgba(180, 77, 68, .28); }
.appui .habit-dot--open { background: transparent; outline: 2px solid #a99cf0; outline-offset: -2px; }
.appui .habit-dot--rest { background: transparent; border: 2px dotted rgba(61, 58, 140, .3); }
.appui .habit-dot--none { background: transparent; opacity: .35; border: 1px solid rgba(61, 58, 140, .2); }
.appui .habit-cards { display: grid; gap: 10px; margin: 6px 0 12px; padding: 0; list-style: none; }
.appui .habit-card { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid rgba(61, 58, 140, .14); border-radius: 18px; background: var(--paper, #fff); }
.appui .habit-card.is-done { background: #eaf7ee; border-color: rgba(52, 168, 83, .3); }
.appui .habit-card.is-rest { opacity: .8; }
.appui .habit-check { position: relative; display: grid; flex: 0 0 auto; width: 46px; height: 46px; place-items: center; padding: 0; border: 2.5px solid #7b6fe0; border-radius: 50%; background: transparent; color: #fff; font: inherit; font-size: 18px; font-weight: 900; cursor: pointer; }
.appui .habit-check:disabled { cursor: default; border-color: rgba(61, 58, 140, .25); color: var(--muted); }
.appui .habit-card.is-done .habit-check { background: #34a853; border-color: #34a853; }
.appui .habit-card__body { min-width: 0; flex: 1; display: grid; gap: 6px; }
.appui .habit-card__name { padding: 0; border: 0; background: none; color: var(--night, #1c1a3d); font: inherit; font-size: 17px; font-weight: 850; text-align: left; cursor: pointer; }
.appui .habit-card__body small { color: var(--muted); font-size: 12.5px; }
.appui .habit-card__hint { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.appui .habits-view .spaces-new { display: grid; justify-items: center; gap: 2px; }
.appui .goal-cards { display: grid; gap: 10px; margin: 6px 0 12px; padding: 0; list-style: none; }
.appui .goal-card { display: grid; gap: 8px; padding: 14px; border: 1px solid rgba(61, 58, 140, .14); border-radius: 18px; background: linear-gradient(135deg, rgba(169, 156, 240, .12), rgba(255, 255, 255, 0)), var(--paper, #fff); }
.appui .goal-card.is-done { background: #fff8e1; border-color: rgba(214, 160, 20, .3); }
.appui .goal-card__head { display: grid; gap: 3px; padding: 0; border: 0; background: none; color: var(--night, #1c1a3d); font: inherit; text-align: left; cursor: pointer; }
.appui .goal-card__head strong { font-size: 17px; font-weight: 850; }
.appui .goal-card__head small, .appui .goal-card__count, .appui .goal-card__habits { color: var(--muted); font-size: 12.5px; line-height: 1.4; }
.appui .goal-card__bar { height: 9px; border-radius: 99px; background: rgba(61, 58, 140, .1); overflow: hidden; }
.appui .goal-card__bar i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #7b6fe0, #34a853); }
.appui .goal-card__next { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 12px; background: rgba(169, 156, 240, .14); font-size: 13.5px; }
.appui .goal-step-check { position: relative; display: grid; flex: 0 0 26px; width: 26px; height: 26px; place-items: center; padding: 0; border: 2px solid #7b6fe0; border-radius: 50%; background: transparent; color: #fff; font: inherit; font-size: 13px; font-weight: 900; cursor: pointer; }
.appui .goal-step-check[aria-pressed="true"] { background: #34a853; border-color: #34a853; }
.appui .habit-dot--off { background: rgba(61, 58, 140, .06); }
.appui .home-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 18px 0 14px; }
.appui .home-link { position: relative; display: grid; align-content: start; justify-items: start; gap: 2px; min-height: 108px; padding: 13px 12px 12px; border: 1px solid rgba(61, 58, 140, .14); border-radius: 20px; background: var(--paper); color: var(--night); font: inherit; text-align: left; cursor: pointer; box-shadow: var(--shadow-soft); transition: transform 160ms ease, box-shadow 160ms ease; }
.appui .home-link[hidden] { display: none; }
.appui .home-link:active { transform: scale(.98); }
.appui .home-link__icon { display: grid; width: 38px; height: 38px; margin-bottom: 8px; place-items: center; border-radius: 13px; font-size: 21px; }
.appui .home-link--agenda .home-link__icon { background: var(--sky-soft); }
.appui .home-link--habits .home-link__icon { background: var(--mint-soft); }
.appui .home-link--delegate .home-link__icon { background: var(--lavender-soft); }
.appui .home-link strong { font-size: 15px; font-weight: 850; line-height: 1.15; }
.appui .home-link small { display: block; color: var(--muted); font-size: 12px; line-height: 1.3; }
.appui .home-link::after { content: "\2192"; position: absolute; top: 12px; right: 12px; color: rgba(61, 58, 140, .45); font-size: 15px; }
.appui .agenda-view .page-heading { margin-bottom: 14px; }
.appui .agenda { padding: 14px 12px 12px; border: 1px solid rgba(61, 58, 140, .14); border-radius: 24px; background: var(--paper); box-shadow: var(--shadow-soft); }
.appui .agenda-month { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.appui .agenda-month h2 { margin: 0; font-size: 18px; font-weight: 850; }
.appui .agenda-nav { display: grid; width: 38px; height: 38px; place-items: center; border: 0; border-radius: 50%; background: var(--electric-soft); color: var(--electric); font: inherit; font-size: 22px; font-weight: 800; line-height: 1; cursor: pointer; }
.appui .agenda-nav:disabled { opacity: .35; cursor: default; }
.appui .agenda-weekdays, .appui .agenda-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.appui .agenda-weekdays { margin-bottom: 4px; color: var(--muted); font-size: 11px; font-weight: 800; text-align: center; }
.appui .agenda-cell { position: relative; display: grid; min-height: 50px; padding: 6px 0 4px; align-content: space-between; justify-items: center; border: 1.5px solid transparent; border-radius: 14px; background: transparent; color: var(--night); font: inherit; cursor: pointer; }
.appui .agenda-cell b { font-size: 15px; font-weight: 800; line-height: 1; }
.appui .agenda-cell.is-outside b { color: var(--muted); font-weight: 600; }
.appui .agenda-cell.is-past { cursor: default; }
.appui .agenda-cell.is-past b { color: rgba(123, 131, 127, .55); font-weight: 600; }
.appui .agenda-cell.level-1 { background: rgba(169, 156, 240, .16); }
.appui .agenda-cell.level-2 { background: rgba(169, 156, 240, .34); }
.appui .agenda-cell.level-3 { background: rgba(124, 108, 224, .52); }
.appui .agenda-cell.level-3 b { color: #fff; }
.appui .agenda-cell.is-today { border-color: var(--electric); }
.appui .agenda-cell.is-selected { background: var(--electric); border-color: var(--electric); box-shadow: 0 6px 16px rgba(61, 58, 140, .28); }
.appui .agenda-cell.is-selected b { color: #fff; }
.appui .agenda-cell:focus-visible { outline: 3px solid var(--lavender); outline-offset: 2px; }
.appui .agenda-dots { display: flex; height: 7px; align-items: center; justify-content: center; gap: 3px; }
.appui .agenda-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; }
.appui .agenda-dot--task { background: #7b6fe0; }
.appui .agenda-dot--busy { background: var(--sky); }
.appui .agenda-cell.level-3 .agenda-dot--task, .appui .agenda-cell.is-selected .agenda-dot--task { background: #fff; }
.appui .agenda-cell.is-selected .agenda-dot--busy, .appui .agenda-cell.level-3 .agenda-dot--busy { background: #bfe3fa; }
.appui .agenda-legend { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 10px 4px 0; color: var(--muted); font-size: 12px; }
.appui .agenda-legend[hidden], .appui .agenda-legend span[hidden] { display: none; }
.appui .agenda-legend span { display: inline-flex; align-items: center; gap: 6px; }
.appui .agenda-day { margin-top: 20px; }
.appui .agenda-day h2 { margin: 0 0 4px; font-size: 20px; font-weight: 850; }
.appui .agenda-day__summary { margin: 0 0 12px; color: var(--graphite); font-size: 14px; line-height: 1.45; }
.appui .agenda-day__warn { margin: 0 0 12px; padding: 10px 12px; border-radius: 14px; background: var(--sun-soft); color: var(--sun-deep); font-size: 13px; font-weight: 700; line-height: 1.45; }
.appui .agenda-day__warn[hidden] { display: none; }
.appui .agenda-day .task-list { margin: 0 0 12px; }
.appui .agenda-day .spaces-new { margin-top: 6px; }
.appui .home-links[hidden] { display: none; }
.appui .home-links[data-count="1"] { grid-template-columns: minmax(0, 1fr); }
.appui .home-links[data-count="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.appui .home-link.is-new { animation: homeLinkPulse 1.1s ease 3; border-color: var(--electric); }