:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,sans-serif;background:#f8fafc;color:#1e293b}#root{margin:0;padding:0;text-align:left}.cms-layout{display:flex;min-height:100vh}.cms-main-content{margin-left:260px;padding:24px;width:calc(100vw - 260px);min-height:100vh;background:#f8fafc;overflow-x:auto}.cms-navbar{display:flex;flex-direction:column;width:260px;min-height:100vh;background:linear-gradient(145deg,#1e293b,#334155);color:#fff;padding:20px 0;position:fixed;left:0;top:0;z-index:100;box-shadow:2px 0 12px #0000001a}.cms-navbar-logo{margin:0 0 40px;text-align:center;font-size:1.6em;font-weight:700;color:#60a5fa;letter-spacing:.5px}.cms-navbar-links{flex:1;padding:0 16px;display:flex;flex-direction:column;gap:12px}.cms-navbar-section{width:100%}.cms-navbar-dropdown-title{color:#ffffffe6;padding:12px 16px;border-radius:8px;transition:all .2s ease;font-size:.95em;font-weight:500;border-left:3px solid transparent;cursor:pointer;-webkit-user-select:none;user-select:none;display:block;width:100%;box-sizing:border-box}.cms-navbar-dropdown-title:hover{background:#ffffff1a;transform:translate(2px);border-left-color:#60a5fa}.cms-navbar-dropdown-header{display:flex;justify-content:space-between;align-items:center;width:100%}.cms-navbar-arrow{transition:transform .2s ease;font-size:.8em}.cms-navbar-arrow.open{transform:rotate(90deg)}.cms-navbar-submenu{max-height:0;overflow:hidden;transition:max-height .3s ease;margin-left:16px}.cms-navbar-submenu.show{max-height:200px}.cms-navbar-sublink{color:#fffc;text-decoration:none;padding:8px 16px;margin:4px 0;border-radius:6px;transition:all .2s ease;font-size:.9em;font-weight:400;border-left:2px solid transparent;display:block}.cms-navbar-sublink:hover{background:#ffffff14;color:#fffffff2;transform:translate(2px);border-left-color:#60a5fa}.cms-navbar-sublink.active{background:#60a5fa26;border-left-color:#60a5fa;color:#dbeafe}.cms-navbar-link{color:#ffffffe6;text-decoration:none;padding:12px 16px;border-radius:8px;transition:all .2s ease;font-size:.95em;font-weight:500;border-left:3px solid transparent;display:block}.cms-navbar-link:hover{background:#ffffff1a;transform:translate(2px);border-left-color:#60a5fa}.cms-navbar-link.active{background:#60a5fa33;border-left-color:#60a5fa;color:#dbeafe}.cms-navbar-logout{background:linear-gradient(145deg,#ef4444,#dc2626);color:#fff;border:none;padding:12px 16px;border-radius:8px;cursor:pointer;margin:20px 16px 0;font-size:.95em;font-weight:600;transition:all .2s ease}.cms-navbar-logout:hover{background:linear-gradient(145deg,#dc2626,#b91c1c);transform:translateY(-1px);box-shadow:0 4px 12px #ef44444d}.login-page-bg{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);z-index:0}.login-form-container{background:#fff;padding:2.5rem;border-radius:16px;box-shadow:0 20px 40px #0000001a;min-width:380px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.login-form-title{margin-bottom:2rem;text-align:center;font-size:1.8em;font-weight:700;color:#1e293b}.login-form-error{color:#ef4444;margin-bottom:1rem;text-align:center;background:#fef2f2;padding:.75rem;border-radius:8px;border:1px solid #fecaca}.login-form-group{margin-bottom:1.5rem}.login-form-label{display:block;margin-bottom:.5rem;font-weight:600;color:#374151}.login-form-input{width:100%;padding:.75rem;border-radius:8px;border:2px solid #e5e7eb;font-size:1rem;transition:border-color .2s ease}.login-form-input:focus{outline:none;border-color:#60a5fa;box-shadow:0 0 0 3px #60a5fa1a}.login-form-button{width:100%;padding:.875rem;background:linear-gradient(145deg,#3b82f6,#1d4ed8);color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s ease;margin-bottom:.5rem}.login-form-button:hover{transform:translateY(-1px);box-shadow:0 8px 20px #3b82f64d}.page-header{background:#fff;padding:24px 32px;border-radius:12px;box-shadow:0 2px 8px #0000000d;margin-bottom:24px;border-left:4px solid #60a5fa}.page-title{font-size:1.75em;font-weight:700;color:#1e293b;margin:0 0 8px}.page-subtitle{color:#64748b;margin:0;font-size:1.1em}.cms-card{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d;padding:24px;margin-bottom:24px;border:1px solid #e2e8f0}.cms-card-header{margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid #e2e8f0}.cms-card-title{font-size:1.25em;font-weight:600;color:#1e293b;margin:0}.cms-form-group{margin-bottom:20px}.cms-form-label{display:block;margin-bottom:8px;font-weight:600;color:#374151;font-size:.95em}.cms-form-input,.cms-form-textarea,.cms-form-select{width:100%;padding:12px;border:2px solid #e5e7eb;border-radius:8px;font-size:1rem;transition:all .2s ease;background:#fff}.cms-form-input:focus,.cms-form-textarea:focus,.cms-form-select:focus{outline:none;border-color:#60a5fa;box-shadow:0 0 0 3px #60a5fa1a}.cms-form-textarea{min-height:120px;resize:vertical}.cms-btn{padding:12px 20px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s ease;font-size:.95em;display:inline-flex;align-items:center;gap:8px}.cms-btn-primary{background:linear-gradient(145deg,#3b82f6,#1d4ed8);color:#fff}.cms-btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 16px #3b82f64d}.cms-btn-secondary{background:#f1f5f9;color:#475569;border:1px solid #cbd5e1}.cms-btn-secondary:hover{background:#e2e8f0}.cms-btn-success{background:linear-gradient(145deg,#10b981,#059669);color:#fff}.cms-btn-warning{background:linear-gradient(145deg,#f59e0b,#d97706);color:#fff}.cms-btn-danger{background:linear-gradient(145deg,#ef4444,#dc2626);color:#fff}.cms-btn-small{padding:6px 12px;font-size:.85em}.cms-message{padding:12px 16px;border-radius:8px;margin-bottom:16px;font-weight:500}.cms-message-success{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0}.cms-message-error{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}.cms-message-info{background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe}.cms-file-upload{border:2px dashed #cbd5e1;border-radius:8px;padding:24px;text-align:center;background:#f8fafc;transition:all .2s ease;cursor:pointer}.cms-file-upload:hover{border-color:#60a5fa;background:#eff6ff}.cms-file-upload.has-file{border-color:#10b981;background:#f0fdf4}.cms-file-info{display:flex;align-items:center;justify-content:space-between;background:#f1f5f9;padding:8px 12px;border-radius:6px;margin-top:8px;font-size:.9em}.cms-file-remove{background:none;border:none;color:#ef4444;cursor:pointer;padding:4px;border-radius:4px;transition:background .2s ease}.cms-file-remove:hover{background:#fef2f2}.cms-table{width:100%;border-collapse:collapse;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px #0000000d}.cms-table th{background:#f8fafc;padding:16px;text-align:left;font-weight:600;color:#475569;border-bottom:1px solid #e2e8f0}.cms-table td{padding:16px;border-bottom:1px solid #f1f5f9;vertical-align:top}.cms-table tr:hover{background:#f8fafc}.cms-list{list-style:none;padding:0;margin:0}.cms-list-item{display:flex;align-items:center;padding:16px;background:#fff;margin-bottom:8px;border-radius:8px;box-shadow:0 1px 4px #0000000d;transition:all .2s ease}.cms-list-item:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0000001a}.cms-list-item-content{flex:1;margin-right:16px}.cms-list-item-title{font-weight:600;color:#1e293b;margin-bottom:4px}.cms-list-item-meta{color:#64748b;font-size:.9em}.cms-list-item-actions{display:flex;gap:8px}.workflow-container{display:grid;grid-template-columns:400px 1fr;gap:24px;height:calc(100vh - 120px);max-width:none;width:100%}.workflow-editor-panel{background:#fff;border-radius:12px;padding:24px;overflow-y:auto;box-shadow:0 2px 8px #0000000d;min-width:400px}.workflow-preview-panel{background:transparent;border-radius:0;padding:0;border:none;box-shadow:none;overflow:hidden;width:750px}.workflow-node-editor{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:16px;margin-bottom:16px;transition:all .2s ease}.workflow-node-editor:hover{border-color:#cbd5e1;box-shadow:0 2px 8px #0000000d}.workflow-node-row{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:12px;align-items:center}.workflow-input-group{display:flex;flex-direction:column;gap:4px}.workflow-input-small{width:100px}.workflow-input-medium{width:150px}.workflow-input-large{width:250px}.workflow-connection-editor{background:#f0f9ff;border:1px solid #bae6fd;border-radius:8px;padding:16px;margin-bottom:16px}.workflow-positions-editor{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:8px;padding:20px;margin-top:24px}.workflow-position-item{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:#fff;border-radius:6px;margin-bottom:8px;border:1px solid #e5e7eb}.workflow-position-coords{font-family:monospace;font-size:.9em;color:#6b7280}.workflow-add-position{display:flex;gap:8px;align-items:end;padding:12px;background:#f9fafb;border-radius:6px;margin-top:12px}.workflow-preview-canvas{width:100%;height:calc(100vh - 180px);border:none;border-radius:0;background:#fff;position:relative;overflow:hidden;box-shadow:none}.workflow-node{position:absolute;background:#fff;border:2px solid #e2e8f0;border-radius:8px;padding:8px 12px;cursor:pointer;transition:all .2s ease;font-size:.85em;min-width:80px;text-align:center;-webkit-user-select:none;user-select:none}.workflow-node:hover{border-color:#60a5fa;transform:scale(1.02);box-shadow:0 4px 12px #0000001a}.workflow-node-selected{border-color:#3b82f6;background:#dbeafe}.workflow-node-icon{width:20px;height:20px;margin-bottom:4px;border-radius:4px}.workflow-connection{position:absolute;pointer-events:none}.workflow-connection-line{stroke:#94a3b8;stroke-width:2;fill:none}.workflow-connection-line.red-dashed{stroke:#ef4444;stroke-dasharray:5,5}.workflow-connection-line.red-solid{stroke:#ef4444}.workflow-connection-line.gray-dashed{stroke:#9ca3af;stroke-dasharray:3,3}.workflow-connection-line.blue-bold{stroke:#3b82f6;stroke-width:3}@media (max-width: 1200px){.workflow-container{grid-template-columns:1fr;grid-template-rows:400px 1fr;height:auto}.workflow-preview-panel{order:-1}.workflow-preview-canvas{height:400px}}@media (max-width: 768px){.cms-main-content{margin-left:0;width:100vw;padding:16px}.cms-navbar{transform:translate(-100%);transition:transform .3s ease}.cms-navbar.mobile-open{transform:translate(0)}.workflow-container{grid-template-columns:1fr;gap:16px}}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:8px}.gap-4{gap:16px}.mb-4{margin-bottom:16px}.mt-4{margin-top:16px}.text-sm{font-size:.875em}.text-lg{font-size:1.125em}.font-medium{font-weight:500}.font-semibold{font-weight:600}.text-gray-600{color:#4b5563}.text-blue-600{color:#2563eb}.upload-article-container,.upload-video-container,.upload-banner-container{max-width:none;width:100%;margin:0;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000d;padding:32px}.upload-article-title,.upload-video-title,.upload-banner-title{font-size:1.5em;font-weight:700;color:#1e293b;margin-bottom:8px}.upload-article-status,.upload-video-status,.upload-banner-status{color:#64748b;margin-bottom:24px;font-size:1.05em}.upload-article-form-group,.upload-video-form-group,.upload-banner-form-group{margin-bottom:20px}.upload-article-label,.upload-video-label,.upload-banner-label{display:block;margin-bottom:8px;font-weight:600;color:#374151}.upload-article-input,.upload-article-textarea,.upload-video-input,.upload-banner-input{width:100%;padding:12px;border:2px solid #e5e7eb;border-radius:8px;font-size:1rem;transition:border-color .2s ease}.upload-article-input:focus,.upload-article-textarea:focus,.upload-video-input:focus,.upload-banner-input:focus{outline:none;border-color:#60a5fa;box-shadow:0 0 0 3px #60a5fa1a}.upload-btn{background:linear-gradient(145deg,#3b82f6,#1d4ed8);color:#fff;border:none;padding:12px 24px;border-radius:8px;cursor:pointer;font-weight:600;transition:all .2s ease;margin-right:12px}.upload-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px #3b82f64d}.upload-article-btn-cancel,.upload-video-btn-cancel,.upload-banner-btn-cancel{background:#6b7280}.upload-article-btn-cancel:hover,.upload-video-btn-cancel:hover,.upload-banner-btn-cancel:hover{background:#4b5563;transform:translateY(-1px);box-shadow:0 6px 16px #6b72804d}.upload-article-list-item,.upload-video-list-item,.upload-banner-list-item{display:flex;align-items:center;padding:16px;background:#fff;margin-bottom:8px;border-radius:8px;border:1px solid #e2e8f0;transition:all .2s ease}.upload-article-list-item:hover,.upload-video-list-item:hover,.upload-banner-list-item:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0000001a;border-color:#cbd5e1}.upload-article-edit-btn,.upload-video-edit-btn,.upload-banner-edit-btn{background:linear-gradient(145deg,#f59e0b,#d97706);color:#fff;border:none;border-radius:6px;padding:6px 12px;cursor:pointer;font-size:.85em;font-weight:500;margin-left:8px;transition:all .2s ease}.upload-article-edit-btn:hover,.upload-video-edit-btn:hover,.upload-banner-edit-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #f59e0b4d}.upload-article-delete-btn,.upload-video-delete-btn,.upload-banner-delete-btn{background:linear-gradient(145deg,#ef4444,#dc2626);color:#fff;border:none;border-radius:6px;padding:6px 12px;cursor:pointer;font-size:.85em;font-weight:500;margin-left:8px;transition:all .2s ease}.upload-article-delete-btn:hover,.upload-video-delete-btn:hover,.upload-banner-delete-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #ef44444d}.cms-loading{display:flex;align-items:center;justify-content:center;padding:40px;color:#64748b;font-style:italic}.cms-spinner{display:inline-block;width:20px;height:20px;border:2px solid #e2e8f0;border-radius:50%;border-top-color:#3b82f6;animation:spin 1s linear infinite;margin-right:8px}@keyframes spin{to{transform:rotate(360deg)}}.cms-empty-state{text-align:center;padding:40px;color:#64748b;font-style:italic}.workflow-canvas-controls{display:flex;gap:8px;margin-bottom:8px;padding:8px 12px;background:#f8fafce6;border-radius:8px;position:relative;top:0;left:0;width:100%;z-index:10;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 2px 8px #0000001a}.workflow-canvas-zoom{display:flex;align-items:center;gap:8px;margin-left:auto}.workflow-canvas-zoom button{width:32px;height:32px;border:1px solid #cbd5e1;background:#fff;border-radius:6px;cursor:pointer;font-weight:700;transition:all .2s ease}.workflow-canvas-zoom button:hover{background:#f1f5f9;border-color:#60a5fa}.workflow-canvas-zoom span{font-family:monospace;font-weight:600;color:#475569;min-width:50px;text-align:center}
