* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; }
input, textarea { -webkit-user-select:text; user-select:text; }
img { -webkit-touch-callout:default !important; -webkit-user-select:auto !important; user-select:auto !important; }
:root { --pri:#4A6CF7; --pri-l:#6B8AFC; --green:#52c41a; --red:#ff4d4f; --gold:#FFD700; --silver:#C0C0C0; --bronze:#CD7F32; }
body {
  font-family:-apple-system,'PingFang SC','Microsoft YaHei',sans-serif;
  background:#f0f2f5; color:#333; font-size:14px;
  display:flex; justify-content:center; min-height:100vh;
  overscroll-behavior:none;
}
#app {
  width:100%; max-width:420px; height:100vh; height:100dvh; background:#f5f6fa;
  position:relative; display:flex; flex-direction:column; overflow-y:auto;
  -webkit-overflow-scrolling:touch; scroll-behavior:smooth;
}
@media(min-width:480px){ #app { box-shadow:0 0 40px rgba(0,0,0,0.1); } }

/* 通用 */
.hide { display:none !important; }

/* 页面切换动画 */
@keyframes pageIn { from{opacity:0;transform:translateX(16px)} to{opacity:1;transform:none} }
@keyframes pageBack { from{opacity:0;transform:translateX(-16px)} to{opacity:1;transform:none} }
.page-enter { animation:pageIn .22s ease-out; }
.page-back { animation:pageBack .22s ease-out; }

/* 淡入（非导航场景） */
.fade-in { animation:fadeIn .2s ease-out; }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }

/* 状态栏 */
.topbar {
  height:48px; display:flex; align-items:center; justify-content:space-between;
  padding:0 16px; background:#fff; border-bottom:1px solid #f0f0f0; flex-shrink:0;
  position:sticky; top:0; z-index:100;
}
.topbar .title { font-size:17px; font-weight:700; }
.topbar .back { font-size:22px; color:var(--pri); cursor:pointer; padding:4px 8px; }
.topbar .spacer { width:28px; }

