.tange-loyalty-register,
.tange-loyalty-card {
	max-width: 420px;
	margin: 1.5rem auto;
	padding: 1.4rem 1.6rem;
	background: var(--wp--preset--color--surface, #17130d);
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: 14px;
	color: #e9e4da;
}
.tange-loyalty-register h3,
.tange-loyalty-card h3 { margin: 0 0 .8rem; color: #fff; font-size: 1.1rem; }
.tange-loyalty-register p,
.tange-loyalty-card p { margin: 0 0 .9rem; }
.tange-loyalty-register label,
.tange-loyalty-card label { display: block; margin-bottom: .3rem; font-size: .85rem; color: #a79f90; }
.tange-loyalty-register input[type="text"],
.tange-loyalty-register input[type="email"],
.tange-loyalty-register input[type="password"],
.tange-loyalty-card input[type="text"],
.tange-loyalty-card input[type="email"],
.tange-loyalty-card input[type="password"] {
	width: 100%; padding: .65rem .8rem; border-radius: 8px; border: 1px solid rgba(255, 255, 255, .15);
	background: rgba(255, 255, 255, .05); color: #fff; font: inherit; font-size: .95rem;
}
.tange-loyalty-card .button {
	background: var(--wp--preset--color--accent, #d4af6a); color: #14110a; border: none;
	padding: .6rem 1.3rem; border-radius: 999px; font-weight: 700; cursor: pointer;
}
.tange-loyalty-error { color: #ff8080; }
.tange-loyalty-success { color: #8fd99f; max-width: 420px; margin: 0 auto 1rem; text-align: center; }
.tange-loyalty-hint { color: #a79f90; font-size: .85rem; }

.tange-loyalty-card__tier-progress { text-align: center; font-size: .8rem; color: #a79f90; margin: -.5rem 0 .8rem; }
.tange-loyalty-card__tier-progress strong { color: var(--wp--preset--color--accent, #d4af6a); }
.tange-loyalty-referral__link input { cursor: pointer; }
.tange-loyalty-history__table { width: 100%; border-collapse: collapse; font-size: .85rem; }
.tange-loyalty-history__table td { padding: .4rem 0; border-bottom: 1px solid rgba(255, 255, 255, .08); color: #cfc8ba; }
.tange-loyalty-history__delta { text-align: right; font-weight: 700; }
.tange-loyalty-history__delta.is-plus { color: #8fd99f; }
.tange-loyalty-history__delta.is-minus { color: #ff9a8f; }

.tange-loyalty-card__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; }
.tange-loyalty-card__label { margin: 0; font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: #a79f90; }
.tange-loyalty-card__number { margin: .15rem 0 0; font-size: 1.3rem; font-weight: 700; color: #fff; }
.tange-loyalty-card__points { text-align: right; }
.tange-loyalty-card__points span { display: block; font-size: 1.8rem; font-weight: 700; color: var(--wp--preset--color--accent, #d4af6a); line-height: 1; }
.tange-loyalty-card__points small { color: #a79f90; font-size: .75rem; }
.tange-loyalty-card__qr {
	display: flex; align-items: center; justify-content: center;
	background: #fff; border-radius: 10px; padding: 12px; margin: 1rem 0 .6rem; min-height: 180px;
}
.tange-loyalty-card__qr svg { width: 100%; height: auto; max-width: 220px; }
.tange-loyalty-card__countdown { text-align: center; font-size: .8rem; color: #a79f90; }
.tange-loyalty-card__hint { text-align: center; font-size: .78rem; color: #a79f90; }
.tange-loyalty-card__logout { text-align: center; margin: 0; }
.tange-loyalty-card__logout a { color: var(--wp--preset--color--accent, #d4af6a); }

/* Scanner (Backend) */
.tange-loyalty-scanner { max-width: 480px; }
.tange-loyalty-scanner__video-wrap { position: relative; background: #000; border-radius: 8px; overflow: hidden; }
.tange-loyalty-scanner__video-wrap video { width: 100%; display: block; }
.tange-loyalty-scanner__controls { display: flex; flex-direction: column; gap: .5rem; margin: 12px 0; }
.tange-loyalty-scanner__result {
	padding: 14px 16px; border-radius: 8px; font-size: 1rem; font-weight: 600;
	background: #f0f0f1; min-height: 1.4em;
}
.tange-loyalty-scanner__result.is-ok { background: #d4f4dd; color: #1a5c33; }
.tange-loyalty-scanner__result.is-error { background: #fbe1e1; color: #8a1f1f; }