*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}#root,.app{min-height:100vh}.app{background-color:#f5f5f5;box-shadow:0 0 10px #0000001a;margin:0 auto;max-width:400px}.app-header{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 2px 8px #0000001a;color:#fff;display:flex;justify-content:space-between;padding:16px 20px;position:-webkit-sticky;position:sticky;top:0;z-index:100}.app-header h1{font-size:18px;font-weight:600;margin:0}.add-card-btn{align-items:center;background:#fff3;border:1px solid #ffffff4d;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:20px;font-weight:700;height:36px;justify-content:center;transition:all .2s;width:36px}.add-card-btn:hover{background:#ffffff4d;transform:scale(1.05)}.app-main{padding:0}@media (max-width:480px){.app{box-shadow:none;max-width:100%}.app-header{padding:12px 16px}.app-header h1{font-size:16px}.add-card-btn{font-size:18px;height:32px;width:32px}}.card-form{background:#fff;border-bottom:1px solid #eee}.form{padding:20px}.form-group{margin-bottom:16px}.form-group label{color:#333;display:block;font-size:14px;font-weight:500;margin-bottom:6px}.form-input{border:1px solid #ddd;border-radius:6px;font-size:14px;padding:10px 12px;transition:border-color .2s;width:100%}.form-input:focus{border-color:#667eea;box-shadow:0 0 0 2px #667eea1a;outline:none}.content-field{background:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;margin-bottom:16px;padding:12px;position:relative}.label-input{margin-bottom:8px}.form-textarea{border:1px solid #ddd;border-radius:6px;font-family:inherit;font-size:14px;min-height:60px;padding:10px 12px;resize:vertical;transition:border-color .2s;width:100%}.form-textarea:focus{border-color:#667eea;box-shadow:0 0 0 2px #667eea1a;outline:none}.remove-btn{background:#dc3545;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:12px;opacity:.8;padding:4px 8px;position:absolute;right:8px;top:8px;transition:opacity .2s}.remove-btn:hover{opacity:1}.add-content-btn{background:#28a745;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;padding:8px 16px;transition:background-color .2s}.add-content-btn:hover{background:#218838}.form-actions{display:flex;gap:10px;margin-top:20px}.submit-btn{background:#667eea;border:none;border-radius:6px;color:#fff;cursor:pointer;flex:1 1;font-size:14px;font-weight:500;padding:12px;transition:background-color .2s}.submit-btn:hover{background:#5a6fd8}.cancel-btn{background:#6c757d;border:none;border-radius:6px;color:#fff;cursor:pointer;flex:1 1;font-size:14px;padding:12px;transition:background-color .2s}.cancel-btn:hover{background:#5a6268}@media (max-width:480px){.toggle-form-btn{font-size:13px;padding:14px 16px}.form{padding:16px}.content-field{margin-bottom:12px;padding:10px}.label-input{margin-bottom:6px}.form-input,.form-textarea{font-size:13px;padding:8px 10px}.form-actions{flex-direction:column}.cancel-btn,.submit-btn{font-size:13px;padding:10px}}.card{background:#fff;border-bottom:1px solid #eee;border-radius:8px;box-shadow:0 1px 3px #0000001a;margin-bottom:8px;transition:all .2s}.card:hover{background:#fafafa;box-shadow:0 2px 6px #00000026}.card-header{align-items:center;border-bottom:1px solid #f0f0f0;display:flex;justify-content:space-between;padding:16px 20px 12px}.card-title{color:#333;flex:1 1;font-size:16px;font-weight:600;margin:0;word-break:break-word}.delete-card-btn{background:none;border:none;border-radius:4px;color:#dc3545;cursor:pointer;flex-shrink:0;font-size:20px;margin-left:12px;padding:4px 8px;transition:background-color .2s}.delete-card-btn:hover{background:#dc35451a}.card-content{padding:0 20px 16px}.content-item{align-items:flex-start;border-bottom:1px solid #f5f5f5;display:flex;gap:12px;padding:8px 0}.content-item:last-child{border-bottom:none}.content-text{color:#555;flex:1 1;font-size:14px;line-height:1.5;padding:4px 0;white-space:pre-wrap;word-break:break-word}.content-label{color:#333;font-weight:600}.content-value{color:#555}.copy-btn{align-items:center;background:#f8f9fa;border:1px solid #dee2e6;border-radius:4px;cursor:pointer;display:flex;flex-shrink:0;font-size:12px;height:28px;justify-content:center;min-width:32px;padding:6px 8px;transition:all .2s}.copy-btn:hover{background:#e9ecef;border-color:#adb5bd}.copy-btn.copied{background:#d4edda;border-color:#c3e6cb;color:#155724}@media (max-width:480px){.card-header{padding:12px 16px 10px}.card-title{font-size:15px}.delete-card-btn{font-size:18px;margin-left:8px;padding:2px 6px}.card-content{padding:0 16px 12px}.content-item{gap:8px;padding:6px 0}.content-label,.content-text,.content-value{font-size:13px}.copy-btn{font-size:11px;height:24px;min-width:28px;padding:4px 6px}}.card-list{padding:12px}.empty-state{color:#6c757d;padding:60px 20px;text-align:center}.empty-icon{font-size:48px;margin-bottom:16px}.empty-state p{font-size:16px;margin:8px 0}.empty-subtitle{font-size:14px!important;opacity:.7}@media (max-width:480px){.card-list{padding:8px}.empty-state{padding:40px 16px}.empty-icon{font-size:40px;margin-bottom:12px}.empty-state p{font-size:14px}.empty-subtitle{font-size:12px!important}}