body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh}.container{background:var(--bg-secondary);border-radius:20px;padding:30px;box-shadow:0 20px 60px #00000026;max-width:1400px;width:95%;margin:20px auto}.container h1{text-align:center;color:#2c3e50;margin-bottom:20px;font-size:28px}.container .viewer-section{display:grid;grid-template-columns:2fr 1fr;gap:30px;margin-bottom:30px}.container .viewer-box{background:var(--bg-tertiary);border-radius:15px;padding:20px}.container .viewer-box h2{font-size:18px;color:var(--text-muted);margin-bottom:15px;text-align:center}.container #spineContainer{width:100%;height:600px;background:var(--bg-secondary);border:3px solid var(--border-color);border-radius:10px;position:relative;overflow:hidden}.container #spineContainer canvas{display:block}.container .controls{background:var(--bg-tertiary);border-radius:15px;padding:20px}.container .control-group{margin-bottom:15px}.container .control-group label{display:block;font-weight:600;color:var(--text-muted);margin-bottom:8px;font-size:13px}.container input[type=file],.container select{width:100%;padding:8px;border:2px solid var(--border-color);border-radius:8px;font-size:12px;background:var(--bg-secondary);color:var(--text-secondary);margin-bottom:5px}.container input[type=range]{width:100%;margin-bottom:5px}.container input[type=checkbox]{margin-right:8px}.container .range-value{text-align:center;color:var(--text-muted);font-size:13px;margin-bottom:8px}.container button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:10px 16px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;width:100%;margin-top:8px;transition:transform var(--transition-base)}.container button:hover:not(:disabled){transform:translateY(-2px)}.container button:active:not(:disabled){transform:translateY(0)}.container button:disabled{opacity:.5;cursor:not-allowed;transform:none}.container .button-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.container #displayModeBtns button{background:var(--border-color);color:var(--text-secondary)}.container #displayModeBtns button.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.container .animation-list,.container .skin-list{max-height:250px;overflow-y:auto;border:2px solid var(--border-color);border-radius:8px;padding:10px;background:var(--bg-secondary)}.container .animation-item,.container .skin-item{padding:8px;margin:4px 0;background:var(--bg-tertiary);color:var(--text-secondary);border-radius:6px;cursor:pointer;transition:background var(--transition-base);font-size:12px}.container .animation-item:hover,.container .skin-item:hover{background:var(--bg-primary)}.container .animation-item.active,.container .skin-item.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-weight:600}.container .status{text-align:center;padding:12px;background:#fff3cd;border-radius:8px;margin-bottom:20px;color:#856404;font-size:13px}.container .status.success{background:#d4edda;color:#155724}.container .status.error{background:#f8d7da;color:#721c24}.container .file-status{font-size:11px;color:var(--text-muted);margin-top:3px}.container .file-status.loaded{color:var(--success-color);font-weight:600}@media (max-width: 1024px){.container .viewer-section{grid-template-columns:1fr}.container #spineContainer{height:500px}}body.dark-mode .container{background:#fff;box-shadow:0 20px 60px #0000004d}body.dark-mode .container h1{color:#333}body.dark-mode .viewer-box,body.dark-mode .controls{background:#f8f9fa}body.dark-mode .viewer-box h2{color:#555}body.dark-mode #spineContainer{background:#fff;border:3px solid #e0e0e0}body.dark-mode .control-group label{color:#555}body.dark-mode input[type=file],body.dark-mode select{background:#fff;border:2px solid #e0e0e0;color:inherit}body.dark-mode .range-value{color:#666}body.dark-mode #displayModeBtns button{background:#e0e0e0;color:#333}body.dark-mode .animation-list,body.dark-mode .skin-list{background:#fff;border:2px solid #e0e0e0}body.dark-mode .animation-item,body.dark-mode .skin-item{background:#f8f9fa;color:inherit}body.dark-mode .animation-item:hover,body.dark-mode .skin-item:hover{background:#e9ecef}body.dark-mode .file-status{color:#666}