/* ============================================================
 * Kakuro landing page. Static, no game engine loaded — the
 * variant is server-only (puzzles come from /daily/kakuro/ and
 * /library/kakuro/, both backed by pre-generated unique puzzles).
 * Minimal styles, no dependency on kakuro.css.
 * ============================================================ */

.kakuro-landing {
  max-width: 640px;
  margin:    0 auto;
  padding:   2rem 1rem;
}

.kakuro-landing-header {
  text-align:    center;
  margin-bottom: 1.5rem;
}

.kakuro-landing-header h1 {
  margin:    0;
  font-size: 1.75rem;
  color:     #1A1A1A;
}

.kakuro-landing-tagline {
  font-size: 1.1rem;
  color:     #666;
  margin:    0.5rem 0 0;
}

.kakuro-landing-description {
  margin-bottom: 2rem;
  line-height:   1.6;
  color:         #333;
}

.kakuro-landing-description p + p {
  margin-top: 1rem;
}

.kakuro-landing-actions {
  display:        flex;
  flex-direction: column;
  gap:            12px;
  margin-bottom:  1.5rem;
}

.kakuro-landing-btn {
  display:         block;
  text-align:      center;
  padding:         14px 24px;
  border-radius:   8px;
  font-size:       16px;
  font-weight:     500;
  text-decoration: none;
  transition:      background-color 0.15s ease, color 0.15s ease;
}

.kakuro-landing-btn--primary {
  background: #1D9E75;
  color:      #FFFFFF;
}
.kakuro-landing-btn--primary:hover {
  background: #0F6E56;
}

.kakuro-landing-btn--secondary {
  background: transparent;
  color:      #1D9E75;
  border:     2px solid #1D9E75;
}
.kakuro-landing-btn--secondary:hover {
  background: #EAF7EF;
}

.kakuro-landing-btn:focus-visible {
  outline:    none;
  box-shadow: 0 0 0 3px rgba(29, 158, 117, 0.45);
}

.kakuro-landing-signin-note {
  text-align:    center;
  font-size:     14px;
  color:         #666;
  margin-bottom: 1.5rem;
}

.kakuro-landing-signin-note a {
  color: #1D9E75;
}

.kakuro-landing-back {
  text-align: center;
  font-size:  14px;
}

.kakuro-landing-back a {
  color:           #666;
  text-decoration: none;
}
.kakuro-landing-back a:hover {
  color:           #1D9E75;
  text-decoration: underline;
}

@media (min-width: 480px) {
  .kakuro-landing-actions {
    flex-direction:  row;
    justify-content: center;
  }
  .kakuro-landing-btn {
    min-width: 220px;
  }
}