:root{--primary:#7c3aed;--primary2:#a78bfa;--bg:#f6f7fb;--card:#fff;--text:#1f2937;--muted:#6b7280;--border:#e5e7eb;--danger:#ef4444;--ok:#10b981;--warn:#f59e0b}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:"PingFang SC","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--text);font-size:15px}
a{text-decoration:none;color:inherit}
button{cursor:pointer;border:none;border-radius:10px;font-family:inherit}
input,textarea,select{font-family:inherit;font-size:15px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;width:100%;background:#fff}
input:focus,textarea:focus{outline:2px solid var(--primary2);border-color:var(--primary)}

/* 布局 */
.main{min-height:100vh;padding:20px 20px 90px}
@media(min-width:900px){
  .main.with-sidebar{margin-left:230px;padding:30px 40px}
  .tabbar{display:none}
}
.sidebar{display:none}
@media(min-width:900px){
  .sidebar{display:flex;flex-direction:column;position:fixed;left:0;top:0;bottom:0;width:230px;background:#fff;border-right:1px solid var(--border);padding:24px 14px;z-index:50}
  .logo{font-size:19px;font-weight:700;margin:0 8px 24px}
  .nav-item{padding:12px 14px;border-radius:10px;margin-bottom:4px;color:var(--muted);font-weight:500}
  .nav-item.on{background:linear-gradient(135deg,#ede9fe,#f3e8ff);color:var(--primary)}
  .nav-item:hover{background:#f3f4f6}
  .sidebar-user{margin-top:auto;padding:14px;border-top:1px solid var(--border);font-size:14px}
  .credits-num{color:var(--primary);font-weight:700;margin:6px 0}
  .logout{color:var(--muted);font-size:13px}
}
.tabbar{position:fixed;bottom:0;left:0;right:0;background:#fff;border-top:1px solid var(--border);display:flex;z-index:50;padding-bottom:env(safe-area-inset-bottom)}
.tabbar a{flex:1;text-align:center;padding:8px 0 6px;font-size:20px;color:var(--muted)}
.tabbar a span{display:block;font-size:11px;margin-top:2px}
.tabbar a.on{color:var(--primary)}
.announce{background:linear-gradient(90deg,#fef3c7,#fde68a);color:#92400e;padding:10px 16px;border-radius:12px;margin-bottom:16px;font-size:14px}

/* 卡片与按钮 */
.card{background:var(--card);border-radius:16px;padding:20px;margin-bottom:16px;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.card h2{font-size:17px;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.step-num{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;background:var(--primary);color:#fff;border-radius:50%;font-size:13px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:12px 24px;border-radius:12px;font-size:15px;font-weight:600;transition:.15s}
.btn-primary{background:linear-gradient(135deg,var(--primary),#9333ea);color:#fff}
.btn-primary:hover{opacity:.9}
.btn-primary:disabled{opacity:.5;cursor:not-allowed}
.btn-ghost{background:#f3f4f6;color:var(--text)}
.btn-danger{background:#fee2e2;color:var(--danger)}
.btn-ok{background:#d1fae5;color:#047857}
.btn-sm{padding:7px 14px;font-size:13px;border-radius:8px}
.btn-block{width:100%}

/* 上传 */
.upload-zone{border:2px dashed var(--border);border-radius:14px;padding:30px;text-align:center;color:var(--muted);cursor:pointer;transition:.2s}
.upload-zone:hover,.upload-zone.drag{border-color:var(--primary);color:var(--primary);background:#faf5ff}
.upload-list{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.upload-item{position:relative;width:84px;height:84px;border-radius:10px;overflow:hidden;border:1px solid var(--border)}
.upload-item img,.upload-item video{width:100%;height:100%;object-fit:cover}
.upload-item .del{position:absolute;top:2px;right:2px;background:rgba(0,0,0,.55);color:#fff;border-radius:50%;width:20px;height:20px;font-size:12px;line-height:20px;text-align:center;cursor:pointer}

/* 引擎选择 */
.engine-opt{display:flex;gap:8px;border:1.5px solid var(--border);border-radius:12px;padding:10px 12px;cursor:pointer;transition:.15s;background:#fff}
.engine-opt input{width:auto;margin-top:3px}
.engine-opt:has(input:checked){border-color:var(--primary);background:#faf5ff;box-shadow:0 0 0 3px #ede9fe}
.engine-desc{font-size:12px;color:var(--muted);margin-top:2px}
.engine-price{font-size:12px;color:var(--primary);font-weight:600;margin-top:2px}

/* 分类九宫格 */
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(min-width:900px){.cat-grid{grid-template-columns:repeat(5,1fr)}}
.cat-item{border:1.5px solid var(--border);border-radius:12px;padding:12px 6px;text-align:center;cursor:pointer;transition:.15s;background:#fff}
.cat-item .emoji{font-size:24px}
.cat-item .name{font-size:13px;font-weight:600;margin-top:6px}
.cat-item.on{border-color:var(--primary);background:#faf5ff;color:var(--primary);box-shadow:0 0 0 3px #ede9fe}

/* 分镜卡片 */
.shot-card{border:1px solid var(--border);border-radius:14px;padding:14px;margin-bottom:12px;background:#fff}
.shot-head{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-weight:600}
.shot-head .seq{background:var(--primary);color:#fff;border-radius:8px;padding:2px 10px;font-size:13px}
.shot-img-sel{width:64px;height:64px;object-fit:cover;border-radius:8px;border:2px solid transparent;cursor:pointer}
.shot-img-sel.on{border-color:var(--primary)}
.field-label{font-size:12px;color:var(--muted);margin:8px 0 4px}
textarea{resize:vertical}

/* 视频网格 */
.video-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:900px){.video-grid{grid-template-columns:repeat(4,1fr)}}
.video-item{background:#fff;border-radius:14px;overflow:hidden;border:1px solid var(--border)}
.video-item video{width:100%;aspect-ratio:9/16;background:#000;display:block}
.video-item .info{padding:10px;font-size:13px}
.badge{display:inline-block;padding:2px 10px;border-radius:99px;font-size:12px;font-weight:600}
.badge-gen{background:#fef3c7;color:#b45309}
.badge-done{background:#d1fae5;color:#047857}
.badge-fail{background:#fee2e2;color:#dc2626}
.badge-part{background:#e0e7ff;color:#4338ca}

/* 作品列表 */
.work-row{display:flex;align-items:center;gap:12px;background:#fff;border-radius:14px;padding:14px 16px;margin-bottom:10px;border:1px solid var(--border)}
.work-row .title{font-weight:600;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.work-row .meta{font-size:12px;color:var(--muted);margin-top:4px}

/* 积分 */
.balance-card{background:linear-gradient(135deg,#7c3aed,#a855f7);color:#fff;border-radius:18px;padding:26px;margin-bottom:16px}
.balance-card .num{font-size:38px;font-weight:800}
.pkg-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:900px){.pkg-grid{grid-template-columns:repeat(4,1fr)}}
.pkg-item{border:1.5px solid var(--border);border-radius:14px;padding:18px;text-align:center;cursor:pointer;background:#fff;transition:.15s}
.pkg-item:hover,.pkg-item.on{border-color:var(--primary);box-shadow:0 0 0 3px #ede9fe}
.pkg-item .credits{font-size:22px;font-weight:800;color:var(--primary)}
.pkg-item .bonus{color:var(--ok);font-size:12px}
.tx-row{display:flex;justify-content:space-between;padding:12px 4px;border-bottom:1px solid #f3f4f6;font-size:14px}
.tx-plus{color:var(--ok);font-weight:700}.tx-minus{color:var(--danger);font-weight:700}

/* 弹窗 */
.modal-mask{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px}
.modal{background:#fff;border-radius:18px;padding:24px;width:100%;max-width:400px;max-height:85vh;overflow:auto}
.modal h3{margin-bottom:14px}
.modal .qr{display:block;margin:10px auto;width:230px;height:230px}
.hidden{display:none!important}

/* 表单行 */
.form-row{margin-bottom:14px}
.form-row label{display:block;font-size:13px;color:var(--muted);margin-bottom:6px}

/* 管理端 */
.admin-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.admin-tabs button{padding:9px 18px;border-radius:10px;background:#fff;border:1px solid var(--border);font-weight:600}
.admin-tabs button.on{background:var(--primary);color:#fff;border-color:var(--primary)}
table{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden;font-size:14px}
th,td{padding:10px 12px;text-align:left;border-bottom:1px solid #f3f4f6}
th{background:#f9fafb;color:var(--muted);font-weight:600;font-size:13px}
.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:16px}
@media(min-width:900px){.stat-grid{grid-template-columns:repeat(5,1fr)}}
.stat-card{background:#fff;border-radius:14px;padding:18px;text-align:center}
.stat-card .num{font-size:26px;font-weight:800;color:var(--primary)}
.stat-card .label{font-size:13px;color:var(--muted);margin-top:4px}

/* 登录页 */
.auth-box{max-width:400px;margin:8vh auto 0;background:#fff;border-radius:20px;padding:34px 28px;box-shadow:0 10px 40px rgba(124,58,237,.12)}
.auth-box .logo{text-align:center;font-size:24px;font-weight:800;margin-bottom:24px}
.auth-switch{text-align:center;margin-top:16px;font-size:14px;color:var(--muted)}
.auth-switch a{color:var(--primary);font-weight:600}

#toast{position:fixed;top:20px;left:50%;transform:translateX(-50%);z-index:999;pointer-events:none}
.toast-item{background:#111827;color:#fff;padding:11px 22px;border-radius:99px;margin-bottom:8px;font-size:14px;box-shadow:0 4px 16px rgba(0,0,0,.25);animation:tin .2s}
@keyframes tin{from{opacity:0;transform:translateY(-8px)}to{opacity:1}}
.spin{display:inline-block;width:16px;height:16px;border:2px solid #fff3;border-top-color:#fff;border-radius:50%;animation:sp 1s linear infinite;vertical-align:-3px;margin-right:6px}
@keyframes sp{to{transform:rotate(360deg)}}
.empty{text-align:center;color:var(--muted);padding:40px 0}
.progress-note{font-size:13px;color:var(--muted);margin-top:8px}
.mode-card{display:flex;gap:14px;align-items:flex-start;background:var(--card);border-radius:16px;padding:18px;margin-bottom:14px;text-decoration:none;color:inherit;box-shadow:0 2px 10px rgba(0,0,0,.05);border:2px solid transparent;transition:.15s}
.mode-card:active{border-color:var(--primary);transform:scale(.99)}
.mode-emoji{font-size:38px;line-height:1.2}
.mode-body{flex:1}
.mode-body b{font-size:17px}
.mode-desc{font-size:13.5px;color:var(--muted);margin:5px 0 7px;line-height:1.5}
.mode-tag{font-size:12px;color:var(--primary);background:#eef2ff;display:inline-block;padding:3px 10px;border-radius:99px}
