.user-cards{display:flex;flex-direction:column;gap:var(--space-md);padding:var(--space-md)}.user-card{border:1px solid var(--color-border);border-radius:8px;padding:var(--space-md);cursor:pointer;transition:box-shadow .3s ease,background-color .2s ease;background-color:var(--color-bg);min-height:44px}.user-card:hover{box-shadow:0 4px 8px #0000001a;background-color:var(--color-bg-secondary)}.user-card:active{box-shadow:0 2px 4px #00000026;background-color:var(--color-bg-secondary);transform:translateY(1px)}.user-card:focus{outline:2px solid var(--color-primary);outline-offset:2px}.user-card h3{margin:0 0 var(--space-sm) 0;font-size:var(--font-size-lg);font-weight:600;color:var(--color-text-primary)}.user-card p{margin:0;font-size:var(--font-size-base);color:var(--color-text-secondary)}@media(max-width:767px){.user-cards{padding:var(--space-sm);gap:var(--space-sm)}.user-card{padding:var(--space-md)}}@media(min-width:768px){.user-cards{display:none}}.toast{position:fixed;top:var(--space-lg);left:50%;transform:translate(-50%);z-index:9999;padding:var(--space-md) var(--space-lg);border-radius:8px;font-size:var(--font-size-base);font-weight:500;box-shadow:0 4px 12px #00000026;min-width:250px;max-width:500px;text-align:center;opacity:0}.toast--success{background-color:var(--color-secondary);color:#fff;border:2px solid #059669}.toast--error{background-color:var(--color-error);color:#fff;border:2px solid var(--color-error-dark)}@media(max-width:767px){.toast{min-width:200px;max-width:90%;padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm)}}.user-list{padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-lg)}.user-list--empty{min-height:200px;display:flex;justify-content:center;align-items:center}.user-list__empty-message{color:var(--color-text-secondary);font-size:var(--font-size-lg);text-align:center}.user-cards{display:flex;flex-direction:column;gap:var(--space-md)}.user-card{border:1px solid var(--color-border);border-radius:8px;padding:var(--space-md);cursor:pointer;transition:box-shadow .3s ease}.user-card:hover{box-shadow:0 4px 8px #0000001a}.loading-spinner{display:flex;justify-content:center;align-items:center;min-height:200px;color:var(--color-text-secondary);font-size:var(--font-size-lg)}.toast{position:fixed;top:var(--space-lg);left:50%;transform:translate(-50%);padding:var(--space-md) var(--space-lg);border-radius:8px;font-size:var(--font-size-base);font-weight:500;box-shadow:0 4px 12px #00000026;z-index:1000;max-width:90%;text-align:center}.toast--success{background-color:var(--color-secondary);color:#fff}.toast--error{background-color:var(--color-error);color:#fff}@media(min-width:768px){.user-cards{display:none}.user-table{width:100%;border-collapse:collapse}.user-table th,.user-table td{padding:var(--space-sm) var(--space-md);text-align:left;border-bottom:1px solid var(--color-border)}.user-table tbody tr{cursor:pointer;transition:background-color .2s ease}.user-table tbody tr:hover{background-color:#f9fafb}.user-list{padding:var(--space-lg)}}@media(min-width:1024px){.user-list{padding:var(--space-xl);max-width:1400px;margin:0 auto}}.users-page{width:100%}.users-page__header{display:flex;justify-content:flex-end;margin-bottom:var(--space-lg);padding:var(--space-md) 0}.users-page__create-button{background-color:var(--color-primary);color:var(--color-bg);border:none;border-radius:8px;padding:var(--space-sm) var(--space-lg);font-size:var(--font-size-base);font-weight:600;cursor:pointer;min-width:44px;min-height:44px;transition:background-color .2s ease}.users-page__create-button:hover{background-color:var(--color-primary-dark)}.users-page__create-button:active{background-color:var(--color-primary-dark);transform:translateY(1px)}.users-page__create-button:focus{outline:2px solid var(--color-primary-light);outline-offset:2px}.users-page__create-button:disabled{background-color:var(--color-border);cursor:not-allowed}@media(max-width:767px){.users-page__header{justify-content:stretch}.users-page__create-button{width:100%}}@media(min-width:768px)and (max-width:1023px){.users-page__header{justify-content:flex-end}.users-page__create-button{min-width:180px}}@media(min-width:1024px){.users-page__header{justify-content:flex-end}.users-page__create-button{min-width:200px}}.confirm-dialog-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--space-md, 1rem)}.confirm-dialog-content{background-color:var(--color-bg, #ffffff);border-radius:12px;padding:var(--space-xl, 2rem);max-width:500px;width:100%;box-shadow:0 10px 25px #0000001a;animation:fadeInScale .3s ease-out}@keyframes fadeInScale{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.confirm-dialog-message{font-size:var(--font-size-lg, 1.125rem);color:var(--color-text-primary, #111827);margin-bottom:var(--space-lg, 1.5rem);line-height:1.6;text-align:center}.confirm-dialog-actions{display:flex;gap:var(--space-md, 1rem);justify-content:center;flex-wrap:wrap}.confirm-dialog-confirm,.confirm-dialog-cancel{padding:.75rem 1.5rem;font-size:var(--font-size-base, 1rem);font-weight:600;border-radius:8px;border:none;cursor:pointer;min-width:120px;min-height:44px;transition:background-color .2s ease,transform .1s ease}.confirm-dialog-confirm{background-color:var(--color-error, #ef4444);color:#fff}.confirm-dialog-confirm:hover{background-color:var(--color-error-dark, #dc2626)}.confirm-dialog-confirm:active{transform:scale(.98)}.confirm-dialog-cancel{background-color:var(--color-bg-secondary, #f8fafc);color:var(--color-text-primary, #111827);border:1px solid var(--color-border, #e2e8f0)}.confirm-dialog-cancel:hover{background-color:#e2e8f0}.confirm-dialog-cancel:active{transform:scale(.98)}@media(max-width:767px){.confirm-dialog-content{padding:var(--space-lg, 1.5rem);max-width:90%}.confirm-dialog-message{font-size:var(--font-size-base, 1rem)}.confirm-dialog-actions{flex-direction:column}.confirm-dialog-confirm,.confirm-dialog-cancel{width:100%}}.user-detail{padding:var(--space-lg)}.user-detail h1{font-size:var(--font-size-xl);margin-bottom:var(--space-lg);color:var(--color-text-primary)}.user-detail p{font-size:var(--font-size-base);margin-bottom:var(--space-sm);color:var(--color-text-secondary)}.user-detail .actions{display:flex;gap:var(--space-md);margin-top:var(--space-xl)}.user-detail .actions button{padding:var(--space-sm) var(--space-lg);border:none;border-radius:8px;font-size:var(--font-size-base);cursor:pointer;transition:background-color .2s ease;min-width:44px;min-height:44px}.user-detail .actions button:first-child{background-color:var(--color-primary);color:#fff}.user-detail .actions button:first-child:hover:not(:disabled){background-color:var(--color-primary-dark)}.user-detail .actions button:nth-child(2){background-color:var(--color-error);color:#fff}.user-detail .actions button:nth-child(2):hover:not(:disabled){background-color:var(--color-error-dark)}.user-detail .actions button:last-child{background-color:var(--color-bg-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.user-detail .actions button:last-child:hover:not(:disabled){background-color:var(--color-border)}.user-detail .actions button:disabled{opacity:.6;cursor:not-allowed}@media(max-width:767px){.user-detail{padding:var(--space-md)}.user-detail .actions{flex-direction:column;gap:var(--space-sm)}.user-detail .actions button{width:100%}}.user-form{width:100%;max-width:600px;margin:0 auto;padding:var(--space-lg)}.form-group{margin-bottom:var(--space-lg)}.form-group label{display:block;margin-bottom:var(--space-sm);font-weight:600;color:var(--color-text-primary);font-size:var(--font-size-base)}.form-group input,.form-group select{width:100%;min-height:44px;padding:var(--space-sm) var(--space-md);font-size:var(--font-size-base);border:1px solid var(--color-border);border-radius:8px;background-color:var(--color-bg);color:var(--color-text-primary);transition:border-color .2s ease,box-shadow .2s ease}.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #3b82f61a}.form-group input.error,.form-group select.error{border-color:var(--color-error)}.form-group input.error:focus,.form-group select.error:focus{box-shadow:0 0 0 3px #ef44441a}.error-message{display:block;margin-top:var(--space-xs);font-size:var(--font-size-sm);color:var(--color-error)}.actions{display:flex;gap:var(--space-md);margin-top:var(--space-xl)}.actions button{flex:1;min-height:44px;min-width:44px;padding:var(--space-sm) var(--space-lg);font-size:var(--font-size-base);font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:background-color .2s ease,transform .1s ease}.actions button:active{transform:scale(.98)}.btn-primary{background-color:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-dark)}.btn-primary:disabled{background-color:#93c5fd;cursor:not-allowed;opacity:.6}.btn-secondary{background-color:var(--color-bg-secondary);color:var(--color-text-primary);border:1px solid var(--color-border)}.btn-secondary:hover{background-color:#e2e8f0}@media(min-width:768px){.user-form{padding:var(--space-xl)}.actions button{flex:initial;min-width:120px}}@media(min-width:1024px){.user-form{padding:var(--space-xl) var(--space-xl)}}.layout{display:grid;grid-template-rows:auto 1fr;min-height:100vh;background-color:var(--color-bg-secondary)}.layout__header{background-color:var(--color-bg);border-bottom:1px solid var(--color-border);padding:var(--space-md) var(--space-lg);display:flex;flex-direction:column;gap:var(--space-md)}.layout__header-content{display:flex;justify-content:space-between;align-items:center;width:100%}.layout__app-title{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text-primary);margin:0}.layout__logout-button{background-color:var(--color-error);color:#fff;border:none;border-radius:6px;padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm);font-weight:500;cursor:pointer;transition:background-color .2s ease,opacity .2s ease;min-width:120px;min-height:44px}.layout__logout-button:hover:not(:disabled){background-color:var(--color-error-dark)}.layout__logout-button:disabled{opacity:.6;cursor:not-allowed}.layout__logout-button:focus{outline:2px solid var(--color-error);outline-offset:2px}.layout__nav{display:flex;gap:var(--space-md);align-items:center}.layout__nav-link{color:var(--color-primary);text-decoration:none;padding:var(--space-sm) var(--space-md);border-radius:6px;transition:background-color .2s ease,color .2s ease;font-weight:500}.layout__nav-link:hover{background-color:#eff6ff;color:var(--color-primary-dark)}.layout__nav-link:focus{outline:2px solid var(--color-primary);outline-offset:2px}.layout__main{padding:var(--space-xl);max-width:1400px;width:100%;margin:0 auto}.layout__page-title{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text-primary);margin:0 0 var(--space-lg) 0}.layout__content{background-color:var(--color-bg);border-radius:12px;padding:var(--space-lg);box-shadow:0 1px 3px #0000001a}@media(max-width:767px){.layout__header-content{flex-direction:column;align-items:flex-start;gap:var(--space-sm)}.layout__app-title{font-size:var(--font-size-lg)}.layout__logout-button{width:100%}.layout__main{padding:var(--space-md)}.layout__page-title{font-size:var(--font-size-lg)}.layout__content{padding:var(--space-md);border-radius:8px}}@media(min-width:768px)and (max-width:1023px){.layout__main{padding:var(--space-lg)}}.pagination{display:flex;align-items:center;justify-content:center;gap:var(--space-lg);padding:var(--space-lg) 0}.pagination__button{min-width:44px;min-height:44px;padding:var(--space-sm) var(--space-lg);border:1px solid var(--color-border);border-radius:8px;background-color:var(--color-bg);color:var(--color-text-primary);font-size:var(--font-size-base);cursor:pointer;transition:all .2s ease}.pagination__button:hover:not(:disabled){background-color:var(--color-primary-light);border-color:var(--color-primary);color:var(--color-bg)}.pagination__button:active:not(:disabled){background-color:var(--color-primary-dark);border-color:var(--color-primary-dark)}.pagination__button:disabled{opacity:.5;cursor:not-allowed;background-color:var(--color-bg-secondary);color:var(--color-text-secondary)}.pagination__info{font-size:var(--font-size-base);color:var(--color-text-primary);font-weight:500;min-width:100px;text-align:center}@media(max-width:767px){.pagination{gap:var(--space-md)}.pagination__button{min-width:44px;padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm)}.pagination__info{min-width:80px;font-size:var(--font-size-sm)}}:root{--color-primary-light: #60a5fa;--color-primary: #3b82f6;--color-primary-dark: #2563eb;--color-secondary: #10b981;--color-error-light: #fca5a5;--color-error: #ef4444;--color-error-dark: #dc2626;--color-text-primary: #111827;--color-text-secondary: #6b7280;--color-bg: #ffffff;--color-bg-secondary: #f8fafc;--color-border: #e2e8f0;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--breakpoint-mobile: 767px;--breakpoint-tablet: 768px;--breakpoint-desktop: 1024px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;color:var(--color-text-primary);background-color:var(--color-bg);line-height:1.6}button{font-family:inherit;cursor:pointer;min-width:44px;min-height:44px}