html,body,#app{height:100%;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.loading-screen{display:flex;align-items:center;justify-content:center;height:100vh}@media(min-width:768px){#app{max-width:800px;margin:0 auto}}*{margin:0;padding:0;box-sizing:border-box}html{height:100%;overflow:hidden}body{height:100%;margin:0;padding:0;overflow:auto;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#app{min-height:100%}@media(min-width:768px){body{background:#f5f5f5}}.right{justify-self:self-end;text-align:right}.left{justify-self:self-start;text-align:left}.center{justify-self:center;text-align:center}:root{--color-dark: #000;--color-primary: #7c3aed;--color-brand: #3C029F;--color-background: #f5f5f5;--color-surface: #ffffff;--color-text: #333;--color-hover: #f9f9f9;--color-text-secondary: #666;--color-border: #e0e0e0;--color-error: #dc2626;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--font-size-xs: .8rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-md: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.5rem}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--spacing-lg);transition:all .2s}.card:hover{border-color:var(--color-primary)}.card-clickable{cursor:pointer}.card-header{font-weight:600;margin-bottom:var(--spacing-sm);font-size:var(--font-size-base)}.card-body{color:var(--color-text-secondary);font-size:var(--font-size-sm)}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-lg)}.section-header h2{margin:0;font-size:var(--font-size-lg);color:var(--color-text)}.section-description{margin:0 0 var(--spacing-lg);color:var(--color-text-secondary);font-size:var(--font-size-sm);line-height:1.5}.list-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md);background:var(--color-surface);border-bottom:1px solid var(--color-border);transition:background .2s}.list-item:hover{background:var(--color-background)}.list-item:last-child{border-bottom:none}.spacer{flex:1}.text-secondary{color:var(--color-text-secondary)}.text-error{color:var(--color-error)}.text-sm{font-size:var(--font-size-sm)}.text-lg{font-size:var(--font-size-lg)}.mb-sm{margin-bottom:var(--spacing-sm)}.mb-md{margin-bottom:var(--spacing-md)}.mb-lg{margin-bottom:var(--spacing-lg)}.mb-xl{margin-bottom:var(--spacing-xl)}.mt-sm{margin-top:var(--spacing-sm)}.mt-md{margin-top:var(--spacing-md)}.mt-lg{margin-top:var(--spacing-lg)}.mt-xl{margin-top:var(--spacing-xl)}.brand{font-weight:700;display:flex;align-items:center;margin-left:-5px;gap:var(--spacing-sm);color:var(--color-brand);text-transform:uppercase;letter-spacing:.1em}.brand-login{justify-content:center;font-size:var(--font-size-xl);padding-bottom:var(--spacing-md)}.login-container p{font-size:var(--font-size-sm);text-align:center;color:var(--color-brand);letter-spacing:.04em}.logo{height:32px;width:auto}.btn,.btn-icon{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-sm);cursor:pointer;font-family:inherit;font-size:var(--font-size-sm);font-weight:500;border:none;transition:all .2s}.btn{padding:var(--spacing-sm) var(--spacing-lg)}.btn-icon{padding:0;width:40px;height:40px}.primary{background:var(--color-primary);color:#fff}.primary:hover{opacity:.9}.secondary{background:transparent;color:var(--color-text);border:1px solid var(--color-border)}.secondary:hover{border-color:var(--color-primary);color:var(--color-primary)}.tertiary{background:transparent;color:var(--color-text)}.tertiary:hover{background:var(--color-hover)}.delete-btn{background:var(--color-error);color:#fff}.delete-btn:hover{opacity:.9}.round{border-radius:50%}.pill{border-radius:var(--radius-sm)}.btn-icon.icon-sm{width:32px;height:32px}.btn-icon.icon-sm svg{width:16px;height:16px}.btn-icon.icon-md{width:40px;height:40px}.btn-icon.icon-md svg{width:20px;height:20px}.btn-icon.icon-lg{width:48px;height:48px}.btn-icon.icon-lg svg{width:24px;height:24px}.btn svg{width:20px;height:20px}.btn:disabled,.btn-icon:disabled{opacity:.5;cursor:not-allowed}.btn:active:not(:disabled),.btn-icon:active:not(:disabled){transform:scale(.98)}.full-width{width:100%}button.subtle{width:auto;font-size:var(--font-size-xs);border:1px dashed var(--color-text-secondary)}.chip{padding:var(--spacing-sm) var(--spacing-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:50px;cursor:pointer;font-size:var(--font-size-sm);color:var(--color-text);transition:all .2s;min-width:50px;white-space:nowrap}.chip:hover{border-color:var(--color-primary)}.chip.active{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.chip-group{display:flex;flex-wrap:wrap;gap:var(--spacing-sm)}.preset-chips{display:grid;gap:var(--spacing-md);grid-template-columns:repeat(3,1fr)}@media(min-width:768px){.preset-chips{grid-template-columns:repeat(4,1fr)}}.preset-chip{display:flex;align-items:center;justify-content:space-between}.preset-chip.inactive{opacity:.5}.preset-chip .chip-value{cursor:pointer;-webkit-user-select:none;user-select:none;font-weight:500}.preset-chip .chip-value:hover{color:var(--color-primary)}.chip-toggle{background:none;border:none;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--color-text-secondary);transition:color .2s}.preset-chip:not(.inactive) .chip-toggle{color:var(--color-primary)}.chip-toggle:hover{opacity:.7}.preset-chip.add-chip{background:var(--color-primary);color:#fff;border-color:var(--color-primary);cursor:pointer;font-weight:500}.preset-chip.add-chip:hover{opacity:.9}.form-group{margin-bottom:var(--spacing-lg)}.form-group label{display:block;margin-bottom:var(--spacing-sm);font-weight:500;color:var(--color-text);font-size:var(--font-size-sm)}input,textarea,select{width:100%;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-base);font-family:inherit;color:var(--color-text);background:var(--color-surface);transition:border-color .2s}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--color-primary)}input::placeholder,textarea::placeholder{color:var(--color-text-secondary);opacity:.6}input:disabled,textarea:disabled,select:disabled{background:var(--color-background);cursor:not-allowed;opacity:.6}input[type=number]{appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{appearance:none}.form-group .date-display{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);cursor:pointer;transition:border-color .2s;font-size:var(--font-size-md);color:var(--color-text);font-weight:400}.date-display:hover{border-color:var(--color-primary)}.date-text{flex:1}.calendar-icon{color:var(--color-text-secondary);flex-shrink:0}.date-input-hidden{position:absolute;opacity:0;pointer-events:none;width:0;height:0}.custom-select{position:relative;min-width:120px}.select-trigger{width:100%;height:37.5px;display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);color:var(--color-text);cursor:pointer;font-family:inherit;transition:border-color .2s}.select-trigger:hover{border-color:var(--color-primary)}.select-trigger .chevron{transition:transform .2s;color:var(--color-text-secondary)}.select-trigger .chevron.rotated{transform:rotate(180deg)}.select-dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);box-shadow:0 4px 12px #00000026;max-height:200px;overflow-y:auto;z-index:1200;-webkit-overflow-scrolling:touch}.select-option{width:100%;padding:var(--spacing-sm) var(--spacing-md);background:none;border:none;text-align:left;font-size:var(--font-size-sm);color:var(--color-text);cursor:pointer;transition:background .2s;font-family:inherit}.select-option:hover{background:var(--color-hover)}.select-option.selected{background:var(--color-hover);font-weight:500}.dropdown-enter-active,.dropdown-leave-active{transition:opacity .15s,transform .15s}.dropdown-enter-from,.dropdown-leave-to{opacity:0;transform:translateY(-8px)}.segmented-control{display:inline-flex;background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:2px}.segment{padding:var(--spacing-sm) var(--spacing-lg);background:transparent;border:none;cursor:pointer;font-size:var(--font-size-sm);font-weight:500;color:var(--color-text);border-radius:calc(var(--radius-sm) - 2px);transition:all .2s;white-space:nowrap;font-family:inherit}.segment.active{background:var(--color-primary);color:#fff}.segment:hover:not(.active){background:#0000000d}.modal-overlay{position:fixed;inset:0;background:#00000080;z-index:2000;display:flex;align-items:center;justify-content:center;padding:var(--spacing-md)}.modal-dialog{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;width:100%;max-height:90vh;display:flex;flex-direction:column}.modal-dialog.sm{max-width:400px}.modal-dialog.md{max-width:600px}.modal-dialog.lg{max-width:800px}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.modal-header h3{margin:0;font-size:var(--font-size-lg);font-weight:600}.modal-body{padding:var(--spacing-lg);overflow-y:auto}.modal-footer{display:flex;justify-content:flex-end;gap:var(--spacing-md);padding:var(--spacing-lg);border-top:1px solid var(--color-border)}.modal-enter-active,.modal-leave-active{transition:opacity .2s ease}.modal-enter-active .modal-dialog,.modal-leave-active .modal-dialog{transition:transform .2s ease,opacity .2s ease}.modal-enter-from,.modal-leave-to{opacity:0}.modal-enter-from .modal-dialog,.modal-leave-to .modal-dialog{transform:scale(.95);opacity:0}.workout-card,.template-card{background:var(--color-surface);border-bottom:1px solid var(--color-border);border-left:3px solid transparent;cursor:pointer;transition:all .2s}.workout-card:hover,.template-card:hover{border-left-color:var(--color-primary);background:var(--color-hover)}.card-content{padding:var(--spacing-lg) var(--spacing-md)}.card-header{display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-sm)}.card-title{flex:1;min-width:0}.card-actions{display:flex;gap:var(--spacing-sm);flex-shrink:0}.card-actions .btn-icon{opacity:1}.card-actions .btn-icon:hover{background:var(--color-hover)}.card-actions .btn-icon.duplicate{color:var(--color-primary)}.card-actions .btn-icon.duplicate:hover{background:#7c3aed1a}.card-actions .btn-icon.delete{color:var(--color-error)}.card-actions .btn-icon.delete:hover{background:#dc26261a}.workout-card .card-title .date{font-weight:600;font-size:var(--font-size-base);color:var(--color-text)}.card-notes{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--spacing-md)}.card-blocks{display:flex;flex-direction:column;gap:var(--spacing-md)}.block{font-size:var(--font-size-sm)}.block-exercises{font-weight:600;color:var(--color-text);margin-bottom:var(--spacing-xs)}.block-details{color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:500}.template-card .card-title .name{font-weight:600;font-size:var(--font-size-base);color:var(--color-text)}.card-details{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.blocks-section{margin-top:var(--spacing-xl)}.block-container{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:var(--spacing-lg);overflow:visible}.block-header-wrapper{display:flex;justify-content:space-between;padding:var(--spacing-md)}.block-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .2s;gap:var(--spacing-md)}.block-title{display:flex;align-items:center;gap:var(--spacing-xs);flex-shrink:0}.block-number{font-weight:600;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.block-actions{display:flex;align-items:center;gap:var(--spacing-sm);flex-shrink:0}.block-content{padding:0 var(--spacing-md) var(--spacing-md)}.add-block{border-style:dashed}.exercises-list{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-bottom:var(--spacing-md)}.exercise-row{display:grid;grid-template-columns:2fr .5fr auto;gap:var(--spacing-sm);align-items:center}.exercise-row .custom-select{min-width:0;width:100%}.reps-input{width:100%;padding:var(--spacing-xs) var(--spacing-sm);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-family:inherit;height:37.5px}.rounds-input{width:100px;padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-base);font-family:inherit}.global-header{position:sticky;top:0;z-index:100;background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:var(--spacing-sm) var(--spacing-sm);padding-top:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}.global-header .right-cta{justify-self:end}.page-title{font-size:var(--font-size-lg);font-weight:600;margin:0;text-align:center;display:flex;align-items:center;justify-content:center;gap:var(--spacing-sm)}@media(min-width:640px){.global-header{padding:var(--spacing-lg) var(--spacing-lg) var(--spacing-md)}}.drawer-left-overlay{position:fixed;inset:0;background:#00000080;z-index:1000;display:flex;justify-content:flex-start}.drawer-left{position:fixed;top:0;left:0;width:280px;height:100vh;height:100dvh;background:var(--color-surface);box-shadow:2px 0 8px #0000001a;display:flex;flex-direction:column;z-index:1001;overflow:hidden}.drawer-left-header{flex-shrink:0;display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.drawer-body{flex:1;overflow-y:auto;overflow-x:hidden;padding:var(--spacing-lg);-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;gap:var(--spacing-md)}.drawer-nav{display:flex;flex-direction:column}.drawer-nav-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md) var(--spacing-sm);color:var(--color-text);text-decoration:none;transition:background .2s;font-size:var(--font-size-base);border-radius:var(--radius-sm);cursor:pointer;background:transparent;border:none;width:100%;text-align:left;font-family:inherit}.drawer-nav-item svg{width:20px;height:20px;flex-shrink:0}.drawer-nav-item:hover{background:var(--color-hover)}.drawer-nav-item.active{background:var(--color-hover);font-weight:600}.drawer-nav-item.primary{background:var(--color-primary);color:#fff}.drawer-nav-item.primary:hover{opacity:.9}.drawer-nav-item.logout{margin-top:var(--spacing-lg);border-top:1px solid var(--color-border);padding-top:var(--spacing-md);color:var(--color-error)}.drawer-nav-item.logout:hover{background:#ef44441a;color:var(--color-error)}.drawer-left-enter-active,.drawer-left-leave-active{transition:opacity .3s ease}.drawer-left-enter-active .drawer-left,.drawer-left-leave-active .drawer-left{transition:transform .3s ease}.drawer-left-enter-from,.drawer-left-leave-to{opacity:0}.drawer-left-enter-from .drawer-left,.drawer-left-leave-to .drawer-left{transform:translate(-100%)}.drawer-left-enter-to .drawer-left,.drawer-left-leave-from .drawer-left{transform:translate(0)}.login-wrapper{height:100%;display:flex;align-items:center;justify-content:center}.login-container{padding:var(--spacing-md)}.login-card{background:var(--color-surface);border-radius:var(--radius-lg);padding:var(--spacing-xl);width:100%;max-width:400px}.login-card h1{margin:0 0 var(--spacing-xl);text-align:center;font-size:var(--font-size-xl)}.login-card form{display:flex;flex-direction:column}.login-card input{width:100%;padding:var(--spacing-sm) var(--spacing-md);margin-bottom:var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--font-size-base);font-family:inherit}.login-card button[type=submit]{width:100%;padding:var(--spacing-sm) var(--spacing-md);background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-sm);font-size:var(--font-size-base);font-weight:500;cursor:pointer;margin-bottom:var(--spacing-md)}.login-card button[type=submit]:hover{opacity:.9}.toggle{width:100%;padding:var(--spacing-sm);padding-top:var(--spacing-md);background:none;border:none;color:var(--color-brand);cursor:pointer;font-size:var(--font-size-sm);text-decoration:underline}.toggle:hover{opacity:.8}.forgot-password{width:100%;background:none;border:none;color:var(--color-brand);cursor:pointer;font-size:var(--font-size-sm);text-decoration:underline;padding:var(--spacing-sm)}.forgot-password:hover{opacity:.8}.error{color:var(--color-error);font-size:var(--font-size-sm);margin-top:var(--spacing-sm);text-align:center}.main-content-wrapper{min-height:calc(100vh - 60px);padding-bottom:var(--spacing-xl)}.loading,.empty{text-align:center;padding:var(--spacing-xl);color:var(--color-text-secondary)}.empty-content{display:flex;flex-direction:column;gap:var(--spacing-lg);align-items:center}.workout-list,.template-list{padding-bottom:var(--spacing-xl)}.template-edit-view .edit-content{margin-top:var(--spacing-lg)}.edit-view{min-height:100vh;background:var(--color-background)}.edit-content{max-width:700px;margin:0 auto;padding:var(--spacing-lg)}.form-actions{display:flex;gap:var(--spacing-md);margin-top:var(--spacing-xl);padding-bottom:var(--spacing-xl)}.form-actions button{flex:1}.settings-section{border-bottom:1px solid var(--color-border);padding:var(--spacing-lg)}.settings-section h2{margin:0 0 var(--spacing-xs);font-size:var(--font-size-lg)}.section-description{margin:0 0 var(--spacing-lg);font-size:var(--font-size-sm);color:var(--color-text-secondary)}.setting-item{margin-bottom:var(--spacing-md)}.setting-item label{display:block;margin-bottom:var(--spacing-xs);font-weight:500;color:var(--color-text-secondary);font-size:var(--font-size-sm)}.readonly-value{color:var(--color-text);font-size:var(--font-size-base)}.settings-account{display:flex;flex-direction:column;gap:var(--spacing-sm)}