/* Scoped public timer; account timing remains independent. */
#home .guest-hero {
  padding-top: 44px;
  padding-bottom: 54px;
}
#home .guest-hero h1 {
  font-size: clamp(42px, 4.8vw, 70px);
  margin: 18px 0;
}
#home .guest-hero .lead {
  font-size: 16px;
  line-height: 1.65;
}
#home .guest-hero .hero-cta {
  gap: 12px 22px;
  margin: 20px 0 16px;
}
#home .guest-hero .hero-cta .guest-signup-link {
  font-size: 12px;
  gap: 8px;
  line-height: 1.6;
}
#guestStudyTimer {
  margin-top: 24px;
  width: 100%;
  max-width: 440px;
  padding: 20px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: 0 12px 32px -25px #8b392c45;
  color: var(--ink);
}
#guestStudyTimer .guest-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}
#guestStudyTimer h2 {
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: -0.025em;
  font-weight: 750;
  margin: 0;
}
#guestStudyTimer .guest-free {
  color: var(--coral-ink);
  background: var(--coral-soft);
  padding: 5px 9px;
  border-radius: 99px;
  font-size: 10px;
  font-weight: 650;
  white-space: nowrap;
}
#guestStudyTimer .guest-modes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3px;
  padding: 4px;
  border-radius: 13px;
  background: var(--surface-2);
}
#guestStudyTimer .guest-modes button {
  min-height: 44px;
  padding: 6px 3px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: var(--muted);
  background: transparent;
  font: inherit;
  font-size: 12px;
  line-height: 1.35;
  font-weight: 650;
  cursor: pointer;
}
#guestStudyTimer .guest-modes button[aria-pressed="true"] {
  color: var(--pink-ink);
  background: var(--soft);
  border-color: color-mix(in srgb, var(--pink) 20%, transparent);
}
#guestStudyTimer .guest-modes button:hover {
  color: var(--ink);
}
#guestStudyTimer .guest-clock {
  display: block;
  text-align: center;
  font-size: clamp(52px, 6vw, 68px);
  line-height: 1.15;
  font-weight: 600;
  letter-spacing: -0.06em;
  font-variant-numeric: tabular-nums;
  margin: 20px 0 8px;
}
#guestStudyTimer .guest-status {
  margin: 0 0 16px;
  min-height: 20px;
  text-align: center;
  font-size: 12px;
  line-height: 1.6;
  color: var(--muted);
}
#guestStudyTimer .guest-controls {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}
#guestStudyTimer .btn {
  text-decoration: none;
  min-height: 44px;
  padding: 11px 14px;
  font-size: 13px;
  border-radius: 12px;
  gap: 8px;
}
#guestStudyTimer progress {
  display: block;
  appearance: none;
  border: 0;
  border-radius: 8px;
  overflow: hidden;
  width: 100%;
  height: 3px;
  margin: 18px 0 14px;
  background: var(--line);
}
#guestStudyTimer progress::-webkit-progress-bar {
  background: var(--line);
}
#guestStudyTimer progress::-webkit-progress-value {
  background: linear-gradient(
    90deg,
    var(--focusly-coral),
    var(--focusly-peach)
  );
}
#guestStudyTimer progress::-moz-progress-bar {
  background: linear-gradient(
    90deg,
    var(--focusly-coral),
    var(--focusly-peach)
  );
}
#guestStudyTimer .guest-note {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.6;
  margin: 0;
}
#guestStudyTimer .guest-switch-note {
  color: var(--muted);
  text-align: center;
  font-size: 10px;
  line-height: 1.5;
  margin: 10px 0 0;
}
#guestStudyTimer [hidden] {
  display: none !important;
}
#guestStudyTimer .guest-invitation {
  padding: 15px;
  background: var(--soft);
  border: 1px solid color-mix(in srgb, var(--pink) 22%, transparent);
  border-radius: 14px;
  margin-top: 16px;
}
#guestStudyTimer .guest-invitation p {
  font-size: 12px;
  line-height: 1.6;
  margin: 0 0 10px;
}
#guestStudyTimer .guest-invitation .btn {
  display: flex;
  font-size: 12px;
  line-height: 1.5;
}
#guestStudyTimer button:focus-visible,
#guestStudyTimer a:focus-visible {
  outline: 3px solid var(--pink);
  outline-offset: 3px;
}
@media (max-width: 1100px) {
  #home .guest-hero {
    padding-top: 44px;
    padding-bottom: 30px;
  }
  #guestStudyTimer {
    max-width: 440px;
  }
}
@media (max-width: 560px) {
  #home .guest-hero h1 {
    font-size: clamp(42px, 11.7vw, 58px);
  }
  #guestStudyTimer {
    padding: 17px;
    margin-top: 22px;
  }
  #guestStudyTimer .guest-heading {
    gap: 8px;
  }
  #guestStudyTimer .guest-free {
    font-size: 9px;
    padding: 5px 7px;
  }
}

