*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-primary: #4a90d9;--color-primary-dark: #357abd;--color-success: #4caf50;--color-danger: #e74c3c;--color-bg: #f5f5f5;--color-card: #ffffff;--color-text: #333333;--color-text-light: #777777;--color-border: #e0e0e0;--color-done: #a8d5a2;--radius: 10px;--shadow: 0 2px 8px rgba(0, 0, 0, .08)}html{font-size:16px}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--color-bg);color:var(--color-text);line-height:1.5;-webkit-font-smoothing:antialiased}.app{min-height:100vh;display:flex;flex-direction:column}.main-content{flex:1;padding:1rem 1rem 5rem;max-width:600px;width:100%;margin:0 auto}.nav-bar{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;background:var(--color-card);border-top:1px solid var(--color-border);padding:.6rem 0;z-index:100;box-shadow:0 -2px 8px #0000000f}.nav-link{text-decoration:none;color:var(--color-text-light);font-size:.85rem;font-weight:600;padding:.4rem 1rem;border-radius:6px;transition:color .15s,background .15s}.nav-link:hover{color:var(--color-primary)}.nav-link.active{color:var(--color-primary);background:#4a90d91a}.btn-primary{background:var(--color-primary);color:#fff;border:none;padding:.7rem 1.4rem;border-radius:var(--radius);font-size:1rem;font-weight:600;cursor:pointer;transition:background .15s}.btn-primary:hover{background:var(--color-primary-dark)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:transparent;color:var(--color-primary);border:2px solid var(--color-primary);padding:.55rem 1.2rem;border-radius:var(--radius);font-size:.9rem;font-weight:600;cursor:pointer;transition:background .15s}.btn-secondary:hover{background:#4a90d914}.btn-danger{background:var(--color-danger);color:#fff;border:none;padding:.7rem 1.4rem;border-radius:var(--radius);font-size:1rem;font-weight:600;cursor:pointer}.btn-danger:hover{opacity:.9}.btn-text{background:none;border:none;color:var(--color-text-light);cursor:pointer;font-size:.85rem;text-decoration:underline}.dashboard-header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.5rem}.dashboard-header h1{font-size:1.4rem}.dashboard-date{font-size:.85rem;color:var(--color-text-light)}.dashboard-summary{font-size:.9rem;color:var(--color-text-light);margin-bottom:1rem}.dashboard-empty{text-align:center;margin-top:3rem}.dashboard-empty p{margin-bottom:1rem;color:var(--color-text-light)}.page-loading{text-align:center;padding:3rem;color:var(--color-text-light)}.exercise-list{display:flex;flex-direction:column;gap:.75rem}.exercise-card{background:var(--color-card);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.exercise-card-done{opacity:.55}.exercise-card-header{padding:1rem;cursor:pointer}.exercise-card-title-row{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.5rem}.exercise-card-title{font-size:1.05rem;font-weight:700}.exercise-card-reps{font-size:.8rem;color:var(--color-text-light)}.exercise-card-details{padding:0 1rem 1rem}.exercise-card-image{width:100%;max-height:200px;object-fit:cover;border-radius:6px;margin-bottom:.5rem}.exercise-card-desc{font-size:.9rem;color:var(--color-text-light);margin-bottom:.75rem;white-space:pre-wrap}.exercise-card-actions{display:flex;gap:.5rem;padding:0 1rem 1rem}.btn-log{flex:1;background:var(--color-primary);color:#fff;border:none;padding:.75rem;border-radius:var(--radius);font-size:1rem;font-weight:700;cursor:pointer;transition:background .15s}.btn-log:hover{background:var(--color-primary-dark)}.btn-log-done{background:var(--color-success)}.btn-log-done:hover{background:#43a047}.btn-undo{width:48px;background:var(--color-card);border:2px solid var(--color-border);border-radius:var(--radius);font-size:1.3rem;font-weight:700;cursor:pointer;color:var(--color-text-light);transition:border-color .15s}.btn-undo:hover:not(:disabled){border-color:var(--color-primary);color:var(--color-primary)}.btn-undo:disabled{opacity:.3;cursor:not-allowed}.progress-bar-container{display:flex;align-items:center;gap:.6rem}.progress-bar-track{flex:1;height:10px;background:var(--color-border);border-radius:5px;overflow:hidden}.progress-bar-fill{height:100%;background:var(--color-primary);border-radius:5px;transition:width .3s ease}.progress-bar-done{background:var(--color-success)}.progress-bar-label{font-size:.8rem;font-weight:600;color:var(--color-text-light);white-space:nowrap}.exercise-form-page h1{font-size:1.4rem;margin-bottom:1rem}.exercise-form{display:flex;flex-direction:column;gap:1rem}.form-field{display:flex;flex-direction:column;gap:.3rem}.form-field span{font-weight:600;font-size:.9rem}.form-field input,.form-field textarea{padding:.65rem .8rem;border:2px solid var(--color-border);border-radius:8px;font-size:1rem;font-family:inherit;transition:border-color .15s}.form-field input:focus,.form-field textarea:focus{outline:none;border-color:var(--color-primary)}.form-actions{display:flex;gap:.75rem}.form-actions .btn-primary{flex:1}.image-upload{display:flex;flex-direction:column;gap:.5rem;align-items:flex-start}.image-upload-preview{width:100%;max-height:200px;object-fit:cover;border-radius:8px}.image-upload-label{display:inline-block;padding:.55rem 1.2rem;background:transparent;color:var(--color-primary);border:2px solid var(--color-primary);border-radius:var(--radius);font-size:.9rem;font-weight:600;cursor:pointer}.image-upload-label:hover{background:#4a90d914}.settings-page h1{font-size:1.4rem;margin-bottom:1.2rem}.settings-section{margin-bottom:1.5rem}.settings-section h2{font-size:1.05rem;margin-bottom:.3rem}.settings-hint{font-size:.85rem;color:var(--color-text-light);margin-bottom:.6rem}.sync-code-display{display:flex;align-items:center;gap:.75rem}.sync-code-value{font-size:1.5rem;font-weight:700;letter-spacing:.15em;background:var(--color-card);padding:.5rem 1rem;border-radius:8px;border:2px solid var(--color-border)}.sync-code-input{display:flex;gap:.5rem}.sync-code-input input{flex:1;padding:.65rem .8rem;border:2px solid var(--color-border);border-radius:8px;font-size:1rem}.sync-code-input input:focus{outline:none;border-color:var(--color-primary)}
