html,body{margin:0;padding:0;width:100vw;height:100vh;background:#000;overflow:hidden;font-family:Arial Black,Arial,sans-serif;color:#fff;-webkit-user-select:none;user-select:none}#video{display:block;position:absolute;top:0;left:0;width:100vw;height:100vh;object-fit:cover;z-index:0}#output{position:absolute;top:0;left:0;width:100vw;height:100vh;background:transparent;object-fit:cover;transform:scaleX(-1);z-index:1;pointer-events:none}#screenDimOverlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;z-index:2;pointer-events:none;display:none}#ui-overlay{position:absolute;top:0;left:0;width:100vw;height:100vh;padding:clamp(15px,3vh,25px);box-sizing:border-box;pointer-events:none;text-shadow:0 2px 5px rgba(0,0,0,.8);z-index:5;display:grid;grid-template-columns:1fr auto 1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"top-left top-center top-right" "middle-left middle-center middle-right" "bottom-left bottom-center bottom-right"}#ui-overlay button,#ui-overlay .clickable,#ui-overlay a,#ui-overlay select,#ui-overlay input{pointer-events:auto}#top-left-area{grid-area:top-left}#top-center-area{grid-area:top-center;text-align:center}#top-right-area{grid-area:top-right;display:flex;justify-content:flex-end;align-items:flex-start}#logo{width:clamp(200px,25vw,260px);margin-bottom:20px}#loginBtn,#profileBtn{background:#282828b3;border:1px solid rgba(255,255,255,.2);border-radius:50%;width:clamp(45px,8vw,55px);height:clamp(45px,8vw,55px);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}#loginBtn:hover,#profileBtn:hover{background:#3c3c3ce6;transform:scale(1.05)}#loginBtn svg,#profileBtn img{width:60%;height:60%}#profileBtn img{border-radius:50%;object-fit:cover}#middle-center-area{grid-area:middle-center;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:10vh}#seriesCounterContainer{text-align:center}#seriesCounterDisplay{font-size:clamp(80px,20vw,120px);font-weight:900;line-height:1;display:flex;align-items:baseline}#currentRepDisplay{color:#fff}#targetRepsDisplay{font-size:.5em;color:#fff9;margin-left:5px}#targetRepsDisplay:before{content:"/ "}#resetBtn{background:none;border:none;color:#ffffff80;cursor:pointer;margin-top:10px;padding:5px}#resetBtn svg{width:clamp(20px,4vw,25px);height:clamp(20px,4vw,25px);fill:currentColor;transition:transform .3s ease,color .3s ease}#resetBtn:hover svg{transform:rotate(-180deg);color:#fff}#left-stats-container{grid-area:middle-left;display:flex;flex-direction:column;justify-content:center;gap:clamp(20px,5vh,40px);padding-left:clamp(10px,3vw,20px)}.stat-item{text-align:left}.stat-label{font-size:clamp(14px,3vw,18px);color:#ffffffb3;text-transform:uppercase;letter-spacing:1px}.stat-value{font-size:clamp(40px,10vw,60px);font-weight:900;line-height:1}#bottom-left-area{grid-area:bottom-left;display:flex;align-items:flex-end;padding-left:clamp(10px,3vw,20px)}#kcalTotalDisplayContainer{display:flex;align-items:baseline;gap:5px}#kcalTotalDisplay{font-size:clamp(24px,5vw,32px);font-weight:900;color:#ff8c00}#kcalTotalDisplayContainer span:last-child{font-size:.6em;font-weight:700;color:#ff8c00cc;text-transform:uppercase}#bottom-center-area{grid-area:bottom-center;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:15px}#bottom-right-area{grid-area:bottom-right;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;gap:15px;padding-right:clamp(10px,3vw,20px)}#bottom-right-area button{background:#1e1e1ecc;border:1px solid rgba(255,255,255,.15);border-radius:50%;width:clamp(50px,10vw,65px);height:clamp(50px,10vw,65px);display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;transition:all .2s ease}#bottom-right-area button:hover{background-color:#323232;transform:scale(1.05)}#bottom-right-area button svg{width:55%;height:55%;fill:currentColor}#soundToggleBtn.sound-off{color:#ff6b6b}#social-notification-popup,#congrats-notification{background:#141414e6;border:1px solid rgba(255,255,255,.2);color:#fff;padding:15px 25px;border-radius:50px;font-size:clamp(14px,3vw,18px);text-align:center;max-width:80%;box-shadow:0 5px 20px #00000080;opacity:0;transform:translateY(20px);transition:opacity .5s ease,transform .5s ease;pointer-events:none}#social-notification-popup.visible,#congrats-notification.visible{opacity:1;transform:translateY(0)}#social-notification-popup strong{color:gold}#congrats-notification{display:flex;align-items:center;gap:10px;font-weight:700}#congrats-notification span:first-child{font-size:1.5em}.modal-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000e0;z-index:20000;justify-content:center;align-items:center;pointer-events:auto;overflow-y:auto}.modal-content{background-color:#121212;color:#fff;padding:25px clamp(15px,4vw,30px);border-radius:15px;box-shadow:0 5px 25px #000000b3;width:90%;border:1px solid rgba(255,255,255,.1);max-height:90vh;overflow-y:auto;position:relative}.modal-content h2{margin-top:0;font-size:clamp(20px,5vw,28px);color:gold;text-align:center;margin-bottom:25px}.close-modal-btn{position:absolute;top:10px;right:10px;background:none;border:none;font-size:28px;color:#aaa;cursor:pointer;line-height:1;padding:5px}.close-modal-btn:hover{color:#fff}#statsLeaderboardModal .modal-content{max-width:750px}.tabs-container{display:flex;justify-content:center;margin-bottom:20px;border-bottom:1px solid rgba(255,255,255,.2)}.tab-button{padding:12px 20px;cursor:pointer;background:none;border:none;border-bottom:3px solid transparent;color:#aaa;font-size:clamp(15px,3.5vw,18px);font-family:Arial Black,Arial,sans-serif;transition:all .2s ease-in-out;outline:none}.tab-button:hover{color:#fff}.tab-button.active{color:gold;border-bottom-color:gold;font-weight:700}.tab-button.hidden{display:none}.tab-content{display:none;animation:fadeIn .4s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}#statsTable,#leaderboardTable{width:100%;margin-top:15px;border-collapse:collapse}#statsTable th,#statsTable td,#leaderboardTable th,#leaderboardTable td{padding:12px 8px;border-bottom:1px solid rgba(255,255,255,.1);font-size:clamp(13px,3.2vw,17px);text-align:left}#statsTable th,#leaderboardTable th{background-color:#0000004d;color:#ffe37e}#statsTable td:not(:first-child),#leaderboardTable td:not(:nth-child(2)){text-align:right}#settingsModal .modal-content{max-width:500px;text-align:left}.settings-section{margin-bottom:30px}.settings-section h3{color:gold;border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:10px;margin-bottom:20px;font-size:clamp(18px,4vw,22px)}.setting-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.setting-row label{font-size:clamp(15px,3.5vw,18px)}.setting-row input[type=text],.setting-row input[type=password]{width:60%;padding:8px;background:#333;border:1px solid #555;border-radius:5px;color:#fff;font-size:1em}.setting-row .input-group{display:flex;flex-direction:column;align-items:flex-end;gap:10px;flex-grow:1;margin-left:15px}.setting-row .input-group input{width:100%}.setting-row button{padding:8px 15px;border:1px solid #888;background:#444;color:#fff;border-radius:5px;cursor:pointer}.setting-row button:hover{background:#555}.setting-row .toggle-switch{position:relative;display:inline-block;width:50px;height:28px}.toggle-switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.4s;border-radius:28px}.slider:before{position:absolute;content:"";height:20px;width:20px;left:4px;bottom:4px;background-color:#fff;transition:.4s;border-radius:50%}input:checked+.slider{background-color:#4caf50}input:checked+.slider:before{transform:translate(22px)}#settingsModal #logoutBtn{display:block;width:100%;padding:12px;margin-top:20px;background-color:#b83b3b;color:#fff;font-size:1.1em;border:none;border-radius:8px;cursor:pointer}#settingsModal #logoutBtn:hover{background-color:#a03333}.auth-modal-content{max-width:400px;padding:25px clamp(20px,5vw,40px)}.auth-form label{display:block;text-align:left;margin-bottom:5px;font-size:clamp(14px,3vw,16px)}.auth-form input{width:calc(100% - 22px);padding:10px;margin-bottom:15px;border-radius:5px;border:1px solid #555;background-color:#333;color:#fff;font-size:clamp(15px,3.5vw,18px)}.auth-form button[type=submit]{background-color:#4caf50;color:#fff;padding:12px 20px;border:none;border-radius:5px;cursor:pointer;font-size:clamp(16px,4vw,20px);width:100%;margin-top:10px}.auth-switch{margin-top:20px;font-size:clamp(13px,3vw,15px)}.auth-switch button{background:none;border:none;color:#64b5f6;cursor:pointer;text-decoration:underline;padding:0;font-size:inherit}.auth-message{margin-top:15px;font-size:clamp(13px,3vw,15px);min-height:1.2em;display:none}.auth-message.error{color:#ff6b6b}.auth-message.success{color:#42c986}#left-stats-container .stat-item{cursor:pointer;transition:background-color .2s ease-in-out;border-radius:10px;padding:10px;margin:-10px}#left-stats-container .stat-item:hover{background-color:#ffffff1a}#left-stats-container{grid-area:middle-left;display:flex;flex-direction:column;justify-content:center;gap:clamp(20px,5vh,40px);padding-left:clamp(10px,3vw,20px);z-index:10}.stat-item{text-align:left;cursor:pointer;transition:background-color .2s ease-in-out;border-radius:10px;padding:10px;margin:-10px;pointer-events:auto!important}.stat-item:hover{background-color:#ffffff1a}.stat-label,.stat-value{pointer-events:none}#kcalTotalDisplayContainer.clickable:hover{transform:scale(1.05);filter:brightness(1.2)}#repsSelectorContainer{background:#141414f2;padding:15px;border-radius:12px;margin-top:15px;border:1px solid rgba(255,255,255,.1)}#repsSelect{font-family:Arial Black,Arial,sans-serif;font-size:clamp(16px,4vw,20px);background-color:#333;color:#fff;border:1px solid #555;border-radius:8px;padding:8px 15px;cursor:pointer}@keyframes pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}.skeleton-loader{display:inline-block;height:24px;width:60px;background:transparent;border-radius:4px;animation:pulse 1s infinite}.skeleton-overlay{display:none;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:2}#totalStatBlock{position:relative}#userMenuContainer{position:relative;display:none;cursor:pointer}#userDisplay{color:#fff;padding:8px 12px;border-radius:20px;background:#ffffff1a;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s}#userDisplay:hover{background-color:#fff3}#userAvatar{border-radius:50%;object-fit:cover;border:1px solid rgba(255,255,255,.3)}.settings-tabs{display:flex;border-bottom:1px solid rgba(255,255,255,.2);margin-bottom:20px}.tab-btn{flex:1;padding:12px 20px;background:transparent;border:none;color:#ffffffb3;cursor:pointer;font-size:16px;font-weight:500;transition:all .3s ease;border-bottom:2px solid transparent}.tab-btn:hover{color:#ffffffe6;background:#ffffff0d}.tab-btn.active{color:#fff;border-bottom-color:#007bff;background:#ffffff1a}.tab-content{display:none}.tab-content.active{display:block}.user-list{max-height:300px;overflow-y:auto;margin-top:15px}.user-list-item{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;border-bottom:1px solid rgba(255,255,255,.1);transition:background-color .2s}.user-list-item:hover{background-color:#ffffff0d}.user-list-item-name{font-size:16px;color:#fff;flex-grow:1}.follow-btn{background:#007bff;color:#fff;border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .2s}.follow-btn:hover{background:#0056b3}.follow-btn.following{background:#28a745}.follow-btn.following:hover{background:#218838}