.scai-login, .scai-app { max-width: 1000px; margin: 30px auto; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial; }
h2 { margin: 0 0 8px 0; }
.badge.test { background: #f39c12; color:#fff; padding: 4px 8px; border-radius: 6px; font-size: 12px; margin-left: 8px; }
.header { display:flex; justify-content: space-between; align-items:center; gap: 16px; }
.header-actions 
.limits { margin: 10px 0 20px; color:#444; }
.tabs { display:flex; gap: 10px; margin-bottom: 14px; }
.tab { background:#fff; border:1px solid #e5e7eb; border-radius: 10px; padding: 8px 12px; cursor:pointer; }
.tab.active { background:#f3f4f6; }
.section { background:#fff; border:1px solid #e5e7eb; border-radius: 12px; padding: 16px; }
.section-head { display:flex; justify-content: space-between; align-items:center; margin-bottom: 12px; }
.form-grid { display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.form-grid label { display:flex; flex-direction:column; gap:6px; font-size:14px; color:#333; }
.form-grid input, .form-grid textarea, .panel input, .panel textarea, .panel select { padding: 10px; border:1px solid #e5e7eb; border-radius: 8px; }
.panel { display:grid; gap:12px; }
.form-actions { display:flex; gap: 10px; }
.list .item { display:flex; justify-content: space-between; align-items:center; border:1px solid #eee; border-radius: 10px; padding: 10px; margin-bottom:8px; }
.list .title { font-weight:600; }
.actions 

button.danger { background:#b91c1c; }
.loading { text-align:center; padding: 30px; }
.result { background:#f9fafb; border:1px dashed #d1d5db; border-radius: 10px; padding: 12px; }

.editor { display:grid; grid-template-columns: 340px 1fr; gap: 16px; }
.editor-tools { background:#fafafa; border:1px solid #eee; border-radius: 12px; padding: 12px; display:grid; gap:10px; }
.editor-stage-wrap { display:flex; justify-content:center; align-items:center; }
.editor-stage { position:relative; width: 540px; height: 540px; border:1px solid #e5e7eb; border-radius: 12px; overflow:hidden; background:#111; }
.editor-stage .bg { position:absolute; width:100%; height:100%; object-fit:cover; inset:0; }
.draggable { position:absolute; cursor:move; user-select:none; }
.text { color:#fff; text-shadow: 0 1px 2px rgba(0,0,0,.35); }
.text.title { font-size: 36px; font-weight: 800; left: 24px; top: 24px; }
.text.subtitle { font-size: 22px; font-weight: 600; left: 24px; top: 90px; }
.badge { background: rgba(0,0,0,.6); color:#fff; padding: 6px 12px; border-radius: 999px; left: 24px; bottom: 24px; }
.moving { outline: 2px dashed #60a5fa; }
.grid.thumbs { display:grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.grid.thumbs .thumb { border:1px solid #eee; border-radius: 10px; overflow:hidden; background:#fff; }
.grid.thumbs .thumb img { width:100%; display:block; }
@media (max-width: 900px){ .editor { grid-template-columns: 1fr; } .editor-stage{ width: 360px; height: 360px; } }

/* Buttons and basic theme */
button { background:#111827; color:#fff; border:none; border-radius:10px; padding:8px 12px; cursor:pointer; }
button:hover { filter: brightness(1.05); }
.scai-login h2 { margin-bottom: 8px; }
.scai-login form { display:flex; gap:10px; }
.scai-login input[type="email"] { flex:1; padding: 10px; border:1px solid #e5e7eb; border-radius:8px; }
#scai-login-msg { margin-top:8px; color:#374151; }