/* A quiet, centered public hero. The product walkthrough starts below it. */
#home .circular-hero .guest-hero { display:flex; flex-direction:column; align-items:center; text-align:center; padding:52px 0 64px; min-height:0; }
#home .circular-hero h1 { max-width:800px; font-size:clamp(48px,6vw,80px); line-height:1.02; margin:10px 0 20px; }
#home .circular-hero .hero-tag { margin-bottom:8px; }
#home .circular-hero .lead { max-width:520px; font-size:16px; }
#home .circular-hero .hero-cta, #home .circular-hero .hero-benefits { justify-content:center; }
#guestStudyTimer { max-width:480px; padding:24px; margin-top:28px; background:linear-gradient(160deg,#fff,#fff9f6); border-color:#efdae4; box-shadow:0 18px 60px -35px #b83f8650; border-radius:28px; }
#guestStudyTimer .guest-dial { position:relative; width:min(100%,270px); aspect-ratio:1; margin:18px auto 12px; }
#guestStudyTimer .guest-ring { width:100%; height:100%; transform:rotate(-90deg); overflow:visible; }
#guestStudyTimer .guest-ring circle { fill:none; stroke-width:7; }
#guestStudyTimer .guest-ring-track { stroke:var(--soft); }
#guestStudyTimer [data-guest-ring] { stroke:url(#guestRingColor); stroke-linecap:round; stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset .28s linear; }
#guestStudyTimer .guest-dial-content { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; }
#guestStudyTimer .guest-clock { font-size:clamp(52px,9vw,70px); margin:0; line-height:1; letter-spacing:-.055em; }
#guestStudyTimer .guest-mode-label { font-size:12px; color:var(--pink-ink); font-weight:650; }
#guestStudyTimer .guest-dial-hint { font-size:11px; color:var(--muted); }
#guestStudyTimer .guest-settings { display:flex; align-items:center; justify-content:center; gap:10px; flex-wrap:wrap; }
#guestStudyTimer .guest-settings label { font-size:12px; text-align:left; line-height:1.5; }
#guestStudyTimer .guest-settings label span { display:block; color:var(--muted); font-size:10px; }
#guestStudyTimer .guest-settings input { width:68px; min-height:44px; text-align:center; border:1px solid var(--line); border-radius:12px; font:inherit; font-size:16px; padding:6px; }
#guestStudyTimer .guest-settings .btn { font-size:11px; background:var(--peach-soft); color:var(--peach-ink); }
#guestStudyTimer .guest-setting-status { font-size:11px; color:var(--muted); line-height:1.5; margin:8px 0; }
#guestStudyTimer .guest-setting-status:empty { display:none; }
#guestStudyTimer .guest-status { margin-top:14px; }
#guestStudyTimer progress { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
#guestStudyTimer .guest-note { margin-top:16px; }
#home .showcase-intro { grid-column:1; grid-row:1; padding:90px 0 70px; }
#home .showcase-intro h2 { font-size:clamp(34px,4vw,54px); line-height:1.1; letter-spacing:-.05em; margin:0 0 20px; }
#home .showcase-intro p { color:var(--muted); line-height:1.7; }
@media(max-width:560px) {
 #home .circular-hero .guest-hero { padding-top:32px; }
 #home .circular-hero h1 { font-size:clamp(44px,12vw,62px); }
 #guestStudyTimer { padding:18px; border-radius:22px; }
 #guestStudyTimer .guest-dial { width:230px; max-width:100%; }
 #home .showcase-intro { padding:32px 0; }
}
@media(prefers-reduced-motion:reduce) { #guestStudyTimer [data-guest-ring] { transition:none; } }

/* Brief feedback, only on interaction or completion. No looping animations. */
#guestStudyTimer button { transition:background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .15s ease; }
@media(hover:hover) {
 #guestStudyTimer button:not(:disabled):hover { transform:translateY(-1px); box-shadow:0 4px 12px -8px #b83f8680; }
}
#guestStudyTimer button:not(:disabled):active { transform:translateY(1px) scale(.985); box-shadow:none; }
#guestStudyTimer button:disabled { cursor:wait; }
#guestStudyTimer [data-guest-sound] svg { flex-shrink:0; }
#guestStudyTimer [data-guest-sound][aria-pressed=false] .guest-sound-audible,
#guestStudyTimer [data-guest-sound][aria-pressed=true] .guest-sound-muted { display:none; }
#guestStudyTimer[data-state=complete] .guest-dial { animation:guest-finish .55s ease-out both; }
#guestStudyTimer[data-state=complete] .guest-invitation { animation:guest-invite .22s ease-out both; }
#guestStudyTimer .guest-invitation .guest-future-note { margin:10px 0 0; color:var(--muted); font-size:11px; }
#guestStudyTimer input:focus-visible { outline:3px solid var(--pink); outline-offset:3px; }
@keyframes guest-finish { 0% { transform:scale(1); } 45% { transform:scale(1.018); } 100% { transform:scale(1); } }
@keyframes guest-invite { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }
@media(prefers-reduced-motion:reduce) {
 #guestStudyTimer button { transition:none; }
 #guestStudyTimer button:not(:disabled):hover, #guestStudyTimer button:not(:disabled):active { transform:none; }
 #guestStudyTimer[data-state=complete] .guest-dial, #guestStudyTimer[data-state=complete] .guest-invitation { animation:none; }
}
