body { font-family: 'Roboto', sans-serif; background-color: #0f172a; color: #0f172a; overflow-x: hidden; }
.font-phudu { font-family: 'Phudu', sans-serif; }
html { scroll-behavior: smooth; }
.custom-radio { appearance: none; width: 1.25rem; height: 1.25rem; border: 2px solid #cbd5e1; border-radius: 4px; outline: none; cursor: pointer; position: relative; background-color: white; transition: all 0.2s; margin-top: 2px; flex-shrink: 0; }
.custom-radio:checked { background-color: #16a34a; border-color: #16a34a; }
.custom-radio:checked::after { content: ''; position: absolute; left: 6px; top: 2px; width: 5px; height: 10px; border: solid white; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.radio-label { cursor: pointer; transition: color 0.2s; }
.radio-label:hover { color: #16a34a; }
.scale-btn { background-color: var(--base-bg, #f1f5f9); color: var(--base-color, #475569); transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1); border: 1px solid rgba(0,0,0,0.05); }
.scale-btn:hover { transform: translateY(-2px) scale(1.05); filter: brightness(0.95); }
.scale-btn.active { background-color: var(--active-bg, #22c55e); color: white; transform: scale(1.4) translateY(-2px); box-shadow: 0 12px 24px -6px var(--active-bg), 0 0 0 3px white; border-color: transparent !important; font-weight: 700; z-index: 20; }
.hero-bg { background-color: #0f172a; background-image: radial-gradient(circle at center, #1e293b 0%, #0f172a 100%); }
@keyframes spin { to { transform: rotate(360deg); } }
.animate-spin-fast { animation: spin 0.8s linear infinite; }
.logic-reveal { max-height: 0; overflow: hidden; opacity: 0; margin-top: 0; transition: max-height 0.4s ease, opacity 0.4s ease, margin 0.4s ease; }
.logic-reveal.show { max-height: 500px; opacity: 1; margin-top: 0.5rem; }
.locked-input { pointer-events: none; opacity: 0.8; filter: grayscale(20%); }
.animate-fade-in-up { animation: fadeInUp 0.5s ease-out forwards; }
@keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
.pb-safe { padding-bottom: env(safe-area-inset-bottom, 16px); }