body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:#f0f2f5;color:#333}*{box-sizing:border-box}html,body,#app{height:100%;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:#f5f7fa;color:#333}.page{padding:40px 40px 60px;max-width:1400px;margin:0 auto}.breadcrumb{font-size:26px;font-weight:600;color:#1a1a1a;margin:0 0 40px;padding-top:10px}.add-btn{position:absolute;top:80px;right:40px;padding:12px 28px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:500;cursor:pointer;box-shadow:0 6px 20px #667eea4d;transition:all .3s ease;z-index:10}.add-btn:hover{transform:translateY(-3px);box-shadow:0 12px 30px #667eea66}.table-container{background:#fff;border-radius:16px;box-shadow:0 10px 30px #0000001a;overflow:hidden;margin-bottom:40px}table{width:100%;border-collapse:collapse}thead th{background:#f8fafc;color:#4a5568;font-weight:600;text-align:left;padding:20px;border-bottom:3px solid #e2e8f0}tbody td{padding:20px;border-bottom:1px solid #e2e8f0;transition:background .3s}tbody tr:hover td{background:#f0f8ff}button:not(.add-btn){padding:8px 16px;margin:0 6px;border:1px solid #e2e8f0;border-radius:8px;background:#fff;color:#4a5568;cursor:pointer;font-size:14px;transition:all .2s}button:not(.add-btn):hover{background:#667eea;color:#fff;border-color:#667eea}.del{color:#e53e3e;border-color:#fed7d7}.del:hover{background:#e53e3e;color:#fff}.empty-state{text-align:center;padding:120px 40px;background:linear-gradient(to bottom,#f8fafc,#fff);border-radius:16px;box-shadow:0 10px 30px #00000014}.empty-message{font-size:36px;font-weight:300;color:#b0bec5;font-style:italic;margin-bottom:20px}.empty-sub{font-size:18px;color:#718096;max-width:600px;margin:0 auto;line-height:1.6}img{border-radius:10px;box-shadow:0 4px 12px #0000001a}.loading:before{content:"";display:inline-block;width:20px;height:20px;border:3px solid #667eea;border-top-color:transparent;border-radius:50%;animation:spin 1s linear infinite;margin-right:12px;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1024px){.table-container{overflow-x:auto}table{min-width:800px}}button:not(.add-btn):hover{transform:scale(1.05);transition:transform .2s ease}