/* 底部导航 */
.bottomnav {
  height:58px; background:#fff; border-top:1px solid #eee; display:flex;
  align-items:center; justify-content:space-around; flex-shrink:0;
  position:sticky; bottom:0; z-index:100; margin-top:auto;
}
.nav-item { display:flex; flex-direction:column; align-items:center; gap:2px; cursor:pointer; padding:4px 12px; transition:opacity .15s; }
.nav-item:active { opacity:.5; }
.nav-item .ic { font-size:20px; line-height:1; }
.nav-item .lb { font-size:10px; color:#999; }
.nav-item.active .ic, .nav-item.active .lb { color:var(--pri); font-weight:600; }

/* 按钮 */
.btn { border:none; border-radius:10px; padding:12px 20px; font-size:15px; font-weight:600; cursor:pointer; transition:opacity .1s,transform .1s; }
.btn-pri { background:var(--pri); color:#fff; }
.btn-green { background:var(--green); color:#fff; }
.btn-red { background:var(--red); color:#fff; }
.btn-out { background:#fff; color:var(--pri); border:1.5px solid var(--pri); }
.btn-gray { background:#f0f0f0; color:#666; }
.btn:active { opacity:.7; transform:scale(.97); }
.btn-block { width:100%; }

/* 输入框 */
.input { width:100%; height:44px; border:1.5px solid #eee; border-radius:10px; padding:0 14px; font-size:15px; outline:none; transition:border .2s; }
.input:focus { border-color:var(--pri); }

/* ========== 登录页 ========== */
.login-page { background:linear-gradient(135deg,var(--pri),var(--pri-l)); min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:40px 24px; }
.login-logo { background:#fff; width:72px; height:72px; border-radius:18px; display:flex; align-items:center; justify-content:center; font-size:32px; margin-bottom:16px; }
.login-title { color:#fff; font-size:21px; font-weight:700; }
.login-sub { color:rgba(255,255,255,.8); font-size:13px; margin-top:4px; margin-bottom:32px; }
.login-card { width:100%; background:#fff; border-radius:16px; padding:24px 20px; }
.role-tabs { display:flex; gap:6px; margin-bottom:20px; }
.role-tab { flex:1; text-align:center; padding:8px 4px; border-radius:8px; font-size:12px; color:#999; border:1.5px solid #eee; cursor:pointer; }
.role-tab.active { background:var(--pri); color:#fff; border-color:var(--pri); }
.field { margin-bottom:14px; }
.field label { font-size:12px; color:#999; display:block; margin-bottom:5px; }
.code-row { display:flex; gap:8px; }
.code-row .input { flex:1; }
.code-btn { white-space:nowrap; background:#f0f4ff; color:var(--pri); border:none; border-radius:10px; padding:0 14px; font-size:13px; cursor:pointer; }
.login-hint { text-align:center; margin-top:14px; font-size:12px; color:#999; line-height:1.6; }
.test-accounts { margin-top:16px; padding:12px; background:#f9f9f9; border-radius:10px; font-size:12px; color:#666; line-height:1.8; }
.test-accounts b { color:var(--pri); }

/* ========== 首页 ========== */
.home-header { background:linear-gradient(135deg,var(--pri),var(--pri-l)); padding:12px 20px 18px; color:#fff; border-radius:0 0 20px 20px; }
.home-top { display:flex; justify-content:space-between; align-items:center; }
.home-top .class-name { font-size:17px; font-weight:700; }
.home-top .date { font-size:12px; opacity:.85; margin-top:3px; }
.home-avatar { width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.25); display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:600; }
.stat-cards { display:flex; gap:8px; margin-top:14px; }
.stat-card { flex:1; background:rgba(255,255,255,.15); border-radius:10px; padding:10px 6px; text-align:center; }
.stat-card .n { font-size:20px; font-weight:700; }
.stat-card .l { font-size:10px; opacity:.85; margin-top:1px; }

.quick-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; padding:16px; }
.q-item { display:flex; flex-direction:column; align-items:center; gap:5px; cursor:pointer; }
.q-icon { width:46px; height:46px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:20px; }
.q-label { font-size:11px; color:#555; }

.sec-title { font-size:15px; font-weight:700; padding:0 16px; margin-bottom:10px; display:flex; justify-content:space-between; align-items:center; }
.sec-title .more { font-size:12px; color:#999; font-weight:400; cursor:pointer; }

.rank-preview { padding:0 16px 16px; }
.rank-row { display:flex; align-items:center; gap:10px; padding:10px 12px; background:#fff; border-radius:10px; margin-bottom:6px; transition:background .12s; }
.rank-row:active { background:#f5f5fa; }
.rank-badge { width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; flex-shrink:0; }
.rank-badge.g { background:var(--gold); color:#8B6914; }
.rank-badge.s { background:var(--silver); color:#555; }
.rank-badge.b { background:var(--bronze); color:#fff; }
.rank-badge.n { background:#f0f0f0; color:#999; }
.rank-name { flex:1; font-size:14px; }
.rank-score { font-size:15px; font-weight:700; color:var(--pri); text-align:right; }
.rank-delta { font-size:11px; }

/* ========== 评分录入 ========== */
.score-date-bar { display:flex; align-items:center; justify-content:space-between; padding:10px 16px; background:#fff; flex-shrink:0; }
/* 评分操作区（评分项/学科/分值栏）悬浮在顶栏下方 */
.score-tools { position:sticky; top:48px; z-index:60; background:#fff; box-shadow:0 2px 6px rgba(0,0,0,0.04); }
.date-nav { display:flex; align-items:center; gap:8px; }
.date-nav .arrow { font-size:18px; color:var(--pri); cursor:pointer; }
.date-text { font-size:15px; font-weight:600; }
.score-tabs { display:flex; gap:0; padding:0 16px 10px; background:#fff; overflow-x:auto; flex-shrink:0; }
.score-tab { white-space:nowrap; padding:6px 12px; border-radius:20px; font-size:12px; color:#666; background:#f0f0f0; margin-right:6px; cursor:pointer; flex-shrink:0; }
.score-tab.active { background:var(--pri); color:#fff; }
.score-tab.neg.active { background:var(--red); }
.subj-row { display:flex; gap:5px; padding:8px 16px; background:#fff; overflow-x:auto; border-bottom:1px solid #f0f0f0; flex-shrink:0; }
.subj-chip { padding:4px 10px; border-radius:14px; font-size:12px; background:#f5f6fa; color:#666; cursor:pointer; flex-shrink:0; border:1px solid transparent; }
.subj-chip.active { background:#e8efff; color:var(--pri); border-color:var(--pri); }
.score-hint { text-align:center; padding:6px; font-size:12px; color:#999; background:#fff; border-bottom:1px solid #f0f0f0; flex-shrink:0; }
.score-hint .v { color:var(--pri); font-weight:700; }

/* 自定义分值栏 */
.score-bar { display:flex; align-items:center; gap:8px; padding:8px 12px; background:#fff; border-bottom:1px solid #f0f0f0; flex-shrink:0; }
.score-bar .bar-label { font-size:12px; color:#666; font-weight:600; white-space:nowrap; }
.score-bar .bar-presets { display:flex; gap:5px; overflow-x:auto; flex:1; }
.delta-chip { padding:5px 12px; border-radius:16px; font-size:13px; font-weight:600; background:#f0f4ff; color:var(--pri); cursor:pointer; border:1.5px solid transparent; white-space:nowrap; }
.delta-chip.active { background:var(--pri); color:#fff; }
.delta-chip.neg { background:#fff1f0; color:var(--red); }
.delta-chip.neg.active { background:var(--red); color:#fff; }
.delta-input { width:64px; height:32px; border:1.5px solid #eee; border-radius:8px; text-align:center; font-size:14px; font-weight:600; color:var(--pri); outline:none; flex-shrink:0; }
.delta-input:focus { border-color:var(--pri); }
.delta-input::placeholder { color:#bbb; font-weight:400; font-size:12px; }

/* 加减分按钮 */
.sign-btns { display:flex; gap:6px; flex-shrink:0; }
.sign-btn { padding:5px 14px; border-radius:16px; font-size:13px; font-weight:600; border:1.5px solid #ddd; background:#fff; color:#666; cursor:pointer; white-space:nowrap; transition:all .15s; }
.sign-btn.plus.active { background:var(--green); border-color:var(--green); color:#fff; }
.sign-btn.minus.active { background:var(--red); border-color:var(--red); color:#fff; }

/* 学生卡片总分 */
.s-total { font-size:12px; font-weight:700; color:var(--pri); margin-top:2px; }
.s-total .old-score { font-size:10px; color:#ccc; font-weight:400; }

.group-list { padding:10px; flex:1; }
.group-card { background:#fff; border-radius:12px; padding:12px; margin-bottom:8px; }
.group-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.group-head .gtitle { font-size:14px; font-weight:700; }
.gno { background:var(--pri); color:#fff; padding:2px 7px; border-radius:5px; font-size:12px; margin-right:5px; }
.mini-btn { padding:4px 10px; border-radius:6px; font-size:11px; cursor:pointer; border:1px solid #ddd; }
.mini-btn.plus { color:var(--green); border-color:var(--green); }
.s-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.s-cell { background:#f9f9f9; border-radius:8px; padding:10px 4px; text-align:center; cursor:pointer; transition:transform .1s,background .1s; border:2px solid transparent; position:relative; }
.s-cell:active { transform:scale(.90); background:#eef; }
.s-cell.done { background:#f0f9eb; border-color:var(--green); }
.s-cell.pending { background:#fff8e8; border-color:#faad14; }
.s-cell.pending.done { background:#f6ffed; border-color:#faad14; }
.s-cell .sn { font-size:13px; font-weight:500; }
.s-cell .ss { font-size:10px; color:#999; margin-top:2px; }
.s-cell .badge { position:absolute; top:-5px; right:-5px; background:var(--green); color:#fff; font-size:10px; font-weight:700; min-width:16px; height:16px; border-radius:8px; padding:0 3px; display:flex; align-items:center; justify-content:center; }
.s-cell .badge.neg { background:var(--red); }
.s-cell .badge.pending-badge { background:#faad14; }

/* 保存栏 */
.save-bar { display:flex; align-items:center; gap:16px; padding:12px 16px; background:#fff; border-top:2px solid var(--pri); flex-shrink:0; position:sticky; bottom:58px; z-index:90; box-shadow:0 -2px 12px rgba(0,0,0,0.12); }
.save-bar .save-count { font-size:14px; color:var(--pri); font-weight:600; flex:1; }
.save-bar .btn-cancel-pending { padding:10px 20px; border-radius:10px; background:#f0f0f0; color:#666; font-size:14px; border:none; cursor:pointer; white-space:nowrap; }
.save-bar .btn { padding:10px 28px; font-size:15px; }

/* 自定义添加按钮 */
.add-tab { white-space:nowrap; padding:6px 14px; border-radius:20px; font-size:12px; color:var(--pri); background:#e8efff; margin-right:6px; cursor:pointer; flex-shrink:0; border:1px dashed var(--pri); }
.add-chip { padding:4px 12px; border-radius:14px; font-size:12px; color:var(--pri); background:#e8efff; cursor:pointer; flex-shrink:0; border:1px dashed var(--pri); }
.add-inline { display:flex; gap:6px; align-items:center; padding:6px 16px; background:#fff; flex-shrink:0; }
.add-inline input { height:32px; border:1.5px solid var(--pri); border-radius:8px; padding:0 10px; font-size:13px; outline:none; }
.add-inline .add-confirm { padding:4px 12px; border-radius:8px; background:var(--pri); color:#fff; font-size:12px; border:none; cursor:pointer; white-space:nowrap; }
.add-inline .add-cancel { padding:4px 10px; border-radius:8px; background:#f0f0f0; color:#666; font-size:12px; border:none; cursor:pointer; white-space:nowrap; }

/* ========== 日明细页 ========== */
.daily-toolbar { display:flex; align-items:center; justify-content:space-between; padding:10px 16px; background:#fff; border-bottom:1px solid #f0f0f0; flex-shrink:0; }
.daily-sorts { display:flex; gap:6px; padding:8px 12px; background:#fff; overflow-x:auto; flex-shrink:0; border-bottom:1px solid #f0f0f0; }
.ds-chip { white-space:nowrap; padding:5px 12px; border-radius:16px; font-size:12px; background:#f5f6fa; color:#666; cursor:pointer; flex-shrink:0; border:1px solid transparent; }
.ds-chip.active { background:#e8efff; color:var(--pri); border-color:var(--pri); font-weight:600; }
.daily-list { padding:10px; flex:1; }
.daily-card { background:#fff; border-radius:12px; padding:12px; margin-bottom:8px; }
.daily-head { display:flex; align-items:center; gap:10px; cursor:pointer; }
.d-gno { width:26px; height:26px; border-radius:6px; background:var(--pri); color:#fff; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; flex-shrink:0; }
.d-name { flex:1; font-size:15px; font-weight:600; }
.d-total { font-size:18px; font-weight:700; color:var(--pri); }
.d-total-lb { font-size:11px; color:#999; font-weight:400; margin-left:2px; }
.daily-stats { display:flex; gap:8px; margin-top:10px; }
.ds-box { flex:1; text-align:center; border-radius:8px; padding:6px 4px; }
.ds-box .ds-v { font-size:15px; font-weight:700; display:block; }
.ds-box .ds-l { font-size:10px; color:#999; }
.daily-recs { margin-top:8px; padding-top:8px; border-top:1px solid #f5f5f5; }
.d-rec { display:flex; align-items:center; gap:8px; padding:5px 2px; font-size:13px; }
.d-rec-item { flex:1; color:#333; }
.d-rec-delta { font-weight:700; }
.d-rec-delta.pos { color:var(--green); }
.d-rec-delta.neg { color:var(--red); }
.d-rec-by { font-size:11px; color:#999; }

/* ========== 排名页 ========== */
.rank-tabs { display:flex; background:#fff; flex-shrink:0; }
.r-tab { flex:1; text-align:center; padding:12px; font-size:14px; color:#666; cursor:pointer; border-bottom:2px solid transparent; }
.r-tab.active { color:var(--pri); border-bottom-color:var(--pri); font-weight:600; }
.rank-list { padding:10px; flex:1; }
.rank-card { display:flex; align-items:center; gap:10px; background:#fff; border-radius:10px; padding:12px; margin-bottom:6px; transition:background .12s; }
.rank-card:active { background:#f5f5fa; }
.rank-card .rnum { width:28px; text-align:center; font-size:17px; font-weight:700; color:#999; }
.rank-card.top1 .rnum { color:var(--gold); } .rank-card.top2 .rnum { color:var(--silver); } .rank-card.top3 .rnum { color:var(--bronze); }
.rank-card .rinfo { flex:1; }
.rank-card .rname { font-size:14px; font-weight:600; }
.rank-card .rgrp { font-size:12px; color:#999; margin-top:1px; }
.rank-card .rscore { font-size:16px; font-weight:700; color:var(--pri); }
.rank-card .rdelta { font-size:11px; padding:1px 6px; border-radius:4px; margin-left:4px; }
.rdelta.up { background:#f6ffed; color:var(--green); }
.rdelta.dn { background:#fff1f0; color:var(--red); }
.rdelta.no { color:#999; }

.gr-card { background:#fff; border-radius:10px; padding:12px; margin-bottom:6px; }
.gr-head { display:flex; align-items:center; justify-content:space-between; }
.gr-head .gl { display:flex; align-items:center; gap:8px; }
.gr-head .gr-no { background:var(--pri); color:#fff; padding:3px 10px; border-radius:6px; font-size:13px; }
.gr-head .gr-rank { font-size:18px; }
.gr-stats { display:flex; gap:12px; margin-top:8px; padding-top:8px; border-top:1px solid #f5f5f5; }
.gr-stat { text-align:center; flex:1; }
.gr-stat .gv { font-size:15px; font-weight:700; }
.gr-stat .gl2 { font-size:11px; color:#999; }

/* ========== 小组管理 ========== */
.gm-block { background:#fff; border-radius:12px; padding:12px; margin:0 10px 8px; border:2px solid transparent; }
.gm-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.gm-header .gt { font-size:14px; font-weight:700; }
.gm-header .gc { font-size:12px; color:#999; }
.gm-header .gc .cn { color:var(--pri); font-weight:600; }
.gm-member { display:inline-flex; align-items:center; gap:6px; background:#eef1fa; border-radius:20px; padding:8px 16px; margin:4px; font-size:16px; cursor:pointer; border:2px solid transparent; transition:border-color .12s, opacity .12s; -webkit-user-select:none; user-select:none; }
.gm-member.dragging { opacity:.4; border-color:var(--pri); }
.gm-member.drag-over { border-color:var(--pri); background:#e8efff; }
.gm-member .rm { color:var(--red); font-size:16px; cursor:pointer; margin-left:4px; }
.ungrouped { background:#fff3f3; border-radius:12px; padding:10px; margin:0 10px 8px; }
.ungrouped .ut { font-size:12px; color:var(--red); margin-bottom:6px; font-weight:600; }

/* ========== 授权管理 ========== */
.auth-card { display:flex; align-items:center; gap:10px; background:#fff; border-radius:10px; padding:12px; margin:0 10px 6px; }
.auth-avatar { width:38px; height:38px; border-radius:50%; background:#f0f4ff; display:flex; align-items:center; justify-content:center; font-size:16px; }
.auth-info { flex:1; }
.auth-name { font-size:14px; font-weight:600; }
.auth-sub { font-size:12px; color:#999; margin-top:1px; }
.auth-toggle { width:40px; height:22px; border-radius:11px; background:var(--pri); position:relative; cursor:pointer; transition:background .2s; }
.auth-toggle .knob { position:absolute; top:2px; right:2px; width:18px; height:18px; background:#fff; border-radius:50%; transition:all .2s; }
.auth-toggle.off { background:#ddd; }
.auth-toggle.off .knob { right:auto; left:2px; }

/* ========== 学生详情 ========== */
.sd-header { background:linear-gradient(135deg,var(--pri),var(--pri-l)); padding:16px 20px; color:#fff; text-align:center; }
.sd-avatar { width:56px; height:56px; border-radius:50%; background:rgba(255,255,255,.25); display:flex; align-items:center; justify-content:center; font-size:24px; margin:0 auto 8px; }
.sd-name { font-size:16px; font-weight:600; }
.sd-group { font-size:12px; opacity:.85; margin-top:2px; }
.sd-score { font-size:32px; font-weight:700; margin-top:10px; }
.sd-label { font-size:13px; opacity:.85; }
.sd-rank { display:inline-block; background:rgba(255,255,255,.2); padding:3px 12px; border-radius:14px; font-size:12px; margin-top:8px; }
.trend-card { background:#fff; border-radius:12px; padding:14px; margin:10px; }
.trend-title { font-size:14px; font-weight:600; margin-bottom:10px; }
.trend-bars { display:flex; align-items:flex-end; gap:3px; height:80px; overflow-x:auto; }
.tbar { min-width:24px; flex:1; background:var(--pri); border-radius:3px 3px 0 0; min-height:4px; position:relative; }
.tbar .bv { position:absolute; top:-14px; left:50%; transform:translateX(-50%); font-size:9px; color:#666; }
.tbar .bl { position:absolute; bottom:-14px; left:50%; transform:translateX(-50%); font-size:8px; color:#999; white-space:nowrap; }
.dl-item { display:flex; align-items:center; gap:8px; padding:10px 12px; background:#fff; border-radius:8px; margin:0 10px 5px; }
.dl-time { font-size:11px; color:#999; width:44px; flex-shrink:0; }
.dl-info { flex:1; }
.dl-item-n { font-size:13px; }
.dl-by { font-size:11px; color:#999; }
.dl-score { font-size:15px; font-weight:700; }
.dl-score.pos { color:var(--green); }
.dl-score.neg { color:var(--red); }

/* ========== 个人中心 ========== */
.prof-header { background:linear-gradient(135deg,var(--pri),var(--pri-l)); padding:20px; color:#fff; text-align:center; }
.prof-avatar { width:60px; height:60px; border-radius:50%; background:rgba(255,255,255,.25); display:flex; align-items:center; justify-content:center; font-size:28px; margin:0 auto 8px; }
.prof-name { font-size:18px; font-weight:700; }
.prof-role { font-size:12px; opacity:.85; margin-top:3px; }
.prof-menu { padding:10px; }
.prof-item { display:flex; align-items:center; gap:10px; padding:14px; background:#fff; border-radius:10px; margin-bottom:6px; cursor:pointer; transition:background .12s; }
.prof-item:active { background:#f5f5fa; }
.pi-icon { width:36px; height:36px; border-radius:10px; background:#f0f4ff; display:flex; align-items:center; justify-content:center; font-size:18px; }
.pi-label { flex:1; font-size:14px; }
.pi-arrow { color:#ccc; }

/* ========== 弹窗 ========== */
.modal-mask { position:fixed; inset:0; background:rgba(0,0,0,.4); display:flex; align-items:center; justify-content:center; z-index:999; padding:20px; }
.modal { background:#fff; border-radius:16px; padding:24px 20px; width:100%; max-width:340px; max-height:80vh; overflow-y:auto; }
.modal-title { font-size:17px; font-weight:700; margin-bottom:16px; text-align:center; }
.modal-body { margin-bottom:16px; }
.modal-actions { display:flex; gap:10px; }
.modal-actions .btn { flex:1; }
.pick-list { display:flex; flex-wrap:wrap; gap:8px; }
.pick-item { padding:6px 14px; border-radius:20px; font-size:13px; background:#f0f0f0; color:#666; cursor:pointer; }
.pick-item.active { background:var(--pri); color:#fff; }

/* ========== Toast ========== */
.toast { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); background:rgba(0,0,0,.8); color:#fff; padding:12px 24px; border-radius:10px; font-size:14px; z-index:9999; animation:fadeIn .2s; }

/* ========== 滚动区 ========== */
.scroll { flex:1; }
.no-data { text-align:center; padding:40px 20px; color:#999; font-size:14px; }
.loading { text-align:center; padding:20px; color:#999; }