/* A shared control language for the app, account, signup and public examples. */
html body input[type="checkbox"]:not([role="switch"]){
  appearance:none;-webkit-appearance:none;display:inline-grid;place-content:center;
  flex:0 0 25px;width:25px;height:25px;min-width:25px;min-height:25px;margin:0;
  padding:0;vertical-align:middle;border:1.5px solid var(--muted,#756573);
  border-radius:9px 8px 10px 8px;background:var(--surface-2,#fff9f5);
  color:var(--action-ink,#fff);cursor:pointer;
  box-shadow:inset 0 -3px 0 #54334408;transition:background .16s,border-color .16s,box-shadow .16s;
}
html body input[type="checkbox"]:not([role="switch"])::before{
  content:"";width:7px;height:12px;border:solid currentColor;border-width:0 2.5px 2.5px 0;
  opacity:0;transform:translateY(-2px) rotate(45deg) scale(.65);
  transition:transform .16s,opacity .16s;
}
html body input[type="checkbox"]:checked{
  background:var(--action-bg,var(--berry,#a12f63));border-color:var(--action-bg,var(--berry,#a12f63));
  box-shadow:inset 0 2px 0 #ffffff28,inset 0 -3px 0 #25131b18,0 2px 5px #25131b0c;
}
html body input[type="checkbox"]:checked::before{opacity:1;transform:translateY(-2px) rotate(45deg) scale(1)}
html body input[type="checkbox"]:indeterminate{background:var(--action-bg,var(--berry,#a12f63));border-color:var(--action-bg,var(--berry,#a12f63))}
html body input[type="checkbox"]:indeterminate::before{opacity:1;width:11px;height:0;border:0;border-bottom:2.5px solid currentColor;transform:none}
html body input[type="checkbox"]:focus-visible{outline:3px solid var(--accent-strong,var(--berry,#a12f63));outline-offset:4px}
html body input[type="checkbox"]:disabled{opacity:.5;cursor:not-allowed}
body :is(.check-label,.login-box .inline,.assignee-choice,.mix-whole){min-height:46px;gap:12px}
body .login-box .inline{display:flex;align-items:flex-start;line-height:1.65;padding-block:8px;font-size:13px}
body .login-box .inline input{margin-top:2px}
body .login-box .inline>span{min-width:0}
body .check-label{padding:12px;border-radius:16px;border:1px solid var(--border,#dfd6dc);background:var(--surface-2,#fff9f6)}
body .check-label:has(:checked),body .assignee-choice:has(:checked){border-color:var(--accent-strong,#9b3156);background:var(--soft,#f9edf2)}
body .subtask-row{min-height:46px;align-items:center}
body .subtask-row:has(:checked) input[type=text]{color:var(--muted);text-decoration:line-through}
body .calm-shell .task-card .task-check,body .calm-shell .plan-item .task-check,
body .task-check,body .life-row .life-check{
  position:relative;display:grid;place-items:center;flex-shrink:0;
  width:44px;height:44px;min-width:44px;min-height:44px;padding:0;margin:0;
  border:1.5px solid var(--muted,#756573);border-radius:16px 14px 18px 14px;
  color:var(--muted,#756573);background:var(--surface-2,#fff9f6);
  box-shadow:inset 0 -3px 0 #54334408;transition:background .16s,border-color .16s,transform .16s;
}
body .task-check .ui-icon,body .life-check .ui-icon{width:23px;height:23px;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
body .task-check:not(.checked) .ui-icon{opacity:.3;transform:scale(.8)}
body .calm-shell .task-card .task-check.checked,body .calm-shell .plan-item .task-check.checked,
body .task-check.checked,body .life-row.is-done .life-check{
  background:var(--action-bg,#a12f63);border-color:var(--action-bg,#a12f63);color:var(--action-ink,#fff);
  box-shadow:inset 0 2px 0 #ffffff28,inset 0 -3px 0 #25131b18,0 3px 8px #25131b10;
}
body .task-check.checked::after,body .life-row.is-done .life-check::after{
  content:"✦";position:absolute;top:-7px;right:-5px;font-size:15px;line-height:1;
  color:#a06b18;background:var(--surface,#fff9f2);padding:2px;border-radius:50%;pointer-events:none;
}
body .task-check[aria-busy=true],body .life-check[aria-busy=true]{opacity:.65;cursor:wait}
body .task-check:focus-visible,body .life-check:focus-visible{outline:3px solid var(--accent-strong,#9b3156);outline-offset:4px}
body .task-check:disabled:not([aria-busy=true]){opacity:.5;cursor:not-allowed}
body .life-row.is-done{opacity:1}
body .life-row.is-done .life-row-main{color:var(--muted)}
.nexo-landing .lp-checklist .lp-icon,.nexo-landing .lp-hero-task>.lp-icon,.login-story .check-circle{
  background:#e7eedb;color:#44663a;border-radius:8px 7px 10px 7px;
  padding:3px;width:24px;height:24px;stroke-width:2.3;box-shadow:inset 0 -2px 0 #456e3910;
}
.nexo-landing .lp-demo-tasks label:has(:checked){background:#eef2e5;border-color:#a6b797}
.nexo-landing .lp-demo-tasks label{min-height:63px;transition:background .16s}
.nexo-landing .lp-demo-tasks input:checked+span{color:#4d6545}
.relationship-choice{border:0;padding:0;margin:22px 0;min-width:0}
.relationship-choice legend{font-size:14px;font-weight:650;padding:0;margin-bottom:10px;color:var(--ink)}
.relationship-options{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.login-box .relationship-option{display:flex;align-items:center;gap:10px;position:relative;min-height:82px;margin:0;padding:12px;
  border:1.5px solid var(--border);background:var(--surface-2);border-radius:18px;cursor:pointer}
.login-box .relationship-option input{position:absolute;opacity:0;width:1px;height:1px;min-height:0;margin:0;padding:0}
.relationship-option:has(:checked){border-color:var(--accent-strong);background:var(--soft)}
.relationship-option:has(:focus-visible){outline:3px solid var(--accent-strong);outline-offset:3px}
.relationship-symbol{display:grid;place-items:center;flex-shrink:0;width:33px;height:36px;border-radius:12px;background:var(--soft);color:var(--accent-strong)}
.relationship-symbol svg{width:23px;height:23px}
.relationship-option:has(:checked) .relationship-symbol{background:var(--action-bg);color:var(--action-ink)}
.relationship-option strong,.relationship-option small{display:block;font-size:12px;line-height:1.5}
.relationship-option small{font-size:12px;color:var(--muted);font-weight:400;margin-top:3px}
.relationship-choice>p{font-size:12px;line-height:1.6;color:var(--muted);margin:12px 0 0}
.account-page .connection-heading{display:flex;gap:14px;align-items:center;margin-bottom:12px}
.connection-heading h2{margin:0;font-size:21px}.connection-heading .relationship-symbol{width:46px;height:50px;border-radius:17px}
.connection-badge{display:inline-block;font-size:11px;border:1px solid var(--border);border-radius:99px;background:var(--soft);padding:4px 10px;margin-bottom:10px}
.connection-card .link-setup{border-top:1px solid var(--border);margin-top:20px;padding-top:10px}
.connection-card .link-setup>summary{display:flex;align-items:center;gap:10px;padding:10px 0;list-style:none;min-height:48px}
.link-setup>summary::-webkit-details-marker{display:none}.link-setup>summary::after{content:"+";margin-left:auto;font-size:24px;font-weight:400}
.link-setup[open]>summary::after{content:"−"}
.connection-card .link-paths{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:12px}
.connection-card .link-path{padding:18px;border:1px solid var(--border);border-radius:18px;background:var(--surface-2);min-width:0}
.link-path h3{font-size:16px;margin:0 0 8px}.link-path>p{font-size:12px}
.connection-card .link-path label{font-size:12px}.connection-card .link-path button{width:100%;font-size:13px}
.connection-card .invite-code-panel{margin-top:15px;padding-top:5px}
.connection-card #invite-code{font-size:14px;letter-spacing:1px;font-family:ui-monospace,monospace;background:var(--surface);padding:12px;margin:0}
.connection-card .invite-code-panel[hidden]{display:none}
.connection-card .link-note{padding:12px;border-radius:12px;background:var(--soft);font-size:12px;margin-bottom:0}
.login-panel{--muted:#6d5262}
.login-story :is(p,small,.eyebrow){color:#6d4c5d}
.completion-reward .reward-copy :is(p,small){color:var(--muted)}
.completion-reward .reward-actions button{background:var(--surface);color:var(--ink);border-color:var(--border)}
.completion-reward .reward-actions button:last-child{background:var(--action-bg);color:var(--action-ink);border-color:var(--action-bg)}
@media(hover:hover){
  html body input[type=checkbox]:not(:disabled):hover{border-color:var(--accent-strong,var(--berry,#9b3156));box-shadow:0 0 0 4px var(--soft,#f7e6ed)}
  body .task-check:not(:disabled):hover,body .life-check:not(:disabled):hover{transform:translateY(-1px);border-color:var(--accent-strong)}
  body .task-check:not(.checked):hover .ui-icon{opacity:.65}
  .relationship-option:hover{border-color:var(--accent-strong)}
}
@media(max-width:600px){.connection-card .link-paths{grid-template-columns:1fr}.login-box .relationship-option{padding:10px;gap:8px}.connection-heading h2{font-size:19px}}
@media(prefers-reduced-motion:reduce){html body input[type=checkbox],html body input[type=checkbox]::before,body .task-check,body .life-check,.nexo-landing .lp-demo-tasks label{transition:none!important}body .task-check,body .life-check{transform:none!important}}
@media(forced-colors:active){
  html body input[type=checkbox]:not([role=switch]){appearance:auto;-webkit-appearance:auto;box-shadow:none}
  html body input[type=checkbox]::before{display:none}
  body .task-check,body .life-check{border:2px solid ButtonText}
  body .task-check.checked,body .life-row.is-done .life-check{background:Highlight;color:HighlightText}
  .relationship-option:has(:checked){border:3px solid Highlight}
}
/* Membership choices use native radios and retain the profile's own palette. */
.membership-selector{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;border:0;padding:0;margin:24px 0 16px;min-width:0}
.membership-selector legend{font-weight:700;margin-bottom:12px}
.account-card .membership-selector label{display:flex;flex-direction:row;align-items:center;gap:10px;padding:16px;border:1px solid var(--border);border-radius:18px;cursor:pointer;min-width:0;margin:0}
.account-card .membership-selector label:has(input:checked){border-color:var(--action-bg);background:color-mix(in srgb,var(--action-bg) 7%,var(--surface))}
.account-card .membership-selector label:has(input:disabled){opacity:.55;cursor:not-allowed}
.account-card .membership-selector input[type=radio]{width:22px;height:22px;min-height:22px;flex:none;accent-color:var(--action-bg);padding:0;margin:0}
.membership-selector span{display:grid;gap:5px}
.membership-selector small{font-size:12px}
.membership-card .price-grid button{min-width:0;white-space:normal;padding:20px;text-align:left;border-radius:20px;line-height:1.5}
.membership-card .price-grid button b{font-size:22px}
.membership-card .price-grid button[data-plan=yearly]{border-color:var(--action-bg);background:color-mix(in srgb,var(--action-bg) 7%,var(--surface))}
.membership-change{margin:22px 0;padding:16px;border:1px solid var(--border);border-radius:18px}
.membership-change summary{font-weight:700;cursor:pointer}
.lp-annual-option{display:grid;gap:6px;border-radius:18px;padding:18px;background:#f5eee7;margin:16px 0 24px;color:#473a3c}
.lp-annual-option b{font-size:24px}
.lp-annual-option span{font-size:14px;line-height:1.5}
@media(max-width:440px){.membership-selector{grid-template-columns:1fr}.membership-card .price-grid{grid-template-columns:1fr}}