/* ============================================================
 * 后台管理 CSS 设计规范（Design Tokens）
 * 修改任何页面/表格/表单样式前，请遵循以下基线，确保一致性。
 * ============================================================
 * 颜色变量（使用处统一引用，不要写死散值）：
 *   --c-primary:#2b6cff   主色(链接/按钮/激活)
 *   --c-text:#2b3245      正文
 *   --c-muted:#9aa1b3      次要文字
 *   --c-border:#eef1f6     边框/分隔线
 *   --c-bg:#f4f6f9         页面背景
 *   --c-on:#18a058         启用/成功(绿)
 *   --c-off:#9aa1b3        停用(灰)
 * 字体：base 14px；辅助 12-13px；标题 16-20px
 * 间距：区块间距 20-22px；单元格 padding 8-14px
 * 圆角：卡片 12px；按钮/标签 6-8px；胶囊 20px
 * ------------------------------------------------------------
 * 表格布局规范（强制）：
 *   - 用 .tbl-compact（固定紧凑 padding）或 .tbl
 *   - 短文字列（状态/模式/标签）必须 white-space:nowrap，禁止折行
 *   - 列宽均匀，不留大片空白；数字列 text-align:center
 *   - 多分辨率(375/768/1280)截图核对无溢出
 * ============================================================ */
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,"Microsoft YaHei","Segoe UI",sans-serif;background:#f4f6f9;color:#2b3245;font-size:14px}
a{color:#2b6cff;text-decoration:none}
/* 登录 */
.login-body{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,#4b6cb7,#182848)}
.login-box{background:#fff;width:360px;padding:38px 34px;border-radius:14px;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.login-box h1{font-size:20px;text-align:center;color:#1f2740}
.login-box .sub{text-align:center;color:#98a0b3;margin:6px 0 22px;font-size:13px}
.login-box .field{margin-bottom:14px}
.login-box input{width:100%;height:44px;border:1px solid #dfe3ec;border-radius:8px;padding:0 14px;font-size:14px}
.login-box input:focus{border-color:#2b6cff;outline:none}
.btn-login{width:100%;height:46px;background:#2b6cff;color:#fff;border:0;border-radius:8px;font-size:16px;cursor:pointer;letter-spacing:4px}
.btn-login:hover{background:#1a5aef}
.login-err{background:#ffeef0;color:#e33;padding:10px;border-radius:8px;text-align:center;margin-bottom:14px;font-size:13px}
.login-box .tip{text-align:center;color:#b0b6c5;margin-top:16px;font-size:12px}
/* 布局 */
.layout{display:flex;min-height:100vh}
.sidebar{width:200px;background:#1f2740;color:#c4cbe0;flex-shrink:0;position:fixed;top:0;bottom:0;overflow-y:auto}
.sidebar .logo{font-size:17px;font-weight:700;color:#fff;padding:18px 20px 14px;letter-spacing:.5px;line-height:1.3}
.sidebar .logo span{display:block;font-size:11px;color:#6f7aa0;font-weight:400;letter-spacing:1.5px;margin-top:3px}
.sidebar nav{padding:2px 10px 24px}
.nav-group{font-size:11px;color:#5f6a90;padding:14px 14px 6px;letter-spacing:1.5px;text-transform:uppercase;font-weight:600;border-bottom:1px solid rgba(255,255,255,.05);margin-bottom:4px}
.sidebar nav a{display:flex;align-items:center;padding:9px 14px;color:#b8c3d9;font-size:13.5px;border-radius:7px;margin:1px 2px;transition:all .15s ease}
.sidebar nav a:hover{background:rgba(255,255,255,.08);color:#fff;transform:translateX(2px)}
.sidebar nav a.active{background:linear-gradient(135deg,#2b6cff,#1a5ae8);color:#fff;font-weight:500;box-shadow:0 2px 10px rgba(43,108,255,.35);transform:none}
.sidebar nav a .fa-solid{font-size:14px;width:20px;text-align:center;margin-right:8px;flex-shrink:0;opacity:.75;transition:opacity .15s}
.sidebar nav a:hover .fa-solid{opacity:1}
.sidebar nav a.active .fa-solid{opacity:1}
.main{flex:1;margin-left:200px;display:flex;flex-direction:column}
.topbar{height:56px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 24px;box-shadow:0 1px 4px rgba(0,0,0,.05);position:sticky;top:0;z-index:10}
.topbar .crumb{font-size:16px;font-weight:600}
.topbar .user{display:flex;align-items:center;gap:12px;color:#6b7288}
.btn-logout{color:#e35;border:1px solid #f0d0d5;padding:5px 12px;border-radius:6px;font-size:13px}
.content{padding:22px 24px}
/* 卡片统计 */
.cards{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:20px}
.card{background:#fff;border-radius:12px;padding:18px;text-align:center;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.card .num{font-size:28px;font-weight:700;color:#2b6cff}
.card .lbl{color:#8b93a7;font-size:13px;margin-top:4px}
/* 面板 */
.panel{background:#fff;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.04);margin-bottom:20px;overflow:hidden}
.panel-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.panel-hd{padding:14px 18px;font-weight:600;border-bottom:1px solid #eef1f6}
/* 表格 */
.tbl{width:100%;border-collapse:collapse}
.tbl th,.tbl td{padding:11px 14px;text-align:left;border-bottom:1px solid #f0f2f7;font-size:13px;vertical-align:middle}
.tbl th{background:#fafbfd;color:#6b7288;font-weight:600}
.tbl tr:hover td{background:#fafcff}
.tbl .empty{text-align:center;color:#aab;padding:40px}
.small{font-size:12px}.muted{color:#9aa1b3}.win{color:#e8443c}
.dot{display:inline-block;padding:2px 9px;border-radius:20px;font-size:12px}
.dot.on{background:#e6f7ed;color:#18a058}.dot.off{background:#f2f3f6;color:#9aa1b3}
.tag{display:inline-block;padding:2px 9px;border-radius:6px;font-size:12px;color:#fff;background:#8a94ff}
.tag-wheel{background:#ff7a45}.tag-grid9{background:#36cfc9}.tag-tiger{background:#9254de}.tag-eggs{background:#f5528b}.tag-shake{background:#40a9ff}
.ops{white-space:nowrap}
.op{display:inline-block;margin-right:8px;color:#2b6cff;font-size:13px}
.op.del{color:#e35}
.op.clone{color:#2e9e44;font-weight:600}
/* 工具条 */
.toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:12px;flex-wrap:wrap}
.filters{display:flex;gap:8px;flex-wrap:wrap}
.chip{padding:6px 14px;background:#fff;border-radius:20px;color:#6b7288;font-size:13px;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.chip.on{background:#2b6cff;color:#fff}
/* 二级分类下拉选择器 */
.mode-select{height:38px;min-width:180px;border:1.5px solid #dfe3ec;border-radius:10px;padding:0 12px;font-size:14px;color:#2b3245;background:#fff;cursor:pointer;outline:none;transition:border-color .2s}
.mode-select:focus{border-color:#2b6cff;box-shadow:0 0 0 3px rgba(43,108,255,.1)}
.mode-select optgroup{font-weight:700;color:#6b7288;font-size:12.5px;background:#f8fafc}
.mode-select option{padding:4px 8px;font-size:13.5px}
/* 只看有中奖 */
.win-only{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:#555;cursor:pointer;white-space:nowrap;margin-left:4px;padding:4px 10px;border:1.5px solid #e8ecf2;border-radius:8px;background:#fafbfd;user-select:none;transition:all .15s}
.win-only:hover{border-color:#c5dbff;background:#f0f6ff}
.win-only input[type=checkbox]{width:16px;height:16px;accent-color:#e73c3c;cursor:pointer}
.subbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;background:#fff;padding:12px 16px;border-radius:10px}
.inline-form{display:flex;align-items:center;gap:14px}
.inline-form select{height:36px;border:1px solid #dfe3ec;border-radius:8px;padding:0 10px}
/* 按钮 */
.btn{display:inline-block;padding:8px 16px;border-radius:8px;font-size:14px;cursor:pointer;border:0;text-align:center}
.btn-primary{background:#2b6cff;color:#fff}.btn-primary:hover{background:#1a5aef}
.btn-plain{background:#eef1f7;color:#4b5266}.btn-plain:hover{background:#e3e8f2}
.btn-lg{padding:11px 26px;font-size:15px}
.btn-ghost{background:#fff;color:#2b6cff;border:1.5px solid #c5dbff}
.btn-ghost:hover{background:#f0f6ff}
.btn-sm{padding:5px 12px;font-size:13px}
.btn-xs{padding:2px 8px;font-size:11px;border-radius:5px}
.btn-danger{background:#e35;color:#fff}.btn-danger:hover{background:#d24}
/* 开关式切换（允许/禁止读取） */
.switch{display:inline-flex;align-items:center;gap:8px;margin-left:12px;cursor:pointer;user-select:none;white-space:nowrap}
.switch input{position:absolute;opacity:0;width:0;height:0}
.switch-track{position:relative;width:38px;height:20px;border-radius:20px;background:#d7dbe6;transition:background .18s;flex-shrink:0}
.switch-thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .18s}
.switch input:checked + .switch-track{background:#18a058}
.switch input:checked + .switch-track .switch-thumb{transform:translateX(18px)}
.switch-text{font-size:13px;color:#6b7288}
.switch input:checked ~ .switch-text{color:#18a058}
.sec-tip{font-weight:400;font-size:12px;color:#a3a9ba;margin-left:10px}
.sec-sub{font-weight:400;font-size:13px;color:#9aa0b2}
/* 表单 */
.form{max-width:900px}
.form-section{background:#fff;border-radius:12px;padding:6px 22px 18px;margin-bottom:18px;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.sec-title{font-weight:600;font-size:15px;padding:16px 0 12px;border-bottom:1px solid #f0f2f7;margin-bottom:14px;color:#1f2740}
.row{display:flex;align-items:flex-start;padding:9px 0}
.row>label{width:auto;min-width:86px;flex-shrink:0;color:#6b7288;padding-top:8px;text-align:right;padding-right:12px;white-space:nowrap}
.row .ctrl{flex:1}
.row input[type=text],.row input[type=number],.row input[type=datetime-local],.row select,.row textarea{border:1px solid #dfe3ec;border-radius:8px;padding:9px 12px;font-size:14px;width:100%;max-width:420px}
.row textarea{max-width:560px;resize:vertical}
.row input.w120{width:120px}.row input.w80{width:80px}.row input.w70{width:70px}.row input.w60{width:60px}.row input.w140{width:140px}
.row .hint{color:#a3a9ba;font-size:12px;margin-top:5px}
/* 4列等宽表单网格（奖品类型/权重/总量/等级） */
.form-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:end}
.form-grid-4 .fg-cell{display:flex;flex-direction:column;gap:5px}
.form-grid-4 .fg-cell>label{font-size:13.5px;color:#374151;font-weight:600;white-space:nowrap}
.form-grid-4 .fg-cell input,
.form-grid-4 .fg-cell select{height:36px;border:1px solid #dfe3ec;border-radius:8px;padding:0 10px;font-size:13.5px;width:100%;box-sizing:border-box;background:#fff;color:#2b3245;transition:border-color .2s,box-shadow .2s;outline:none}
.form-grid-4 .fg-cell input:focus,.form-grid-4 .fg-cell select:focus{border-color:#2b6cff;box-shadow:0 0 0 3px rgba(43,108,255,.1)}
.form-grid-4 .fg-cell input::placeholder{color:#b0b7c5}
.radio{display:inline-flex;align-items:center;gap:5px;margin-right:20px;cursor:pointer;padding-top:6px}
.req{color:#e35}
.thumb{margin-top:8px}.thumb img{max-width:120px;border-radius:8px;border:1px solid #eee}
.form-actions{padding:8px 0 30px}
.form-actions .btn{margin-right:12px}
/* 模式选择 */
.mode-picker{display:flex;gap:12px;flex-wrap:wrap;padding:6px 0 4px}
.mp-item{display:flex;flex-direction:column;align-items:center;gap:8px;width:110px;padding:16px 6px;border:2px solid #eef1f6;border-radius:12px;cursor:pointer;position:relative}
.mp-item.on{border-color:#2b6cff;background:#f4f8ff}
.mp-item input{position:absolute;opacity:0}
.mp-ico,.mi-ico{width:48px;height:48px;border-radius:12px;background:#f0f2f7 center/contain no-repeat}
.mode-grid{display:flex;gap:14px;flex-wrap:wrap;padding:16px 18px}
.mode-item{display:flex;flex-direction:column;align-items:center;gap:8px;width:120px;padding:20px 8px;border-radius:12px;background:#fafbfd;color:#4b5266}
.mode-item:hover{background:#f0f6ff}
.mi-name{font-size:13px}
.mi-wheel{background:url('/pic/mode_wheel.png') center/contain no-repeat}.mi-grid9{background:url('/pic/mode_grid9.png') center/contain no-repeat}.mi-tiger{background:url('/pic/mode_tiger.png') center/contain no-repeat}.mi-eggs{background:url('/pic/mode_eggs.png') center/contain no-repeat}.mi-shake{background:url('/pic/mode_shake.png') center/contain no-repeat}
/* 提示 */
.alert{padding:12px 16px;border-radius:8px;margin-bottom:16px;background:#fff7e6;color:#d48806;border:1px solid #ffe7ba}
.alert.ok{background:#e6f7ed;color:#18a058;border-color:#b7ebc6}
.alert.info{background:#e8f2ff;color:#2b6cff;border-color:#c5dbff}
/* 奖品表 */
.prize-tbl input,.prize-tbl select{border:1px solid #dfe3ec;border-radius:6px;padding:6px 8px;font-size:13px;width:100%}
.prize-tbl .prob{font-weight:600;color:#2b6cff}
.prize-foot{padding:14px 18px;display:flex;gap:12px;border-top:1px solid #f0f2f7}
/* 分页 */
.pager{padding:14px 18px;display:flex;gap:6px}
.pager a{padding:6px 12px;border-radius:6px;background:#f2f4f8;color:#4b5266}
.pager a.on{background:#2b6cff;color:#fff}
/* 二维码（参考原版：居中大图 + 提示 + 链接栏 + 复制按钮） */
.qr-wrap{max-width:420px;margin:0 auto;text-align:center;padding:30px 20px 10px}
.qr-img-box{display:inline-block;background:#fff;border:1px solid #e0e0e0;border-radius:12px;padding:14px;box-shadow:0 2px 8px rgba(0,0,0,.06);margin-bottom:18px}
.qr-img-box img{display:block}
.qr-hint{color:#666;font-size:13px;line-height:1.7;margin-bottom:16px;padding:0 10px}
.link-bar{display:flex;align-items:center;gap:10px;background:#f5f7fa;border:1px solid #dfe3ec;border-radius:8px;padding:10px 12px;margin-bottom:16px}
.link-text{flex:1;font-size:12.5px;color:#333;word-break:break-all;line-height:1.4;overflow:hidden}
.btn-copy{white-space:nowrap;background:#1890ff;color:#fff;border:none;border-radius:6px;padding:7px 18px;font-size:13px;font-weight:600;cursor:pointer;transition:background .25s}
.btn-copy:hover{background:#40a9ff}
.qr-actions{display:flex;justify-content:center;gap:12px}
.qr-actions .btn-plain{font-size:13px}
/* 媒体文件列表（音乐/音效） */
.media-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.media-item{display:inline-flex;align-items:center;gap:6px;background:#f8f9fb;border:1px solid #dfe3ec;border-radius:8px;padding:6px 10px;font-size:12.5px;transition:all .2s;cursor:pointer}
.media-item.del-marked{background:#fff1f0;border-color:#ffa39e;text-decoration:line-through;opacity:.65}
.media-cb{width:15px;height:15px;cursor:pointer;flex-shrink:0;accent-color:#1890ff}
.media-name{max-width:150px;overflow:hidden;text-nowrap:text-overflow:ellipsis;color:#333;font-weight:500}
.media-item.del-marked .media-name{color:#999}
.media-size{color:#999;font-size:11px;min-width:36px}
.btn-media-play,.btn-media-del{width:24px;height:24px;border:none;border-radius:50%;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:11px;line-height:1;transition:all .2s}
.btn-media-play{background:#e6f7ff;color:#1890ff;border:1px solid #91d5ff}
.btn-media-play:hover{background:#1890ff;color:#fff}
.btn-media-del{background:#fff1f0;color:#ff4d4f;border:1px solid #ffa39e}
.btn-media-del:hover{background:#ff4d4f;color:#fff}
/* 转盘抽奖模式（参与模式） */
#join-mode-picker{display:flex;flex-wrap:wrap;gap:10px;padding:4px 0 2px;align-items:center}
#join-mode-picker label.radio{display:inline-flex;align-items:center;gap:5px;padding:8px 14px;border:1.5px solid #dfe3ec;border-radius:8px;cursor:pointer;transition:all .2s;background:#fafbfd;font-size:13.5px;font-weight:500;margin:0}
#join-mode-picker label.radio:hover{border-color:#91d5ff;background:#e6f7ff}
#join-mode-picker label.radio input[type="radio"]{margin:0;cursor:pointer}
.jm-desc-box{background:#f8f9fb;border:1px solid #eef1f6;border-radius:8px;padding:12px 16px;margin-top:10px}
.jm-desc{font-size:13px;color:#555;line-height:1.7;margin:0}
.jm-desc strong{color:#1f2740}
.jm-qrcode-fields{margin-top:4px}
.row input.w240{width:240px}
/* 富文本编辑器 */
#custom_content_editor{width:100%;min-height:200px;font-size:14px;line-height:1.6;padding:8px;border:1px solid #dfe3ec;border-radius:6px}
@media(max-width:1100px){.cards{grid-template-columns:repeat(3,1fr)}}
