body { background:#eef1f6; margin:0 }
h2.title { text-align:center }
.block { width:100%; margin:10px 0!important; height:50px }
.page { padding:20px }
#app { font-family:Avenir,Helvetica,Arial,sans-serif; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; color:#2c3e50 }

.im-query-page { --im-brand:#1fa657; --im-brand-dark:#168347; --im-brand-soft:#e8f7ee; --im-border-soft:rgba(31,166,87,.38); min-height:100vh; background:linear-gradient(165deg,#d8f0e4,#eef7f1 45%,#eef2ee); padding-bottom:40px }
.top-bar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; padding:16px 18px; background:hsla(0,0%,100%,.92); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); box-shadow:0 1px 0 rgba(31,166,87,.1) }
.top-brand { display:flex; align-items:center; min-width:0 }
.logo-ring { width:44px; height:44px; border-radius:50%; padding:2px; flex-shrink:0; background:linear-gradient(145deg,#2a2a2a,#4a4a4a 40%,#1a1a1a); box-shadow:0 4px 14px rgba(0,0,0,.12) }
.logo-taiji { width:100%; height:100%; border-radius:50%; display:block; vertical-align:top }
.top-nav { display:flex; gap:10px }
.nav-pill { padding:8px 16px; border-radius:999px; font-size:14px; font-weight:600; text-decoration:none; border:2px solid var(--im-border-soft); color:var(--im-brand-dark); background:#fff; transition:all .2s }
.nav-pill:not(.active):hover { background:var(--im-brand-soft) }
.nav-pill.active { background:linear-gradient(180deg,#3dca6e 0,var(--im-brand) 100%); color:#fff; border-color:transparent; box-shadow:0 4px 12px rgba(31,166,87,.35) }
.page-body { max-width:720px; margin:0 auto; padding:20px 14px 0 }
.stepper { display:flex; justify-content:space-between; align-items:flex-start; position:relative; margin-bottom:22px; padding:0 6px }
.step-line { position:absolute; left:10%; right:10%; top:16px; height:3px; background:linear-gradient(90deg,#c8ead4,var(--im-brand-soft)); border-radius:2px; z-index:0 }
.step-item { position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:8px; flex:1; max-width:33% }
.step-dot { width:34px; height:34px; border-radius:50%; background:#fff; border:3px solid #b8e0c8; color:#90a4ae; font-size:13px; font-weight:700; display:flex; align-items:center; justify-content:center; transition:all .25s }
.step-item.done .step-dot { background:var(--im-brand); border-color:var(--im-brand); color:#fff }
.step-item.active .step-dot { background:linear-gradient(180deg,#3dca6e,var(--im-brand)); border-color:var(--im-brand-dark); color:#fff; box-shadow:0 4px 12px rgba(31,166,87,.45) }
.step-label { font-size:11px; color:#78909c; text-align:center; line-height:1.3 }
.step-item.active .step-label { color:var(--im-brand-dark); font-weight:600 }
.content-card { background:#fff; border-radius:16px; box-shadow:0 8px 32px rgba(22,131,71,.12); padding:22px 18px 26px; border:1px solid var(--im-border-soft) }
.section-block { margin-bottom:22px }
.section-title { margin:0 0 14px; font-size:16px; font-weight:700; color:#263238 }
.type-grid { display:flex; flex-wrap:wrap; gap:10px; justify-content:center }
.type-card { flex:1 1 calc(33% - 10px); min-width:96px; max-width:130px; padding:14px 8px; border:2px solid #d8f0e4; border-radius:14px; background:linear-gradient(180deg,#fafdfb,#f5faf7); cursor:pointer; transition:all .2s; display:flex; flex-direction:column; align-items:center; gap:6px }
.type-card:hover { border-color:var(--im-border-soft); transform:translateY(-2px); box-shadow:0 6px 16px rgba(31,166,87,.14) }
.type-card.selected { border-color:var(--im-brand); background:linear-gradient(180deg,var(--im-brand-soft) 0,#c8ead4 100%); box-shadow:0 4px 16px rgba(31,166,87,.22) }
.type-icon { font-size:26px; line-height:1 }
.type-name { font-size:12px; font-weight:600; color:#37474f }
.input-row { display:flex; gap:0; align-items:stretch; margin-bottom:14px; border-radius:12px; overflow:hidden; box-shadow:0 2px 12px rgba(30,60,120,.08) }
.card-input { flex:1 }
.card-input .el-input__inner { height:48px; border-radius:12px 0 0 12px; border:2px solid #d8f0e4; border-right:none; font-size:15px }
.card-input .el-input__inner:focus { border-color:var(--im-brand) }
.submit-arrow { width:50px; flex-shrink:0; border:none; background:linear-gradient(180deg,#3dca6e,var(--im-brand)); color:#fff; font-size:20px; font-weight:700; cursor:pointer }
.submit-arrow:disabled { opacity:.45; cursor:not-allowed }
.im-query-page .btn-primary,.im-query-page .btn-secondary { width:100%; height:48px; margin:0 auto 10px; display:block; border-radius:12px; font-size:15px; font-weight:600; border:none }
.btn-primary { box-shadow:0 4px 14px rgba(31,166,87,.35) }
.btn-secondary { box-shadow:0 4px 14px rgba(56,142,60,.28) }
.result-section { margin-top:8px; padding-top:20px; border-top:1px dashed #cfd8dc }
.result-panel { padding:20px 14px; background:#f7fcf9; border-radius:14px; border:1px solid #d8f0e4; text-align:center }
.qr-wrap { display:flex; justify-content:center; margin-bottom:14px }
.stat-pill { display:inline-flex; align-items:baseline; gap:10px; padding:10px 20px; background:linear-gradient(135deg,var(--im-brand-soft) 0,#f0faf4 100%); border-radius:999px; margin-bottom:14px }
.stat-label { font-size:14px; color:var(--im-brand-dark) }
.stat-num { font-size:26px; font-weight:800; color:#0d3d28 }
.link-row { width:100%; max-width:100%; margin:0 auto 14px; text-align:left }
.link-row .link-label { font-size:12px; color:#546e7a; margin-bottom:6px; font-weight:600 }
.link-input { width:100%; box-sizing:border-box; padding:10px 12px; font-size:13px; line-height:1.45; color:#263238; background:#fff; border:1px solid #c8e6c9; border-radius:10px; word-break:break-all }
.link-tip { margin:8px 0 0; font-size:12px; color:#78909c; line-height:1.45 }
.result-actions { display:flex; flex-wrap:wrap; gap:10px; justify-content:center }
.footer-hint { margin-top:16px; padding:12px 14px; background:var(--im-brand-soft); border-radius:10px; border-left:3px solid var(--im-brand); font-size:13px; color:var(--im-brand-dark); display:flex; align-items:flex-start; gap:8px; text-align:left }
.im-query-page .el-button--primary:not(.is-plain) { background:linear-gradient(180deg,#3dca6e,#1fa657); border-color:#1fa657 }
.im-query-page .el-button--primary:not(.is-plain):focus,.im-query-page .el-button--primary:not(.is-plain):hover { background:#168347; border-color:#168347 }
.im-query-page .el-button--primary.is-plain { color:#1fa657; border-color:rgba(31,166,87,.55); background:#fff }
.im-query-page .el-button--primary.is-plain:focus,.im-query-page .el-button--primary.is-plain:hover { background:#e8f7ee; border-color:#1fa657; color:#0d3d28 }
.im-query-page .btn-secondary.el-button--success { background:linear-gradient(180deg,#3dca6e,#1fa657); border-color:#1fa657 }
.im-query-page .btn-secondary.el-button--success:focus,.im-query-page .btn-secondary.el-button--success:hover { background:#168347; border-color:#168347 }
@media (max-width:520px) { .type-card { flex:1 1 42%; max-width:none }
.top-bar { flex-direction:column; align-items:stretch }
.top-nav { justify-content:center }
 }
.anti-mode-row { margin-top:16px; padding-top:14px; border-top:1px dashed rgba(31,166,87,.2); text-align:center }
.anti-mode-tip { font-size:12px; color:#999; margin-top:6px; line-height:1.5 }
.anti-mode-row .el-radio__input.is-checked .el-radio__inner { border-color:var(--im-brand); background:var(--im-brand) }
.anti-mode-row .el-radio__input.is-checked+.el-radio__label { color:var(--im-brand) }

.code-nowrap { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block; max-width:300px }
.code-count { margin:10px 0; font-size:15px; color:#606266 }
.code-count strong { color:#303133 }
.btn-row { display:flex; gap:12px; margin-bottom:16px }
.btn-row .block { flex:1 }
.btn-export { flex-shrink:0 }
.time-tabs { display:flex; gap:8px; margin-bottom:12px }
.time-tab { padding:6px 16px; border-radius:20px; border:1px solid #dcdfe6; background:#fff; color:#606266; font-size:13px; cursor:pointer; transition:all .2s }
.time-tab:hover { border-color:#409eff; color:#409eff }
.time-tab.active { background:#409eff; border-color:#409eff; color:#fff; font-weight:600 }
.time-hint { margin-top:10px; font-size:13px; color:#909399; padding:6px 10px; background:#f5f7fa; border-radius:6px; display:inline-block }

[hidden] { display: none !important; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .55; }
:focus-visible { outline: 2px solid #409eff; outline-offset: 2px; }
body { font-family: Avenir, Helvetica, Arial, sans-serif; color: #2c3e50; -webkit-font-smoothing: antialiased; }
.el-button {
 display: inline-block; padding: 12px 20px; border: 1px solid #dcdfe6;
 border-radius: 4px; background: white; color: #606266; text-decoration: none;
 box-sizing: border-box; font-size: 14px; font-weight: 500; line-height: 1;
}
.el-button--primary { background: #409eff; border-color: #409eff; color: #fff; }
.el-button--success { background: #67c23a; border-color: #67c23a; color: #fff; }
.el-button:hover:not(:disabled) { filter: brightness(.96); }
.card-input { min-width: 0; }
.el-input__inner {
 width: 100%; box-sizing: border-box; padding: 0 15px;
 outline: none; color: #606266; background: #fff;
}
.el-input__inner::placeholder, textarea::placeholder { color: #c0c4cc; }
.qr-code { position: relative; width: min(280px, 100%); aspect-ratio: 1; background: #fff; box-sizing: border-box; padding: 12px; }
.qr-code canvas, .qr-code > img { width: 100%; height: auto; display: block; }
.qr-code .qr-avatar {
 position: absolute; width: 19%; height: 19%; top: 40.5%; left: 40.5%;
 object-fit: cover; border: 3px solid white; box-sizing: border-box;
}
.anti-mode-row { margin-bottom: 16px; }
.anti-mode-row label { margin: 0 10px; color: #606266; font-size: 14px; }
.anti-mode-row input { accent-color: var(--im-brand); vertical-align: middle; margin-right: 7px; }
.anti-mode-tip { margin-bottom: 0; }
.link-input { user-select: all; }
.page textarea {
 display: block; resize: vertical; box-sizing: border-box; width: 100%; padding: 5px 15px;
 color: #606266; font-size: 14px; line-height: 1.5; border: 1px solid #dcdfe6; border-radius: 4px;
}
.page textarea:focus { outline: none; border-color: #409eff; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; color: #606266; background: #fff; font-size: 14px; }
td, th { padding: 12px 10px; border: 1px solid #ebeef5; white-space: nowrap; text-align: center; }
th { color: #909399; background: #fff; }
td:nth-child(-n+2), th:nth-child(-n+2) { text-align: left; }
.table-wrap th:first-child { width: min(300px, 38vw); }
.table-wrap th:nth-child(2):not(:last-child) { width: 110px; }
td.empty { height: 34px; text-align: center; color: #909399; }
.back { border: 0; background: transparent; color: #409eff; padding: 10px 4px; }
.btn-export { margin-left: 10px; }
.notice {
 position: fixed; z-index: 3; top: 20px; left: 50%; transform: translateX(-50%);
 box-sizing: border-box; max-width: calc(100vw - 32px); width: max-content;
 padding: 14px 18px; margin: 0; color: #f56c6c; background: #fef0f0; border: 1px solid #fde2e2; border-radius: 4px;
}
.notice.success { color: #67a63e; background: #f0f9eb; border-color: #e1f3d8; }