[v-cloak] { display: none; }
html, body { margin: 0; height: 100%; background: #f4f6f9; color: #1f2d3d;
  font-family: "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", -apple-system, sans-serif; font-size: 14px; }
#app { height: 100%; }

/* 登录 */
.login-wrap { height: 100%; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1f2d3d 0%, #2b4c7e 100%); }
.login-card { width: 360px; background: #fff; border-radius: 10px; padding: 36px 32px 24px; box-shadow: 0 12px 40px rgba(0,0,0,.25); }
.login-card h1 { font-size: 22px; margin: 0 0 6px; text-align: center; }
.login-card p { color: #80868b; text-align: center; margin: 0 0 24px; font-size: 13px; }

/* 布局 */
.layout { height: 100%; display: flex; }
.aside { width: 200px; background: #1f2d3d; display: flex; flex-direction: column; flex-shrink: 0; transition: width .2s; }
.aside .brand { color: #fff; font-size: 17px; font-weight: bold; padding: 18px 20px; background: #17222e; white-space: nowrap; overflow: hidden; }
.aside .el-menu { border-right: none; flex: 1; background: #1f2d3d; }
.aside .el-menu-item { color: #c7d0d9; height: 48px; }
.aside .el-menu-item:hover { background: #263646; }
.aside .el-menu-item.is-active { background: #2b3d51; color: #fff; border-left: 3px solid #4a90e2; padding-left: 17px !important; }
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.topbar { height: 52px; background: #fff; border-bottom: 1px solid #e4e7ed; display: flex; align-items: center; padding: 0 20px; gap: 12px; flex-shrink: 0; }
.topbar .title { font-size: 17px; font-weight: bold; flex: 1; }
.content { flex: 1; overflow: auto; padding: 16px 20px; }

.toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 12px; }
.toolbar .spacer { flex: 1; }
.panel { background: #fff; border: 1px solid #e4e7ed; border-radius: 8px; padding: 14px; }
.summary { color: #5f6368; margin: 10px 2px 0; font-size: 13px; display: flex; flex-wrap: wrap; gap: 4px 18px; align-items: center; }
.summary b { color: #1f2d3d; }

/* 统计卡片 */
.cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.card { background: #fff; border: 1px solid #e4e7ed; border-radius: 8px; padding: 14px 16px; }
.card .t { color: #5f6368; font-size: 13px; }
.card .v { font-size: 26px; font-weight: bold; margin: 6px 0 2px; font-variant-numeric: tabular-nums; }
.card .s { color: #80868b; font-size: 12px; }
@media (max-width: 1100px) { .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.num { font-variant-numeric: tabular-nums; }
.neg { color: #d93025; }
.pos { color: #188038; }
.warn { color: #e37400; }
.muted { color: #9aa0a6; }
.el-table .row-neg td { color: #d93025; }
.el-table .row-warn td { color: #e37400; }
.el-table .row-void td { color: #9aa0a6; text-decoration: line-through; }
.el-table .row-void td.no-strike, .el-table .row-void td .el-button { text-decoration: none; }
.el-table .row-dup td { color: #9aa0a6; }
.el-table .row-err td { color: #d93025; }

.quick-amts { display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap; }
.bal-tip { font-size: 13px; color: #5f6368; line-height: 1.6; }
.big { font-size: 20px; font-weight: bold; }
.form-msg { margin-top: 6px; padding: 8px 12px; border-radius: 6px; background: #e6f4ea; color: #188038; font-size: 13px; }
.form-msg.bad { background: #fce8e6; color: #d93025; }
.form-msg.mid { background: #fef7e0; color: #b06000; }
.el-dialog__body { padding-top: 6px; }

@media (max-width: 760px) {
  .aside { width: 64px; }
  .aside .brand { font-size: 0; padding: 18px 0; }
  .aside .brand::before { content: "¥"; font-size: 20px; display: block; text-align: center; }
  .aside .menu-text { display: none; }
  .content { padding: 12px; }
  .cards { grid-template-columns: minmax(0, 1fr); }
}

/* SaaS */
.login-foot { text-align: center; margin-top: 18px; font-size: 12px; color: #9aa0a6; }
.login-foot a { color: #5f6368; text-decoration: none; }
.trial-tip { font-size: 13px; color: #b06000; background: #fef7e0; padding: 4px 12px; border-radius: 14px; display: flex; align-items: center; gap: 4px; }
.trial-tip.neg { color: #d93025; background: #fce8e6; }
.who { cursor: pointer; display: flex; align-items: center; gap: 6px; }
.sub-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.sub-status { font-size: 22px; font-weight: bold; margin-top: 4px; display: flex; align-items: center; }
.plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; max-width: 980px; }
.plan { position: relative; background: #fff; border: 1px solid #e4e7ed; border-radius: 12px; padding: 24px 22px 20px; }
.plan.best { border: 2px solid #1a73e8; box-shadow: 0 6px 20px rgba(26,115,232,.12); }
.plan.current { border-color: #188038; }
.plan-badge { position: absolute; top: -12px; right: 18px; background: #1a73e8; color: #fff; font-size: 12px; padding: 3px 10px; border-radius: 10px; }
.plan-name { font-size: 16px; font-weight: bold; color: #3c4043; }
.plan-price { font-size: 34px; font-weight: bold; margin: 10px 0 2px; font-variant-numeric: tabular-nums; }
.plan-price span { font-size: 14px; color: #80868b; font-weight: normal; margin-left: 4px; }
.plan-sub { color: #5f6368; font-size: 13px; min-height: 20px; }
.plan ul { padding-left: 18px; color: #5f6368; font-size: 13px; line-height: 2; margin: 14px 0 18px; }
@media (max-width: 900px) { .plans { grid-template-columns: minmax(0, 1fr); } .who .company { display: none; } }
@media (max-width: 760px) { .trial-tip { display: none; } }

/* i18n / verify */
.lang-btn { display:inline-flex; align-items:center; gap:4px; cursor:pointer; color:#5f6368; font-size:13px; padding:4px 8px; border-radius:6px; }
.lang-btn:hover { background:#f1f3f4; }
.code-input input { text-align:center; font-size:24px; letter-spacing:10px; font-variant-numeric: tabular-nums; }
.verify-links { display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; margin-top:14px; }
[dir="rtl"] .aside .el-menu-item.is-active { border-left:none; border-right:3px solid #4a90e2; padding-left:20px !important; padding-right:17px !important; }
[dir="rtl"] .plan-badge { right:auto; left:18px; }
[dir="rtl"] .plan ul { padding-left:0; padding-right:18px; }
[dir="rtl"] .el-input-number, [dir="rtl"] .num { direction:ltr; unicode-bidi:isolate; }
.el-table th.el-table__cell > .cell { word-break: normal; overflow-wrap: normal; hyphens: auto; }
.code-input input::placeholder { letter-spacing: normal; font-size: 15px; }
@media (min-width: 761px) { .aside { width: 228px; } }
.aside .el-menu .el-menu-item { white-space: normal !important; line-height: 1.3 !important; height: auto !important; min-height: 48px; padding-top: 8px; padding-bottom: 8px; }

.resend-btn { position:relative; overflow:hidden; width:100%; height:40px; margin-top:12px; border:1px solid #4a90e2; border-radius:8px;
  background:#fff; color:#4a90e2; font-size:14px; cursor:pointer; transition:background .2s, color .2s, border-color .2s; }
.resend-btn:hover:not(:disabled) { background:#ecf5ff; }
.resend-btn:disabled { cursor:not-allowed; }
.resend-btn.waiting { border-color:#dcdfe6; color:#909399; background:#f7f8fa; }
.resend-bar { position:absolute; left:0; top:0; bottom:0; background:rgba(74,144,226,.12); transition:width .25s linear; }
.resend-btn:not(.waiting) .resend-bar { display:none; }
[dir="rtl"] .resend-bar { left:auto; right:0; }
.resend-text { position:relative; }
.resend-num { display:inline-block; min-width:2ch; color:#4a90e2; font-size:16px; font-variant-numeric:tabular-nums; }
