:root{--primary-color:#667eea;--secondary-color:#764ba2;--danger-color:#dc3545;--success-color:#28a745;--warning-color:#ffc107;--light-bg:#f5f7fa}html,body{background-color:var(--light-bg);color:#333;height:100%;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}#root{flex-direction:column;min-height:100vh;display:flex}*{box-sizing:border-box;margin:0;padding:0}body{color:#333;background-color:#f5f7fa;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.main-content{min-height:calc(100vh - 200px)}.container{background-color:#fff;border-radius:15px;max-width:1000px;margin:2rem auto;padding:2rem;transition:box-shadow .3s;box-shadow:0 5px 20px #00000014}.container:hover{box-shadow:0 8px 30px #0000001f}h2{color:#667eea;text-align:center;margin-bottom:2rem;font-size:1.8rem}.header-data{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:2rem;display:flex}.header-data h2{flex:1;min-width:200px;margin:0}.total{color:#fff;text-align:center;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:10px;width:100%;margin-bottom:2rem;padding:1.5rem;font-size:1.1rem;font-weight:600}.total strong{margin-top:.5rem;font-size:1.5rem;display:block}table{border-collapse:collapse;width:100%;margin-top:1rem}th,td{text-align:center;border-bottom:1px solid #e0e0e0;padding:1rem}th{color:#fff;text-align:center;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);font-weight:600}tr{transition:background-color .2s}tr:hover{background-color:#f9f9f9}tr:nth-child(2n){background-color:#f5f7fa}.form{flex-direction:column;gap:1.5rem;max-width:500px;margin:0 auto;display:flex}.data{flex-direction:column;gap:.5rem;display:flex}.data label{color:#333;font-size:1rem;font-weight:600}.data input,.data select{border:2px solid #e0e0e0;border-radius:8px;padding:.8rem 1rem;font-family:inherit;font-size:1rem;transition:border-color .3s,box-shadow .3s}.data input:focus,.data select:focus{border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea1a}.btn{cursor:pointer;text-align:center;border:none;border-radius:8px;padding:.8rem 1.5rem;font-size:1rem;font-weight:600;text-decoration:none;transition:all .3s;display:inline-block}.btn-primary{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 5px 15px #667eea66}.btn-info{color:#fff;background-color:#17a2b8;margin-right:.5rem}.btn-info:hover{background-color:#138496;transform:translateY(-2px)}.btn-danger{color:#fff;background-color:#dc3545}.btn-danger:hover{background-color:#c82333;transform:translateY(-2px)}.btn-success{color:#fff;background-color:#28a745}.btn-success:hover{background-color:#218838}.form button,.form a{margin-top:1rem;padding:1rem}@media (width<=768px){.container{margin:1rem;padding:1.5rem}h2{font-size:1.5rem}.header-data{flex-direction:column;align-items:stretch}.header-data h2{text-align:left}table{font-size:.9rem}th,td{padding:.8rem .5rem}.btn{margin-bottom:.5rem;padding:.6rem 1rem;font-size:.9rem}.btn-info,.btn-danger{width:100%;margin-right:0!important}.form{max-width:100%}.data input,.data select{padding:.7rem .8rem}}@media (width<=480px){.container{margin:.5rem;padding:1rem}h2{font-size:1.3rem}table{font-size:.8rem}th,td{padding:.6rem .4rem}.total{padding:1rem;font-size:.95rem}.total strong{font-size:1.3rem}.btn{padding:.5rem .8rem;font-size:.8rem}}.navbar{z-index:100;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);padding:0;position:sticky;top:0;box-shadow:0 2px 10px #0000001a}.navbar-container{justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;padding:1rem 2rem;display:flex}.navbar-logo{color:#fff;align-items:center;gap:.5rem;margin-right:10px;font-size:1.5rem;font-weight:700;text-decoration:none;transition:transform .3s;display:flex}.navbar-logo:hover{transform:scale(1.05)}.nav-menu{align-items:center;gap:2rem;display:flex}.nav-link{color:#fff;font-weight:500;text-decoration:none;transition:opacity .3s}.nav-link:hover{opacity:.8}.btn-add{color:#333;background-color:gold;border-radius:25px;padding:.6rem 1.5rem;font-weight:700;transition:all .3s}.btn-add:hover{background-color:#ffed4e;transform:translateY(-2px);box-shadow:0 4px 10px #ffd70066}@media (width<=768px){.navbar-container{padding:1rem}.navbar-logo{font-size:1.2rem}.nav-menu{gap:1rem}.nav-link{font-size:.9rem}.btn-add{padding:.5rem 1rem;font-size:.9rem}}.footer{color:#fff;text-align:center;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);margin-top:5rem;padding:2rem;box-shadow:0 -2px 10px #0000001a}.footer-content{max-width:1200px;margin:0 auto}.footer-content p{margin:.5rem 0;font-size:.95rem}.footer-content p:first-child{font-weight:600}@media (width<=768px){.footer{margin-top:3rem;padding:1.5rem}.footer-content p{font-size:.85rem}}