body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
            background-color: #f4f4f9;
            margin: 0;
            height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
            overflow: hidden;
        }

        /* --- FORM STYLES --- */
        .form-container {
            background: white;
            padding: 2rem;
            border-radius: 12px;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            width: 90%;
            max-width: 400px;
            position: relative;
            z-index: 10;
            transition: opacity 0.5s ease;
        }

        h2 { margin-top: 0; margin-bottom: 1.5rem; text-align: center; color: #333; }
        .form-group { margin-bottom: 1.25rem; }
        label { display: block; margin-bottom: 0.5rem; font-weight: 500; color: #555; }

        .checkbox-group { display: flex; gap: 1.5rem; margin-bottom: 1.5rem; }
        .checkbox-item { display: flex; align-items: center; cursor: pointer; color: #555;}
        .checkbox-item input { margin-right: 0.5rem; width: 16px; height: 16px; accent-color: #4a90e2; }

        input[type="number"] {
            width: 100%; padding: 0.75rem; border: 1px solid #ddd;
            border-radius: 6px; font-size: 1rem; box-sizing: border-box;
        }
        input[type="number"]:focus { border-color: #4a90e2; outline: none; }

        button {
            width: 100%; padding: 0.85rem; background-color: #4a90e2;
            color: white; border: none; border-radius: 6px;
            font-size: 1rem; font-weight: bold; cursor: pointer;
            position: relative; z-index: 20;
        }
        button:hover { background-color: #357abd; }

        /* --- EXPANSION LAYER --- */
        #blue-overlay {
            position: fixed;
            background-color: #4a90e2;
            border-radius: 50%;
            transform: translate(-50%, -50%) scale(0);
            transition: transform 0.8s cubic-bezier(0.6, 0.05, 0.01, 0.99);
            z-index: 5; /* Behind form initially, but becomes background */
            pointer-events: none;
        }

        /* --- TIMER VIEW STYLES --- */
        #timer-view {
            position: fixed;
            top: 0; left: 0;
            width: 100%; height: 100%;
            display: none; /* Hidden initially */
            flex-direction: column;
            justify-content: center;
            align-items: center;
            color: white;
            z-index: 20;
            opacity: 0;
            transition: opacity 0.5s ease;
        }

        .status-label { font-size: 10rem; font-weight: 300; text-transform: uppercase; letter-spacing: 2px; opacity: 0.9; margin-bottom: 1rem; text-align: center;}
        .time-display { font-size: 7rem; font-weight: 700; line-height: 1; margin-bottom: 2rem; font-variant-numeric: tabular-nums; }
        .sets-display { font-size: 1.2rem; opacity: 0.8; margin-bottom: 3rem; }
        
        .timer-btn {
            background: white; color: #4a90e2;
            width: auto; padding: 10px 30px;
            margin-top: 20px;
        }
        .timer-btn:hover { background: #f0f0f0; }

        /* --- ANIMATION CLASSES --- */
        body.animating #blue-overlay { transform: translate(-50%, -50%) scale(1); }
        body.animating .form-container { opacity: 0; pointer-events: none; }
        body.timer-active #timer-view { opacity: 1; }
        
        /* REST MODE COLOR CHANGE */
        body.rest-mode #blue-overlay { background-color: #50c878; } /* Green for rest */
        body.rest-mode button { background-color: #50c878; } /* Match button for consistency */