.hhb-auth-shell, .hhb-account-shell, .hhb-pricing-shell { font-family: Poppins, ui-sans-serif, system-ui, sans-serif; color: var(--hhb-ink); }
.hhb-auth-shell { display: grid; place-items: center; min-height: calc(100vh - 340px); padding: 62px 18px; background: radial-gradient(circle at 50% 10%, color-mix(in srgb, var(--hhb-green) 14%, transparent), transparent 34%); }
.hhb-auth-card { width: min(100%, 480px); padding: 36px; background: var(--hhb-paper); border: 1px solid var(--hhb-line); border-radius: 22px; box-shadow: var(--hhb-shadow); }.hhb-auth-compact { text-align: center; }.hhb-auth-kicker { color: var(--hhb-green); font: 800 10px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: .15em; }.hhb-auth-heading h1, .hhb-auth-compact h1 { margin: 10px 0 7px; color: var(--hhb-ink); font-size: 31px; letter-spacing: -.055em; }.hhb-auth-heading p, .hhb-auth-compact p { margin: 0 0 23px; color: var(--hhb-muted); font-size: 14px; line-height: 1.65; }
.hhb-social-buttons { display: grid; gap: 10px; }.hhb-social-button { min-height: 46px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--hhb-line); border-radius: 11px; background: var(--hhb-paper); color: var(--hhb-ink); text-decoration: none; font-size: 13px; font-weight: 700; }.hhb-social-button:not(.is-disabled):hover { border-color: var(--hhb-green); color: var(--hhb-green); }.hhb-social-button > span:first-child { display: inline-grid; place-items: center; width: 21px; height: 21px; font-size: 17px; font-weight: 900; }.hhb-social-button.is-facebook > span:first-child { color: #1877f2; }.hhb-social-button.is-google > span:first-child { color: #ea4335; }.hhb-social-button.is-disabled { cursor: not-allowed; opacity: .45; }.hhb-or { display: flex; align-items: center; gap: 10px; margin: 23px 0; color: var(--hhb-muted); font-size: 11px; }.hhb-or::before, .hhb-or::after { content: ""; flex: 1; height: 1px; background: var(--hhb-line); }.hhb-or span { white-space: nowrap; }
.hhb-auth-form { display: grid; gap: 14px; }.hhb-auth-form label { display: grid; gap: 6px; color: var(--hhb-ink); font-size: 12px; font-weight: 700; }.hhb-auth-form input { width: 100%; min-height: 45px; padding: 10px 12px; border: 1px solid var(--hhb-line); outline: none; border-radius: 10px; background: transparent; color: var(--hhb-ink); font: 14px Poppins, sans-serif; }.hhb-auth-form input:focus { border-color: var(--hhb-green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--hhb-green) 15%, transparent); }.hhb-auth-form button, .hhb-primary-link { min-height: 47px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 10px; background: var(--hhb-green); color: #fff; text-decoration: none; cursor: pointer; font: 800 13px Poppins, sans-serif; }.hhb-auth-form button:hover, .hhb-primary-link:hover { background: var(--hhb-green-deep); }.hhb-auth-switch { margin: 21px 0 0; color: var(--hhb-muted); text-align: center; font-size: 13px; }.hhb-auth-switch a { color: var(--hhb-green); font-weight: 800; }.hhb-trap { position: absolute !important; left: -9999px !important; opacity: 0 !important; }.hhb-auth-notice { margin: 0 0 17px; padding: 11px 12px; border-radius: 9px; font-size: 12px; line-height: 1.5; }.hhb-auth-notice.is-success { color: #086143; background: #e2f8ed; }.hhb-auth-notice.is-error { color: #9d2b30; background: #ffeded; } html[data-theme="dark"] .hhb-auth-notice.is-success { color: #aaf1cd; background: #133b2a; } html[data-theme="dark"] .hhb-auth-notice.is-error { color: #ffc5c7; background: #411f22; }
.hhb-account-shell { display: grid; place-items: center; padding: 76px 18px; }.hhb-account-card { width: min(100%, 570px); padding: 40px; background: var(--hhb-paper); border: 1px solid var(--hhb-line); border-radius: 22px; box-shadow: var(--hhb-shadow); }.hhb-account-card h1 { margin: 10px 0 3px; font-size: 34px; letter-spacing: -.055em; }.hhb-account-email { margin: 0; color: var(--hhb-muted); font-size: 14px; }.hhb-plan-badge { display: flex; justify-content: space-between; align-items: center; margin: 28px 0 19px; padding: 15px 17px; border-radius: 12px; background: var(--hhb-mint); }.hhb-plan-badge span { color: var(--hhb-muted); font-size: 13px; }.hhb-plan-badge strong { color: var(--hhb-green-deep); font-size: 14px; }.hhb-account-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }.hhb-secondary-link { min-height: 47px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--hhb-line); border-radius: 10px; color: var(--hhb-ink); text-decoration: none; font-size: 13px; font-weight: 800; }.hhb-secondary-link:hover { border-color: var(--hhb-green); color: var(--hhb-green); }.hhb-signout-link { display: block; margin-top: 21px; text-align: center; color: var(--hhb-muted); font-size: 12px; }
.hhb-pricing-shell { max-width: 1180px; margin: 0 auto; padding: 66px 20px 80px; }.hhb-pricing-heading { max-width: 640px; margin: 0 auto 34px; text-align: center; }.hhb-pricing-heading h1 { margin: 10px 0; font-size: clamp(32px, 4vw, 47px); letter-spacing: -.06em; }.hhb-pricing-heading p { margin: 0; color: var(--hhb-muted); font-size: 14px; line-height: 1.65; }.hhb-price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; align-items: stretch; }.hhb-price-card { position: relative; display: flex; flex-direction: column; padding: 28px; border: 1px solid var(--hhb-line); border-radius: 18px; background: var(--hhb-paper); }.hhb-price-card.is-featured { border: 2px solid var(--hhb-green); box-shadow: 0 18px 35px rgba(14, 138, 101, .13); }.hhb-price-card.is-current { box-shadow: inset 0 0 0 2px var(--hhb-green); }.hhb-popular { position: absolute; top: -11px; left: 21px; padding: 5px 8px; border-radius: 99px; color: #fff; background: var(--hhb-green); font-size: 9px; font-weight: 900; letter-spacing: .08em; }.hhb-price-card h2 { margin: 0 0 8px; font-size: 22px; }.hhb-price-description { min-height: 45px; margin: 0; color: var(--hhb-muted); font-size: 13px; line-height: 1.55; }.hhb-price { margin: 24px 0; color: var(--hhb-ink); font-size: 46px; line-height: 1; font-weight: 850; letter-spacing: -.07em; }.hhb-price sup { font-size: 21px; vertical-align: top; line-height: 1.4; }.hhb-price span { color: var(--hhb-muted); font-size: 12px; font-weight: 600; letter-spacing: 0; }.hhb-plan-cta { min-height: 47px; display: inline-flex; justify-content: center; align-items: center; border: 1px solid var(--hhb-green); border-radius: 10px; background: var(--hhb-green); color: #fff; text-decoration: none; font-size: 13px; font-weight: 800; }.hhb-price-card:not(.is-featured) .hhb-plan-cta { color: var(--hhb-green); background: transparent; }.hhb-price-card ul { padding: 0; margin: 25px 0 0; list-style: none; }.hhb-price-card li { padding: 9px 0; border-top: 1px solid var(--hhb-line); color: var(--hhb-muted); font-size: 12px; line-height: 1.45; }.hhb-price-card li::before { content: "✓"; margin-right: 7px; color: var(--hhb-green); font-weight: 900; }.hhb-price-card li strong { color: var(--hhb-ink); }.hhb-pricing-note { max-width: 780px; margin: 25px auto 0; color: var(--hhb-muted); font-size: 11px; line-height: 1.6; text-align: center; }
@media (max-width: 780px) { .hhb-auth-card, .hhb-account-card { padding: 27px 22px; }.hhb-pricing-shell { padding: 45px 14px 55px; }.hhb-price-grid { grid-template-columns: 1fr; max-width: 440px; margin: 0 auto; }.hhb-account-actions { grid-template-columns: 1fr; } }