*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:Monaco,Menlo,Ubuntu Mono,monospace}.app{display:flex;height:100vh;overflow:hidden}.sidebar{width:240px;background:#1a1a1a;color:#fff;padding:20px;overflow-y:auto}.sidebar h1{font-size:18px;margin-bottom:30px;color:#4caf50}.nav{list-style:none}.nav li{margin-bottom:8px}.nav a{display:block;padding:10px 12px;color:#ccc;text-decoration:none;border-radius:4px;transition:all .2s}.nav a:hover{background:#2a2a2a;color:#fff}.nav a.active{background:#4caf50;color:#fff}.main{flex:1;overflow-y:auto;background:#f5f5f5}.container{max-width:1200px;margin:0 auto;padding:30px}.header{margin-bottom:30px}.header h2{font-size:28px;margin-bottom:8px}.header p{color:#666}.card{background:#fff;border-radius:8px;padding:24px;margin-bottom:20px;box-shadow:0 2px 4px #0000001a}.card h3{font-size:18px;margin-bottom:16px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:6px;font-weight:500;font-size:14px}.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;font-family:inherit}.form-group textarea{font-family:Monaco,Menlo,monospace;min-height:200px;resize:vertical}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#4caf50}.btn{padding:10px 20px;border:none;border-radius:4px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.btn-primary{background:#4caf50;color:#fff}.btn-primary:hover{background:#45a049}.btn-secondary{background:#666;color:#fff}.btn-secondary:hover{background:#555}.btn:disabled{opacity:.5;cursor:not-allowed}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:12px;text-align:left;border-bottom:1px solid #eee}.table th{background:#f9f9f9;font-weight:600;font-size:13px;color:#666;text-transform:uppercase}.table tbody tr:hover{background:#f9f9f9}.badge{display:inline-block;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500}.badge-success{background:#d4edda;color:#155724}.badge-warning{background:#fff3cd;color:#856404}.badge-error{background:#f8d7da;color:#721c24}.alert{padding:12px 16px;border-radius:4px;margin-bottom:20px}.alert-success{background:#d4edda;color:#155724;border:1px solid #c3e6cb}.alert-error{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.alert-info{background:#d1ecf1;color:#0c5460;border:1px solid #bee5eb}.drop-zone{border:2px dashed #ddd;border-radius:8px;padding:40px;text-align:center;cursor:pointer;transition:all .2s;background:#fafafa}.drop-zone:hover,.drop-zone.active{border-color:#4caf50;background:#f0f8f0}.file-list{margin-top:20px}.file-item{display:flex;align-items:center;justify-content:space-between;padding:12px;background:#f9f9f9;border-radius:4px;margin-bottom:8px}.file-info{flex:1}.file-name{font-weight:500;margin-bottom:4px}.file-meta{font-size:12px;color:#666}.status-bar{position:fixed;bottom:0;left:240px;right:0;background:#fff;border-top:1px solid #eee;padding:12px 30px;display:flex;align-items:center;justify-content:space-between;font-size:13px}.status-item{display:flex;align-items:center;gap:8px}.empty-state{text-align:center;padding:60px 20px;color:#999}.empty-state-icon{font-size:48px;margin-bottom:16px}.error-list{background:#fff3cd;border:1px solid #ffc107;border-radius:4px;padding:12px;margin-top:8px}.error-list ul{list-style:none;margin:0;padding:0}.error-list li{color:#856404;font-size:13px;margin-bottom:4px}.error-list li:before{content:"• ";margin-right:6px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}.pack-card{background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 2px 4px #0000001a;transition:all .2s}.pack-card:hover{box-shadow:0 4px 8px #00000026}.pack-thumb{width:100%;height:200px;object-fit:cover;background:#f0f0f0}.pack-info{padding:16px}.pack-title{font-weight:600;margin-bottom:8px}.pack-meta{font-size:13px;color:#666;margin-bottom:4px}.spinner{display:inline-block;width:20px;height:20px;border:3px solid rgba(0,0,0,.1);border-radius:50%;border-top-color:#4caf50;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}