body{background:#f0f2f5;color:#333;font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",Helvetica,Arial,sans-serif}
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-thumb{background-color:#d0d5dd;border-radius:3px;min-height:25px;min-width:25px}
::-webkit-scrollbar-track{background-color:transparent;border-radius:3px}

#app{display:none}

/* ====== 顶部装饰头 ====== */
.ui-e-header{width:100%;height:300px;position:relative;z-index:1;background:linear-gradient(155deg,#1e40af,#3b82f6,#60a5fa);background-size:cover}
.ui-e-header::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 60% 40%,rgba(255,255,255,.08) 0%,transparent 60%)}

/* ====== 表单卡片 ====== */
.ui-form-main{max-width:860px;width:92%;min-height:200px;background:#fff;margin:-250px auto 0;z-index:6;position:relative;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,.08),0 1px 3px rgba(0,0,0,.04);overflow:hidden}
.ui-form-main-bar{height:4px;width:100%;background:linear-gradient(90deg,#3b82f6,#60a5fa,#a78bfa);overflow:hidden;box-sizing:border-box;border-radius:0;display:none}

/* ====== 表单顶部图片 ====== */
.ui-form-header{width:100%;display:block}

/* ====== 表单标题区 ====== */
.ui-form-main header{padding:32px 36px 20px;border-bottom:1px solid #f0f0f0}
.ui-form-main header h1{font-size:28px;font-weight:700;color:#1a1a1a;margin:0 0 8px;line-height:1.3}
.ui-form-main header p{font-size:14px;line-height:1.8;color:#64748b;margin:0}

/* ====== 表单主体 ====== */
.ui-block{padding:28px 36px 40px;box-sizing:border-box}
.uiitem{margin-bottom:6px;width:100%}
.uiiteminput{width:100%}

/* 表单标签 */
.el-form-item__label{font-weight:600;color:#334155;font-size:14px;line-height:2}

/* 输入框圆角统一 */
.el-input__inner,.el-textarea__inner{border-radius:8px;border-color:#e2e8f0;transition:border-color .25s,box-shadow .25s}
.el-input__inner:hover,.el-textarea__inner:hover{border-color:#cbd5e1}
.el-input__inner:focus,.el-textarea__inner:focus,.el-input.is-focus .el-input__inner{border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.1)}
.el-input-group__append,.el-input-group__prepend{border-color:#e2e8f0;border-radius:8px;background:#f8fafc;color:#64748b}
.el-input-group--prepend .el-input__inner{border-radius:0 8px 8px 0}
.el-input-group--append .el-input__inner{border-radius:8px 0 0 8px}
.el-button--default{border-color:#e2e8f0;border-radius:8px;color:#334155;transition:all .25s}
.el-button--default:hover{background:#f1f5f9;border-color:#cbd5e1;color:#1e293b}

/* ====== 提示说明文字 ====== */
.ui-e-tips{width:100%;padding:6px 0;margin:6px 0;color:#94a3b8;font-size:12px;line-height:1.6}
.ui-e-tips h2{font-size:16px;font-weight:600;line-height:1.8;color:#1e293b}
.ui-e-tips p{line-height:1.8;font-size:13px;color:#94a3b8}

/* 上传组件 */
.el-upload__tip{color:#94a3b8;font-size:12px;line-height:1.6;margin-top:6px}

/* 评分组件 */
.el-rate{position:relative;top:8px}
.el-rate__icon{font-size:22px;margin-right:4px}

/* ====== 提交按钮 ====== */
.ui-form-submit{margin:0 auto;text-align:center;padding-top:8px}
.u-e-btn-send{padding:12px 48px!important;font-size:16px!important;font-weight:600!important;letter-spacing:1px;border-radius:10px!important;background:linear-gradient(135deg,#2563eb,#3b82f6);border:none!important;box-shadow:0 4px 14px rgba(37,99,235,.3);transition:all .3s!important}
.u-e-btn-send:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(37,99,235,.4)}
.u-e-btn-send:active{transform:translateY(0)}

/* ====== 二维码 ====== */
.ui-form-qrcode{width:38px;height:38px;background:rgba(255,255,255,.9);position:absolute;right:-50px;top:0;border-radius:8px;text-align:center;line-height:38px;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.06);transition:all .25s;z-index:10}
.ui-form-qrcode:hover{background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.1)}
.ui-form-qrcode .iconfont{font-size:18px;color:#3b82f6}

.ui-form-qrcodepic{width:160px;height:190px;background:#fff;border-radius:10px;box-shadow:0 8px 30px rgba(0,0,0,.12);position:absolute;right:-60px;top:46px;display:none;z-index:20;text-align:center;padding:12px;box-sizing:border-box}
.ui-form-qrcodepic img{display:block;margin:6px auto 0;width:130px;height:130px;border-radius:6px}
.ui-form-qrcodepic p{text-align:center;font-size:12px;line-height:1.6;color:#94a3b8;margin:8px 0 0}

/* ====== 加载骨架 ====== */
.u-e-loading{max-width:90%;margin:0 auto 40px;padding:20px 0}

/* ====== 验证码 ====== */
.ui-v-code{float:right;cursor:pointer;border-radius:8px;overflow:hidden}
.ui-v-code img{width:100px;border-radius:8px;border:1px solid #e2e8f0}
.ui-e-input-code{width:78%!important}

/* ====== 单选/多选列布局 ====== */
.ui-e-column{margin:0 0 10px 0}
.el-radio-group{width:100%;overflow:hidden}
.el-radio,.el-radio__input{white-space:normal!important;line-height:22px}
.el-radio.is-bordered,.el-checkbox.is-bordered{padding:10px 16px;border-radius:8px;border-color:#e2e8f0;margin-right:8px}
.el-radio.is-bordered.is-checked{border-color:#3b82f6}
.el-checkbox.is-bordered.is-checked{border-color:#3b82f6}

/* ====== 答题卡 ====== */
.ui-e-card-switch,.ui-e-card-mask,.ui-e-close{display:none}

.ui-e-card{width:240px;height:auto;background:#fff;border-radius:12px;position:fixed;top:24px;transform:translateX(-250px);z-index:9999;padding:20px;box-sizing:border-box;box-shadow:0 8px 32px rgba(0,0,0,.12)}
.ui-e-card h2{font-size:15px;font-weight:600;color:#1e293b;margin:0 0 14px;padding-left:10px;border-left:3px solid #3b82f6}

.ui-e-card-ul{margin-top:10px;width:100%;max-height:400px;overflow-y:auto;display:flex;flex-wrap:wrap;gap:6px}
.ui-e-card-ul li{width:36px;height:36px;line-height:36px;font-size:13px;cursor:pointer;border-radius:6px;color:#475569;font-weight:600;background:#f1f5f9;text-align:center;transition:all .2s}
.ui-e-card-ul li:hover{background:#e2e8f0;transform:scale(1.05)}
.e-ok{background:#22c55e!important;color:#fff!important}
.e-ok:hover{background:#16a34a!important}

.ui-e-card .ui-e-close{width:28px;height:28px;line-height:28px;border-radius:50%;position:absolute;right:12px;top:12px;text-align:center;border:1px solid #e2e8f0;cursor:pointer;font-size:16px;color:#94a3b8;transition:all .2s}
.ui-e-card .ui-e-close:hover{background:#f1f5f9;color:#475569;border-color:#cbd5e1}

.ui-e-clear{clear:both;height:10px}

.ui-e-footer{display:flex;align-items:center;justify-content:center;gap:12px;font-size:12px;color:#64748b;margin-top:14px}
.ui-e-wd{width:14px;height:14px;display:inline-block;background:#e2e8f0;border-radius:3px}
.ui-e-ok{width:14px;height:14px;display:inline-block;background:#22c55e;border-radius:3px}

/* ====== 页脚 ====== */
.ui-page-footer{display:flex;align-items:center;justify-content:center;gap:14px;height:60px;font-size:12px;color:#94a3b8;letter-spacing:1px;user-select:none}
.ui-page-footer-line{width:32px;height:1px;background:#cbd5e1;display:inline-block;border-radius:1px}

/* ====== 成功结果页 ====== */
.ui-form-result{max-width:360px;width:90%;margin:0 auto}
.ui-form-result-spacer{height:50px}
.el-result__icon svg{width:72px;height:72px}

/* ============ 手机 ≤768px ============ */
@media(max-width:768px){
  .ui-e-header{height:200px}
  .ui-form-main{width:94%;margin:-170px auto 0;border-radius:10px;max-width:100%}
  .ui-form-main header{padding:24px 20px 16px}
  .ui-form-main header h1{font-size:22px}
  .ui-form-main header p{font-size:13px}
  .ui-block{padding:18px 18px 30px}
  .ui-block,.ui-form-main header{padding-left:18px;padding-right:18px}
  .el-form-item__label{line-height:2.2;padding-bottom:2px!important;font-size:13px}
  .ui-e-input-code{width:60%!important}
  .ui-form-qrcode{display:none}
  .ui-v-code img{width:88px}

  /* 答题卡移动端 */
  .ui-e-card{width:100%!important;right:0!important;bottom:0!important;top:unset!important;height:42vh!important;overflow:hidden;transform:none!important;border-radius:16px 16px 0 0;padding:16px 16px 20px}
  .ui-e-card-switch{display:block!important;height:40px;line-height:40px;position:fixed;left:0;top:0;width:100%;text-align:right;padding-right:20px;box-sizing:border-box;z-index:9999;background:rgba(255,255,255,.9);border-bottom:1px solid #f0f0f0;font-size:13px;color:#64748b;backdrop-filter:blur(8px)}
  .ui-e-card-switch img{height:14px;position:relative;top:2px;margin-right:4px}
  .ui-e-card-mask{width:100%;height:100%;position:fixed;z-index:9998;background:rgba(0,0,0,.45);left:0;top:0}
  .ui-e-card .ui-e-close{display:block!important}
  .ui-e-card-ul{max-height:28vh!important;overflow:auto;gap:8px}
  .ui-e-footer{position:absolute;bottom:16px;width:calc(100% - 32px);text-align:center;font-size:12px}
}

/* ============ 小手机 ≤480px ============ */
@media(max-width:480px){
  .ui-e-header{height:160px}
  .ui-form-main{width:100%;margin:-140px 0 0;border-radius:0;box-shadow:none}
  .ui-form-main header{padding:20px 16px 14px}
  .ui-form-main header h1{font-size:19px}
  .ui-form-main header p{font-size:12px}
  .ui-block{padding:14px 14px 24px}
  .el-input__inner,.el-textarea__inner{border-radius:6px;font-size:14px}
  .ui-e-tips h2{font-size:15px}
  .ui-e-tips p{font-size:12px}
  .u-e-btn-send{padding:10px 40px!important;font-size:15px!important;border-radius:8px!important}
  .ui-v-code img{width:80px}
  .ui-e-card-ul{max-height:24vh!important}
  .ui-e-card-ul li{width:32px;height:32px;line-height:32px;font-size:12px}
  .ui-page-footer{padding-bottom:env(safe-area-inset-bottom,0);height:auto;line-height:2.5;gap:10px}
  .ui-page-footer-line{width:24px}
}
