body {font-family: 'Noto Sans KR', sans-serif;
        }
        /* Custom styles for better UI */
        .card {
            background-color: white;
            border-radius: 0.75rem;
            box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
            transition: all 0.3s ease-in-out;
        }
        .btn {
            display: inline-block;
            font-weight: 600;
            text-align: center;
            vertical-align: middle;
            user-select: none;
            border: 1px solid transparent;
            padding: 0.75rem 1.5rem;
            font-size: 1rem;
            line-height: 1.5;
            border-radius: 0.5rem;
            transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
        }
        .btn-primary {
            color: #fff;
            background-color: #3b82f6;
            border-color: #3b82f6;
        }
        .btn-primary:hover {
            background-color: #2563eb;
            border-color: #1d4ed8;
        }
        .btn-secondary {
            color: #374151;
            background-color: #e5e7eb;
            border-color: #e5e7eb;
        }
         .btn-secondary:hover {
            background-color: #d1d5db;
        }
        .radio-label {
            display: block;
            position: relative;
            padding-left: 35px;
            margin-bottom: 12px;
            cursor: pointer;
            font-size: 1rem;
            user-select: none;
        }
        .radio-label input {
            position: absolute;
            opacity: 0;
            cursor: pointer;
        }
        .checkmark {
            position: absolute;
            top: 0;
            left: 0;
            height: 25px;
            width: 25px;
            background-color: #eee;
            border-radius: 50%;
            transition: background-color 0.2s;
        }
        .radio-label:hover input ~ .checkmark {
            background-color: #ccc;
        }
        .radio-label input:checked ~ .checkmark {
            background-color: #3b82f6;
        }
        .checkmark:after {
            content: "";
            position: absolute;
            display: none;
        }
        .radio-label input:checked ~ .checkmark:after {
            display: block;
        }
        .radio-label .checkmark:after {
            top: 9px;
            left: 9px;
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: white;
        }
        /* Style for result breakdown progress bar */
        .progress-bg {
            background-color: #e5e7eb;
            border-radius: 0.5rem;
            overflow: hidden;
        }
        .progress-fill {
            background-color: #3b82f6;
            height: 1.5rem;
            text-align: right;
            padding-right: 0.5rem;
            line-height: 1.5rem;
            color: white;
            font-weight: 600;
            white-space: nowrap;
            transition: width 1s ease-in-out;
        }
        /* Style for live fitness bar */
        .live-progress-fill {
            background-color: #60a5fa; /* Lighter blue */
            height: 0.75rem;
            transition: width 0.5s ease-in-out;
        }