/* =========================================================
   main.css — 布局与各界面样式
   ========================================================= */

#app {
  position: relative;
  width: 100%;
  max-width: 480px;
  height: 100vh;
  height: 100dvh;
  margin: 0 auto;
  overflow: hidden;
  background: var(--paper-2);
  border-left: 4px solid var(--ink);
  border-right: 4px solid var(--ink);
  box-shadow: 0 0 40px rgba(51,32,15,.35);
}

@media (max-width: 500px) {
  #app { border-left: 0; border-right: 0; box-shadow: none; }
}

/* ================= 开始界面 ================= */
.boot {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background:
    radial-gradient(circle at 50% 12%, #ffe6ad 0%, #f7d99a 42%, #e7bf78 100%);
  overflow-y: auto;
}
.boot::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(90,64,40,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(90,64,40,.08) 1px, transparent 1px);
  background-size: 24px 24px;
  pointer-events: none;
}
.boot-inner {
  position: relative;
  width: 100%;
  max-width: 360px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
.logo-wrap { text-align: center; }
.logo-sub {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 5px;
  color: #6b4a1a;
  margin-bottom: 2px;
}
.logo {
  position: relative;
  margin: 0;
  font-size: 44px;
  line-height: 1.05;
  font-weight: 900;
  letter-spacing: 3px;
  color: #ffd166;
  text-shadow:
     3px 0 0 var(--ink), -3px 0 0 var(--ink), 0 3px 0 var(--ink), 0 -3px 0 var(--ink),
     3px 3px 0 var(--ink), -3px -3px 0 var(--ink), 3px -3px 0 var(--ink), -3px 3px 0 var(--ink),
     0 10px 0 rgba(51,32,15,.22);
}
.logo-tag {
  margin-top: 8px;
  display: inline-block;
  padding: 3px 12px;
  font-size: 12px;
  font-weight: 800;
  color: #fff5e2;
  background: var(--wood-2);
  border: 2px solid var(--ink);
  border-radius: 999px;
}
.boot-canvas {
  display: block;
  width: 100%;
  height: 96px;
  border: 3px solid var(--ink);
  border-radius: 4px;
  background: #e9d6ae;
  box-shadow: var(--shadow-sm);
}
.boot-actions { width: 100%; display: flex; flex-direction: column; gap: 10px; }
.boot-foot { font-size: 11px; color: #6b5636; }

/* ================= 游戏主框架 ================= */
.game {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
}

/* ---- 顶部状态栏 ---- */
.topbar {
  flex: none;
  padding: 7px 8px 8px;
  color: #ffeccd;
  background: linear-gradient(180deg, var(--wood-1), var(--wood-2) 70%);
  border-bottom: 4px solid var(--wood-3);
  box-shadow: 0 3px 0 rgba(0,0,0,.15);
}
.topbar-row { display: flex; gap: 5px; }
.chip {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 3px 6px;
  background: rgba(0,0,0,.24);
  border: 2px solid rgba(255,236,205,.34);
  border-radius: 3px;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.12);
}
.chip i { font-style: normal; font-size: 12px; flex: none; filter: drop-shadow(0 1px 0 rgba(0,0,0,.4)); }
.chip b {
  font-size: 13px;
  font-weight: 900;
  letter-spacing: -.3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-variant-numeric: tabular-nums;
}
.chip.warn { background: rgba(180,40,25,.55); border-color: #ffb3a4; animation: warnPulse 1.1s ease-in-out infinite; }
@keyframes warnPulse { 50% { background: rgba(220,60,40,.8); } }

.lvbar {
  position: relative;
  height: 7px;
  margin-top: 6px;
  background: rgba(0,0,0,.32);
  border: 2px solid rgba(255,236,205,.28);
  border-radius: 999px;
  overflow: hidden;
}
.lvbar-fill {
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, #ffd166, var(--brand));
  transition: width .4s ease;
}
.lvbar-label {
  display: flex;
  justify-content: space-between;
  margin-top: 3px;
  font-size: 10px;
  font-weight: 700;
  color: rgba(255,236,205,.72);
}

/* ---- 内容区 ---- */
.view {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  padding: 10px 10px 16px;
  background-image:
    repeating-linear-gradient(45deg, rgba(200,168,119,.16) 0 10px, transparent 10px 20px);
}

/* ---- 底部导航 ---- */
.tabbar {
  flex: none;
  display: flex;
  background: var(--wood-3);
  border-top: 4px solid #241408;
  padding: 5px 5px calc(5px + env(safe-area-inset-bottom, 0px));
  gap: 4px;
}
.tab {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 4px 0 3px;
  color: #c9ab7c;
  background: transparent;
  border: 2px solid transparent;
  border-radius: 4px;
  cursor: pointer;
  transition: background .12s, color .12s, transform .08s;
}
.tab i { font-style: normal; font-size: 17px; line-height: 20px; filter: grayscale(.6) opacity(.8); }
.tab span { font-size: 10px; font-weight: 800; letter-spacing: .5px; }
.tab.active {
  color: #3b2a1a;
  background: linear-gradient(180deg, #ffd166, var(--brand));
  border-color: #241408;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.5), 0 0 0 2px rgba(255,209,102,.25);
  transform: translateY(-2px);
}
.tab.active i { filter: none; }

/* ================= 主页 ================= */
.hq-card { padding: 0 0 10px; overflow: hidden; }
.hq-head {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 9px 10px;
  background: linear-gradient(180deg, #fff8e6, #fdefd0);
  border-bottom: 3px solid var(--ink);
}
.hq-avatar {
  flex: none;
  width: 40px; height: 40px;
  display: grid; place-items: center;
  font-size: 21px;
  background: linear-gradient(180deg, #ffe6a8, #f7c96b);
  border: 3px solid var(--ink);
  border-radius: 4px;
  box-shadow: inset 0 3px 0 rgba(255,255,255,.55);
}
.hq-name { font-size: 15px; font-weight: 900; letter-spacing: .5px; }
.hq-sub { font-size: 11px; color: var(--txt-dim); }
.hq-lv {
  flex: none;
  padding: 3px 8px;
  font-size: 12px;
  font-weight: 900;
  color: #fff;
  background: var(--red);
  border: 2px solid var(--ink);
  border-radius: 3px;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.35);
}
.hq-stats {
  display: flex;
  gap: 6px;
  padding: 9px 10px 0;
}
.hq-stats > div {
  flex: 1;
  text-align: center;
  padding: 5px 2px;
  background: var(--paper-2);
  border: 2px solid var(--line);
  border-radius: 3px;
}
.hq-stats span { display: block; font-size: 10px; color: var(--txt-dim); font-weight: 700; }
.hq-stats b { display: block; font-size: 14px; font-weight: 900; font-variant-numeric: tabular-nums; }

/* 开发中卡片 */
.dev-card { margin-top: 10px; overflow: hidden; }
.dev-head {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  color: #ffeccd;
  background: linear-gradient(180deg, #2f7d9c, #1f5d78);
  border-bottom: 3px solid var(--ink);
}
.dev-head .dev-name { flex: 1; font-size: 13px; font-weight: 900; }
.speed-btn {
  color: #3b2a1a;
  background: #ffe3a3;
  cursor: pointer;
  border-color: #241408;
  font-variant-numeric: tabular-nums;
  padding: 1px 6px;
}
.speed-btn:active { transform: translateY(1px); }
.dev-live {
  display: inline-block;
  width: 7px; height: 7px;
  margin-right: 4px;
  background: #7bff7b;
  border-radius: 50%;
  box-shadow: 0 0 6px #7bff7b;
  animation: blink 1s steps(2) infinite;
}
@keyframes blink { 50% { opacity: .25; } }

.dev-stage {
  position: relative;
  background:
    linear-gradient(180deg, #dff0f7 0%, #eaf6e9 62%, #d9c69c 62%, #cdb789 100%);
  border-bottom: 3px solid var(--ink);
  padding: 4px 0 0;
}
.dev-stage canvas { display: block; width: 100%; }
.dev-stage .stage-hint {
  position: absolute;
  left: 8px; top: 5px;
  max-width: calc(100% - 16px);
  padding: 1px 6px;
  font-size: 10px;
  font-weight: 800;
  color: #29586b;
  background: rgba(255,255,255,.86);
  border: 2px solid rgba(31,93,120,.45);
  border-radius: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.dev-body { padding: 9px 10px 10px; }
.dev-line { display: flex; justify-content: space-between; align-items: baseline; font-size: 12px; font-weight: 700; }
.dev-line .num { font-size: 13px; }
.dev-actions { display: flex; gap: 6px; margin-top: 9px; }
.dev-actions .btn { flex: 1; }

/* 空闲卡 */
.idle-card {
  margin-top: 10px;
  padding: 16px 12px;
  text-align: center;
  background: repeating-linear-gradient(135deg, #fffdf5 0 12px, #f8f1de 12px 24px);
  border: 3px dashed #b99a68;
  border-radius: 4px;
}
.idle-card .idle-ico { font-size: 30px; line-height: 1; }
.idle-card .idle-t { margin-top: 6px; font-size: 14px; font-weight: 900; }
.idle-card .idle-s { font-size: 11px; color: var(--txt-dim); margin-top: 2px; }

/* 动态日志 */
.log-list { display: flex; flex-direction: column; gap: 0; }
.log-item {
  display: flex;
  gap: 7px;
  padding: 6px 10px;
  font-size: 12px;
  border-bottom: 2px dotted var(--line);
}
.log-item:last-child { border-bottom: 0; }
.log-item .log-m {
  flex: none;
  font-size: 10px;
  font-weight: 800;
  color: #fff;
  background: var(--ink-soft);
  border-radius: 2px;
  padding: 0 4px;
  height: 15px;
  line-height: 15px;
  margin-top: 2px;
}
.log-item .log-t { flex: 1; line-height: 1.4; }

/* ================= 立项界面 ================= */
.star-group { margin-bottom: 12px; }
.star-head {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 6px;
  padding-left: 2px;
}
.star-head .sh-stars { font-size: 13px; color: #8a5c00; letter-spacing: 1px; text-shadow: 0 1px 0 rgba(255,255,255,.8); }
.star-head .sh-name { font-size: 12px; font-weight: 900; color: var(--ink-soft); }
.star-head .sh-line { flex: 1; height: 3px; background: repeating-linear-gradient(90deg, var(--line) 0 5px, transparent 5px 10px); }

.proj-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 10px;
  margin-bottom: 6px;
  background: var(--paper);
  border: 3px solid var(--ink);
  border-radius: 4px;
  box-shadow: var(--shadow-sm);
  cursor: pointer;
  transition: transform .07s, background .12s;
}
.proj-card:active { transform: translateY(2px); }
.proj-card .pc-ico {
  flex: none;
  width: 34px; height: 34px;
  display: grid; place-items: center;
  font-size: 17px;
  background: var(--paper-2);
  border: 2px solid var(--ink);
  border-radius: 3px;
}
.proj-card .pc-body { flex: 1; min-width: 0; }
.proj-card .pc-name { font-size: 13px; font-weight: 900; letter-spacing: .3px; }
.proj-card .pc-meta { font-size: 11px; color: var(--txt-dim); margin-top: 1px; }
.proj-card .pc-income { flex: none; text-align: right; }
.proj-card .pc-income b { display: block; font-size: 13px; font-weight: 900; color: #8a5c00; }
.proj-card .pc-income span { font-size: 10px; color: var(--txt-dim); }
.proj-card.locked {
  filter: grayscale(.85);
  opacity: .68;
  background: #efe6d0;
  cursor: not-allowed;
}
.proj-card .pc-income.is-lock b { font-size: 14px; color: var(--txt-dim); }
.proj-card.best { border-color: #b98600; box-shadow: 0 3px 0 #d19700, 0 0 0 3px rgba(255,194,60,.35); }

/* 立项详情（弹窗内） */
.pick-section { margin-bottom: 10px; }
.pick-label {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-bottom: 5px;
  font-size: 12px;
  font-weight: 900;
  color: var(--ink-soft);
}
.pick-label .pl-hint { font-weight: 700; font-size: 11px; color: var(--txt-dim); }
.chip-grid { display: flex; flex-wrap: wrap; gap: 6px; }
.pick-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 9px;
  font-size: 12px;
  font-weight: 800;
  color: var(--ink);
  background: var(--paper-2);
  border: 2px solid var(--ink-soft);
  border-radius: 3px;
  cursor: pointer;
  transition: all .1s;
}
.pick-chip:active { transform: translateY(1px); }
.pick-chip.on {
  color: #3b2410;
  background: var(--brand);
  border-color: var(--ink);
  box-shadow: inset 0 2px 0 rgba(255,255,255,.4), 0 2px 0 var(--brand-dk);
  text-shadow: 0 1px 0 rgba(255,255,255,.45);
}
.pick-chip.on.good { color: #fff; background: #2e7d32; text-shadow: 0 1px 0 rgba(0,0,0,.3); box-shadow: inset 0 2px 0 rgba(255,255,255,.3), 0 2px 0 var(--green-dk); }
.pick-chip.on.bad  { color: #fff; background: #b8351f; text-shadow: 0 1px 0 rgba(0,0,0,.3); box-shadow: inset 0 2px 0 rgba(255,255,255,.3), 0 2px 0 var(--red-dk); }
.pick-chip.off { opacity: .42; cursor: not-allowed; }

.emp-pick {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 6px 8px;
  margin-bottom: 5px;
  background: var(--paper-2);
  border: 2px solid var(--line);
  border-radius: 3px;
  cursor: pointer;
}
.emp-pick.on { background: #dff3d8; border-color: var(--green-dk); box-shadow: inset 0 0 0 2px rgba(92,184,92,.35); }
.emp-pick .ep-name { flex: 1; font-size: 12px; font-weight: 800; }
.emp-pick .ep-stat { display: flex; gap: 8px; font-size: 11px; color: var(--txt-dim); font-variant-numeric: tabular-nums; }
.emp-pick .ep-sp {
  display: inline-block;
  margin-left: 4px;
  padding: 0 3px;
  font-size: 9px;
  line-height: 14px;
  border: 2px solid rgba(51,32,15,.5);
  border-radius: 3px;
  vertical-align: 1px;
}
.emp-pick .ep-rest {
  margin-left: 4px;
  padding: 0 4px;
  font-size: 9px;
  font-weight: 900;
  line-height: 14px;
  color: #fff;
  background: #8b8b8b;
  border: 2px solid rgba(51,32,15,.5);
  border-radius: 3px;
}
.emp-pick .ep-fat { flex: none; font-size: 10px; font-weight: 900; font-variant-numeric: tabular-nums; }
.emp-pick.resting { opacity: .72; }
.emp-pick .ep-check {
  width: 16px; height: 16px;
  display: grid; place-items: center;
  font-size: 11px; font-weight: 900; color: #fff;
  background: #cfc0a4;
  border: 2px solid var(--ink);
  border-radius: 3px;
}
.emp-pick.on .ep-check { background: #2e7d32; }

.preview-box {
  padding: 8px 10px;
  background: linear-gradient(180deg, #fff8e2, #f8ecc9);
  border: 3px solid var(--ink);
  border-radius: 4px;
}
.preview-row { display: flex; justify-content: space-between; font-size: 12px; padding: 2px 0; }
.preview-row b { font-variant-numeric: tabular-nums; }
.preview-grade {
  text-align: center;
  padding: 4px 0 2px;
}
.preview-grade .pg-letter {
  font-size: 26px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 1px;
}
.preview-grade .pg-desc { font-size: 11px; color: var(--txt-dim); font-weight: 700; }

/* ================= 员工界面 ================= */
.sect-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.sect-head .st-t { font-size: 14px; font-weight: 900; letter-spacing: .5px; }
.sect-head .st-s { font-size: 11px; color: var(--txt-dim); font-weight: 700; }

.emp-card {
  display: block;
  padding: 0;
  margin-bottom: 7px;
  background: var(--paper);
  border: 3px solid var(--ink);
  border-radius: 4px;
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}
.emp-card-head {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 9px;
  cursor: pointer;
}
.emp-sprite-box {
  flex: none;
  width: 44px; height: 52px;
  display: grid; place-items: center;
  background: repeating-linear-gradient(45deg, #e6f0f7 0 6px, #dbe8f2 6px 12px);
  border: 2px solid var(--ink);
  border-radius: 3px;
}
.emp-sprite { display: block; }
.emp-main { flex: 1; min-width: 0; }
.emp-name { font-size: 13px; font-weight: 900; display: flex; align-items: center; gap: 5px; }
.emp-lv {
  font-size: 10px;
  font-weight: 900;
  color: #fff;
  background: var(--purple);
  border: 1px solid var(--ink);
  border-radius: 2px;
  padding: 0 4px;
}
.emp-attrs { display: flex; gap: 4px; margin-top: 3px; flex-wrap: wrap; }
.attr {
  font-size: 10px;
  font-weight: 800;
  padding: 0 5px;
  line-height: 16px;
  color: var(--ink);
  background: var(--paper-3);
  border: 2px solid var(--line);
  border-radius: 3px;
  font-variant-numeric: tabular-nums;
}
.attr-p { background: #cfe3fb; border-color: #7fb0dd; }
.attr-a { background: #fbd9e4; border-color: #dd9ab3; }
.attr-g { background: #d8f0cf; border-color: #8fc47d; }
.attr-s { background: #ffe9b8; border-color: #dbb75c; }
.emp-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 4px; font-size: 11px; color: var(--txt-dim); font-weight: 700; }
.emp-card .emp-toggle {
  flex: none;
  padding-right: 8px;
  font-size: 16px;
  color: var(--ink-soft);
}
.emp-detail {
  padding: 8px 9px 10px;
  background: #f8f0dc;
  border-top: 3px dashed var(--line);
}
.train-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.train-btn {
  display: flex;
  flex-direction: column;
  gap: 1px;
  padding: 6px 8px;
  text-align: left;
  background: var(--paper);
  border: 2px solid var(--ink);
  border-radius: 3px;
  box-shadow: 0 2px 0 rgba(51,32,15,.25);
  cursor: pointer;
}
.train-btn:active:not(.off) { transform: translateY(2px); box-shadow: 0 0 0 rgba(0,0,0,0); }
.train-btn .tb-t { font-size: 12px; font-weight: 900; }
.train-btn .tb-c { font-size: 10px; font-weight: 700; color: #8a5c00; font-variant-numeric: tabular-nums; }
.train-btn.off { opacity: .5; cursor: not-allowed; filter: grayscale(.6); }

/* ================= 更多界面 ================= */
.menu-list { display: flex; flex-direction: column; gap: 7px; }
.menu-item {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px;
  background: var(--paper);
  border: 3px solid var(--ink);
  border-radius: 4px;
  box-shadow: var(--shadow-sm);
  cursor: pointer;
}
.menu-item:active { transform: translateY(2px); box-shadow: none; }
.menu-item .mi-ico {
  flex: none;
  width: 32px; height: 32px;
  display: grid; place-items: center;
  font-size: 16px;
  background: var(--paper-2);
  border: 2px solid var(--ink);
  border-radius: 3px;
}
.menu-item .mi-t { font-size: 13px; font-weight: 900; }
.menu-item .mi-s { font-size: 11px; color: var(--txt-dim); }
.menu-item .mi-r { flex: none; font-size: 15px; color: var(--ink-soft); font-weight: 900; }

.info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.info-cell {
  padding: 6px 8px;
  background: var(--paper-2);
  border: 2px solid var(--line);
  border-radius: 3px;
}
.info-cell span { display: block; font-size: 10px; color: var(--txt-dim); font-weight: 700; }
.info-cell b { display: block; font-size: 14px; font-weight: 900; font-variant-numeric: tabular-nums; }

/* 图鉴条目 */
.rec-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 0;
  border-bottom: 2px dotted var(--line);
  font-size: 12px;
}
.rec-item:last-child { border-bottom: 0; }
.rec-grade {
  flex: none;
  width: 22px; height: 22px;
  display: grid; place-items: center;
  font-size: 12px; font-weight: 900; color: #fff;
  border: 2px solid var(--ink);
  border-radius: 3px;
}

/* ================= 结算界面 ================= */
.result-hero {
  position: relative;
  padding: 12px 10px 14px;
  text-align: center;
  background:
    radial-gradient(circle at 50% 30%, rgba(255,255,255,.9), rgba(255,255,255,0) 70%),
    linear-gradient(180deg, #ffeec2, #f7d68f);
  border: 3px solid var(--ink);
  border-radius: 5px;
  overflow: hidden;
}
.result-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: repeating-conic-gradient(from 0deg at 50% 40%, rgba(255,255,255,.35) 0 8deg, transparent 8deg 22deg);
  opacity: .5;
  animation: spinSlow 24s linear infinite;
}
@keyframes spinSlow { to { transform: rotate(360deg); } }
.result-hero > * { position: relative; }
.result-grade {
  font-size: 62px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 2px;
  color: #fff;
  -webkit-text-stroke: 2px var(--ink);
  text-shadow: 4px 4px 0 rgba(51,32,15,.28);
  animation: gradePop .45s cubic-bezier(.2,1.6,.5,1);
}
@keyframes gradePop {
  0% { transform: scale(.3) rotate(-12deg); opacity: 0; }
  70% { transform: scale(1.15) rotate(3deg); }
  100% { transform: scale(1) rotate(0); }
}
.result-score { font-size: 13px; font-weight: 900; color: var(--ink-soft); margin-top: 2px; }
.result-title { font-size: 14px; font-weight: 900; margin-top: 6px; }
.result-tags { display: flex; justify-content: center; gap: 5px; margin-top: 5px; flex-wrap: wrap; }

.result-lines { margin-top: 10px; }
.result-line {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 5px 2px;
  font-size: 12px;
  border-bottom: 2px dotted var(--line);
}
.result-line:last-child { border-bottom: 0; }
.result-line .rl-k { color: var(--ink-soft); font-weight: 700; }
.result-line .rl-v { font-weight: 900; font-variant-numeric: tabular-nums; }
.result-line.total {
  margin-top: 4px;
  padding: 8px 8px;
  font-size: 14px;
  background: #fff3cf;
  border: 3px solid var(--ink);
  border-radius: 4px;
}
.result-line.total .rl-v { font-size: 17px; color: #8a5c00; }

/* 事件弹窗 */
.event-art {
  display: grid;
  place-items: center;
  font-size: 42px;
  line-height: 1;
  padding: 10px 0 6px;
  filter: drop-shadow(0 3px 0 rgba(51,32,15,.2));
  animation: eventBob 1.6s ease-in-out infinite;
}
@keyframes eventBob { 50% { transform: translateY(-5px); } }
.event-desc {
  padding: 9px 11px;
  font-size: 13px;
  line-height: 1.65;
  background: var(--paper-2);
  border: 2px solid var(--line);
  border-radius: 4px;
}
.event-opts { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }

/* 招聘 */
.can-list { display: flex; flex-direction: column; gap: 8px; }
.can-card {
  padding: 8px 9px;
  background: var(--paper);
  border: 3px solid var(--ink);
  border-radius: 4px;
  box-shadow: var(--shadow-sm);
}
.can-head { display: flex; align-items: center; gap: 8px; }
.can-head canvas { flex: none; }
.can-name { flex: 1; font-size: 13px; font-weight: 900; }
.can-quirk {
  margin-top: 5px;
  padding: 3px 7px;
  font-size: 10px;
  line-height: 1.5;
  color: #6b5636;
  background: var(--paper-2);
  border: 2px dashed var(--line);
  border-radius: 3px;
}
.can-attrs { display: flex; gap: 4px; margin-top: 5px; flex-wrap: wrap; }
.can-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 7px; }
.can-cost { font-size: 12px; font-weight: 900; color: #8a5c00; }

/* 通用小提示条 */
.tip-bar {
  display: flex;
  gap: 6px;
  align-items: flex-start;
  padding: 7px 9px;
  font-size: 11px;
  line-height: 1.5;
  color: #6b5636;
  background: #fff6da;
  border: 2px solid #d8bd85;
  border-left: 5px solid var(--brand);
  border-radius: 3px;
}

/* 滚动条（桌面端） */
.view::-webkit-scrollbar, .modal-body::-webkit-scrollbar { width: 8px; }
.view::-webkit-scrollbar-thumb, .modal-body::-webkit-scrollbar-thumb {
  background: #c8a877;
  border: 2px solid var(--paper-2);
  border-radius: 4px;
}

/* ================= 市场：品类行情 ================= */
.market-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin-top: 8px;
  font-size: 11px;
  font-weight: 800;
}
.mk-hot {
  padding: 2px 8px;
  color: #7a3a00;
  background: #ffe0b0;
  border: 2px solid #c9812a;
  border-radius: 3px;
}
.wind-tag {
  padding: 2px 8px;
  color: #57468f;
  background: #e9e3ff;
  border: 2px solid #8f80d0;
  border-radius: 3px;
}
.wind-tag.on {
  color: #fff5ff;
  background: #8f80d0;
  border-color: #5b4aa0;
}

.market-panel { margin-bottom: 10px; padding-bottom: 8px; }
.mk-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  padding: 0 8px;
}
.mk-cell {
  padding: 5px 7px;
  background: var(--paper-2);
  border: 2px solid var(--line);
  border-radius: 3px;
}
.mk-cell.is-hot { background: #ffeccb; border-color: #d99a2a; }
.mk-cell.is-wind { background: #eee8ff; border-color: #8f80d0; }
.mk-t {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 900;
}
.mk-flag {
  margin-left: auto;
  padding: 0 4px;
  font-size: 9px;
  font-weight: 900;
  line-height: 14px;
  color: #fff;
  background: var(--red);
  border-radius: 2px;
}
.mk-flag.wind { background: #8f80d0; }
.mk-flag.coming { background: #c98a00; }
.mk-bar {
  height: 5px;
  margin: 4px 0 3px;
  background: #d9c49a;
  border-radius: 2px;
  overflow: hidden;
}
.mk-bar i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #ffd166, var(--brand));
  transition: width .3s;
}
.mk-s {
  display: flex;
  justify-content: space-between;
  gap: 4px;
  font-size: 9px;
  font-weight: 700;
  color: var(--txt-dim);
}

/* 项目卡上的小旗标 / 传奇样式 */
.mini-flag {
  display: inline-block;
  margin-left: 4px;
  padding: 0 4px;
  font-size: 9px;
  font-weight: 900;
  line-height: 14px;
  color: #fff;
  background: #b8351f;
  border-radius: 2px;
  vertical-align: 1px;
}
.mini-flag.legend { background: #8a6100; }
.mini-flag.wind { background: #6a58b8; }
.mini-flag.coming { background: #8a5e00; }
.proj-card.legendary {
  border-color: #b8860b;
  box-shadow: 0 3px 0 #b8860b, 0 0 0 3px rgba(255,194,60,.3);
}
.star-group.legend .sh-stars,
.star-group.legend .sh-name { color: #8a5c00; }

/* 立项弹窗内的市场行 */
.mki-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  padding: 2px 0;
}
.mki-name { font-weight: 900; }

/* ================= 组合技 ================= */
.combo-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 7px;
}
.combo-tag {
  padding: 1px 7px;
  font-size: 10px;
  font-weight: 900;
  color: #fff8ff;
  background: linear-gradient(180deg, #9b6bdf, #6f45b0);
  border: 2px solid var(--ink);
  border-radius: 3px;
}
.combo-box {
  margin-top: 8px;
  padding: 7px 9px;
  background: #f3edff;
  border: 2px solid #a992e0;
  border-left: 5px solid #7b5cd0;
  border-radius: 3px;
}
.cb-title { font-size: 11px; font-weight: 900; color: #5b4aa0; margin-bottom: 3px; }
.cb-row { display: flex; gap: 6px; font-size: 11px; line-height: 1.55; }
.cb-name { flex: none; font-weight: 900; color: #5b4aa0; }
.cb-text { color: #6b5636; }
.combo-empty {
  margin-top: 8px;
  padding: 7px 9px;
  font-size: 11px;
  color: var(--txt-dim);
  background: var(--paper-2);
  border: 2px dashed var(--line);
  border-radius: 3px;
}

/* ================= 专精 / 疲劳 ================= */
.sp-tag {
  padding: 0 5px;
  font-size: 9px;
  font-weight: 900;
  line-height: 15px;
  color: var(--ink);
  border: 2px solid rgba(51,32,15,.55);
  border-radius: 3px;
}
.sp-tag.resting { background: #e2dccc; border-color: #8b8b8b; color: #4a4a4a; }
.attr .mul {
  margin-left: 2px;
  font-style: normal;
  font-size: 9px;
  font-weight: 900;
  color: #276a29;
}
.attr .mul.down { color: #b0301f; }
.attr.up { box-shadow: inset 0 0 0 2px rgba(92,184,92,.6); }
.attr.down { opacity: .82; }

.fat-line {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 5px;
}
.fat-bar {
  flex: 1;
  height: 6px;
  min-width: 0;
  background: #d9c49a;
  border: 2px solid var(--ink);
  border-radius: 3px;
  overflow: hidden;
}
.fat-bar i {
  display: block;
  height: 100%;
  transition: width .25s;
}
.fat-t { flex: none; font-size: 10px; font-weight: 900; }

.sp-detail {
  margin-bottom: 7px;
  padding: 6px 8px;
  background: var(--paper-2);
  border: 2px solid var(--line);
  border-radius: 3px;
}
.sp-row { display: flex; gap: 6px; font-size: 10px; line-height: 1.6; }
.sp-row b { flex: none; font-weight: 900; color: var(--ink-soft); }
.sp-row span { color: var(--txt-dim); }

/* ================= 开发飘字（P0-3） ================= */
.float-layer {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 3;
}
.floater {
  position: absolute;
  bottom: 22%;
  padding: 1px 7px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
  background: rgba(255,248,232,.94);
  border: 2px solid currentColor;
  border-radius: 999px;
  box-shadow: 0 2px 0 rgba(0,0,0,.16);
  animation: floatUp 1.6s ease-out forwards;
}
.floater .fl-ico { margin-right: 3px; }
@keyframes floatUp {
  0%   { transform: translateY(10px) scale(.8); opacity: 0; }
  18%  { transform: translateY(0) scale(1.06); opacity: 1; }
  32%  { transform: translateY(-4px) scale(1); }
  100% { transform: translateY(-52px) scale(1); opacity: 0; }
}

/* ================= 月报 / 结算强化 ================= */
.report-entry {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding: 7px 10px;
  background: #fffbe8;
  border: 2px solid #d8bd85;
  border-left: 5px solid var(--gold);
  border-radius: 3px;
  cursor: pointer;
}
.report-entry:active { transform: translateY(1px); }
.report-entry .re-ico { font-size: 17px; flex: none; }
.report-entry .re-t { display: block; font-size: 12px; font-weight: 900; }
.report-entry .re-s { display: block; font-size: 10px; color: var(--txt-dim); font-weight: 700; }
.report-entry .re-r { flex: none; font-size: 15px; font-weight: 900; color: var(--ink-soft); }

.report-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding-bottom: 7px;
  border-bottom: 3px dashed var(--line);
}
.rp-month { font-size: 13px; font-weight: 900; color: var(--ink-soft); }
.rp-net { font-size: 20px; font-weight: 900; font-variant-numeric: tabular-nums; }
.rp-card {
  margin-top: 8px;
  padding: 7px 9px;
  border: 2px solid var(--line);
  border-radius: 3px;
  background: var(--paper-2);
}
.rp-card.good { border-color: #8fc47d; background: #f0fae9; }
.rp-card.bad { border-color: #e0a08f; background: #fdeeea; }
.rp-t { font-size: 11px; font-weight: 900; color: var(--ink-soft); }
.rp-b { font-size: 12px; font-weight: 700; margin-top: 2px; }
.rp-v { float: right; color: #8a5c00; font-weight: 900; }

.result-hero.epic {
  background: linear-gradient(180deg, #fff3cf, #ffe0a0);
  border-color: #b8860b;
}
.result-hero.epic .result-grade {
  animation: epicPop .7s cubic-bezier(.2,1.5,.5,1);
  text-shadow: 0 0 12px rgba(255,190,60,.9), 0 3px 0 rgba(0,0,0,.18);
}
@keyframes epicPop {
  0%   { transform: scale(.4) rotate(-12deg); opacity: 0; }
  60%  { transform: scale(1.18) rotate(3deg); }
  100% { transform: scale(1) rotate(0); opacity: 1; }
}
.result-hero.epic-max {
  background: linear-gradient(180deg, #f6e9ff, #dcc6ff);
  border-color: #8f3fd0;
}

.combo-show {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 8px;
  padding: 7px 9px;
  background: #f3edff;
  border: 2px solid #a992e0;
  border-radius: 3px;
}
.cs-item { display: flex; align-items: baseline; gap: 5px; font-size: 11px; }
.cs-ico { flex: none; }
.cs-name { flex: none; font-weight: 900; color: #5b4aa0; }
.cs-text { color: #6b5636; }

/* ================= 游戏说明 ================= */
.help-toc { display: flex; flex-direction: column; gap: 6px; }
.help-sec {
  border: 2px solid var(--line);
  border-radius: 3px;
  background: var(--paper-2);
  overflow: hidden;
}
.hs-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 7px 9px;
  font-size: 12px;
  font-weight: 900;
  color: var(--ink-soft);
  background: var(--paper-3);
  cursor: pointer;
}
.hs-ar { flex: none; font-size: 10px; transition: transform .15s; }
.help-sec.open .hs-ar { transform: rotate(180deg); }
.hs-body {
  display: none;
  padding: 8px 9px 9px;
  font-size: 11.5px;
  line-height: 1.72;
  color: var(--txt);
  background: var(--paper);
  border-top: 2px dashed var(--line);
}
.help-sec.open .hs-body { display: block; }

/* ================= 成就 ================= */
.ach-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.ach-cell {
  padding: 7px 8px;
  background: var(--paper-2);
  border: 2px solid var(--line);
  border-radius: 3px;
  opacity: .78;
}
.ach-cell.done {
  opacity: 1;
  background: #fffbe8;
  border-color: #d99a2a;
  box-shadow: inset 0 0 0 2px rgba(255,194,60,.28);
}
.ach-ico { font-size: 17px; line-height: 1.1; }
.ach-name { font-size: 11.5px; font-weight: 900; margin-top: 2px; }
.ach-desc { font-size: 10px; color: var(--txt-dim); line-height: 1.45; margin-top: 1px; }
.ach-rw { margin-top: 4px; font-size: 10px; font-weight: 900; color: #8a5c00; }
.ach-cell.done .ach-rw { color: #2f7d32; }

/* ================= 局外商店 ================= */
.shop-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px;
  padding-bottom: 7px;
  border-bottom: 3px dashed var(--line);
}
.shop-pt { font-size: 13px; font-weight: 900; }
.shop-pt b { font-size: 18px; color: #8a5c00; }
.shop-tip {
  margin-top: 7px;
  padding: 6px 8px;
  font-size: 10.5px;
  line-height: 1.6;
  color: var(--txt-dim);
  background: var(--paper-2);
  border: 2px dashed var(--line);
  border-radius: 3px;
}
.shop-list { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.shop-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  background: var(--paper);
  border: 2px solid var(--line);
  border-radius: 3px;
}
.shop-item.maxed { background: #f0fae9; border-color: #8fc47d; }
.si-ico { flex: none; font-size: 18px; }
.si-t { font-size: 12px; font-weight: 900; }
.si-s { font-size: 10px; color: var(--txt-dim); line-height: 1.45; }
.si-done { flex: none; font-size: 10px; font-weight: 900; color: #2f7d32; }

/* ================= 设置 ================= */
.set-list { display: flex; flex-direction: column; gap: 6px; }
.set-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  background: var(--paper);
  border: 2px solid var(--line);
  border-radius: 3px;
}
.set-t { font-size: 12.5px; font-weight: 900; }
.set-s { font-size: 10.5px; color: var(--txt-dim); }
.switch {
  position: relative;
  flex: none;
  width: 46px;
  height: 24px;
  padding: 0;
  background: #b9a887;
  border: 2px solid var(--ink);
  border-radius: 999px;
  cursor: pointer;
  transition: background .16s;
}
.switch i {
  position: absolute;
  top: 1px;
  left: 1px;
  width: 18px;
  height: 18px;
  background: var(--paper);
  border: 2px solid var(--ink);
  border-radius: 50%;
  transition: transform .16s;
}
.switch.on { background: var(--green); }
.switch.on i { transform: translateX(22px); }

/* ================= 新手引导 / 月度横幅 ================= */
.intro-page { text-align: center; padding: 4px 2px 2px; }
.ip-step {
  display: inline-block;
  padding: 1px 8px;
  font-size: 10px;
  font-weight: 900;
  color: var(--ink-soft);
  background: var(--paper-3);
  border: 2px solid var(--line);
  border-radius: 999px;
}
.ip-t { margin-top: 8px; font-size: 15px; font-weight: 900; letter-spacing: .5px; }
.ip-b {
  margin-top: 8px;
  font-size: 12.5px;
  line-height: 1.85;
  text-align: left;
  color: var(--txt);
}
.ip-dots { display: flex; justify-content: center; gap: 6px; margin-top: 12px; }
.ip-dots i {
  width: 8px; height: 8px;
  background: var(--paper-3);
  border: 2px solid var(--line);
  border-radius: 50%;
}
.ip-dots i.on { background: var(--brand); border-color: var(--brand-dk); }

.month-banner {
  position: fixed;
  left: 50%;
  top: 22%;
  transform: translateX(-50%);
  z-index: 95;
  pointer-events: none;
  animation: bannerIn .34s cubic-bezier(.2,1.4,.6,1);
}
.month-banner.out { animation: bannerOut .4s ease-in forwards; }
.mb-in {
  min-width: 190px;
  padding: 10px 18px 11px;
  text-align: center;
  background: linear-gradient(180deg, var(--paper), var(--paper-2));
  border: 4px solid var(--ink);
  border-radius: 6px;
  box-shadow: 0 6px 0 rgba(51,32,15,.32);
}
.mb-t { font-size: 11px; font-weight: 800; color: var(--txt-dim); letter-spacing: 1px; }
.mb-net { font-size: 26px; font-weight: 900; font-variant-numeric: tabular-nums; line-height: 1.2; }
.mb-s { font-size: 10px; font-weight: 700; color: var(--txt-dim); }
@keyframes bannerIn {
  from { transform: translate(-50%, -16px) scale(.86); opacity: 0; }
}
@keyframes bannerOut {
  to { transform: translate(-50%, -20px) scale(.94); opacity: 0; }
}

/* 数字膨胀：过万变金、过亿发光 */
.result-line .rl-v.big,
.rp-net.big,
.rp-net .big { color: #a05c00; text-shadow: 0 1px 0 rgba(255,255,255,.7); }
.result-line .rl-v.huge,
.rp-net.huge,
.rp-net .huge {
  color: #c0392b;
  animation: hugeGlow 1.1s ease-in-out infinite;
}
@keyframes hugeGlow {
  0%, 100% { text-shadow: 0 0 3px rgba(255,190,60,.5); }
  50%      { text-shadow: 0 0 12px rgba(255,120,40,.95), 0 0 20px rgba(255,200,80,.7); }
}

/* S 级以上的像素闪光 */
.spark-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}
.spark-layer i {
  position: absolute;
  width: 4px;
  height: 4px;
  background: #fff6c0;
  box-shadow: 0 0 6px 2px rgba(255,214,90,.9);
  opacity: 0;
  animation: sparkTwinkle 1.2s ease-in-out infinite;
}
@keyframes sparkTwinkle {
  0%   { opacity: 0; transform: scale(.4) rotate(0deg); }
  35%  { opacity: 1; transform: scale(1.25) rotate(45deg); }
  100% { opacity: 0; transform: scale(.6) rotate(90deg); }
}

/* ================= 新手教练条 ================= */
.coach-bar {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 9px;
  padding: 7px 9px;
  font-size: 11px;
  line-height: 1.5;
  color: #6b4a12;
  background: #fff3cf;
  border: 2px solid #e0b350;
  border-left: 5px solid var(--brand);
  border-radius: 3px;
  box-shadow: 0 2px 0 rgba(51,32,15,.12);
}
.coach-bar .cb-ico { flex: none; font-size: 15px; }
.coach-bar .btn { flex: none; }

/* 被教练条点名的目标：虚线呼吸框 */
.proj-card.coach,
.btn.coach {
  animation: coachPulse 1.15s ease-in-out infinite;
  outline: 3px dashed var(--brand);
  outline-offset: 2px;
}
@keyframes coachPulse {
  0%, 100% { outline-color: rgba(255,154,46,.95); }
  50%      { outline-color: rgba(255,154,46,.25); }
}

/* 横屏适配：压缩纵向间距 */
@media (max-height: 520px) and (orientation: landscape) {
  .topbar { padding: 4px 8px 5px; }
  .lvbar, .lvbar-label { display: none; }
  .view { padding: 7px 10px 10px; }
  .boot-canvas { height: 64px; }
  .logo { font-size: 32px; }
  .tabbar { padding: 3px 5px calc(3px + env(safe-area-inset-bottom, 0px)); }
  .tab i { font-size: 15px; line-height: 17px; }
}

/* =========================================================
   v2 新增界面：办公室 / 多项目卡 / 委托板 / 属性需求 / 配方图鉴
   ========================================================= */

/* 公司卡四格 */
.hq-stats > div { padding: 4px 1px; }
.hq-stats b { font-size: 13px; }
.hq-stats span { font-size: 9.5px; }

/* ---- 办公室 ---- */
.office-panel { margin-top: 10px; overflow: hidden; }
.office-stage {
  position: relative;
  background: linear-gradient(180deg, #dff0f7 0%, #eaf6e9 58%, #d9c69c 58%, #cdb789 100%);
  border-bottom: 3px solid var(--ink);
  padding: 2px 0 0;
}
.office-stage canvas { display: block; width: 100%; }
.office-bar { display: flex; gap: 6px; padding: 8px 9px; }
.office-bar .btn { flex: 1; }

/* ---- 在开发的项目卡 ---- */
.proj-live { margin-top: 8px; padding: 8px 9px 9px; }
.pl-head { display: flex; align-items: center; gap: 6px; }
.pl-ico { flex: none; font-size: 16px; }
.pl-name { flex: 1; min-width: 0; font-size: 13px; font-weight: 900;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-sub { margin-top: 3px; font-size: 11px; font-weight: 700; color: var(--txt-dim); }
.pl-bar { height: 13px; margin-top: 6px; }
.pl-line { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; margin-top: 4px; font-size: 11.5px; }
.pl-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 6px; }

/* ---- 委托卡 ---- */
.offer-card {
  position: relative;
  padding: 8px 10px 9px;
  margin-bottom: 7px;
  background: var(--paper);
  border: 3px solid var(--ink);
  border-radius: 4px;
  box-shadow: var(--shadow-sm);
  cursor: pointer;
  transition: transform .07s;
}
.offer-card:active { transform: translateY(2px); }
.offer-card.locked { filter: grayscale(.6); opacity: .7; cursor: not-allowed; }
.oc-head { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.oc-client { font-size: 10.5px; font-weight: 800; color: var(--txt-dim);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.oc-title { margin-top: 3px; font-size: 14px; font-weight: 900; letter-spacing: .3px; }
.oc-tags { display: flex; gap: 4px; margin-top: 5px; flex-wrap: wrap; }
.oc-meta { display: flex; gap: 10px; margin-top: 5px; font-size: 11.5px; font-weight: 700; color: var(--txt-dim); }
.oc-req {
  display: flex; gap: 8px; align-items: center;
  margin-top: 5px; padding: 3px 6px;
  font-size: 11px; font-weight: 800;
  background: var(--paper-2);
  border: 2px solid var(--line);
  border-radius: 3px;
}
.oc-req > span:first-child { color: var(--txt-dim); font-weight: 700; }
.oc-rumor {
  margin-top: 5px; padding: 3px 6px;
  font-size: 10.5px; font-weight: 700; color: #4a3a86;
  background: #efe7fb; border: 2px dashed #b9a2e6; border-radius: 3px;
}
.oc-foot { display: flex; justify-content: space-between; align-items: center; gap: 6px; margin-top: 6px; }
.oc-go { flex: none; font-size: 12px; font-weight: 900; color: var(--blue-dk); }
.board-actions { display: flex; gap: 6px; margin-top: 8px; align-items: center; flex-wrap: wrap; }

/* ---- 市场：题材格 ---- */
.theme-cell .mk-bar { background: #e4d3f5; }
.theme-cell .mk-bar i { background: linear-gradient(90deg, #c9a9f0, #9b6bdf); }

/* ---- 立项弹窗 ---- */
.sheet-head .oc-client { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; margin-top: 4px; white-space: normal; }
.req-hint {
  margin-top: 6px; padding: 4px 7px;
  font-size: 11.5px; font-weight: 800;
  background: #fff4d6;
  border: 2px solid #d8b45e;
  border-radius: 3px;
}
.combo-line { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.combo-line #sheet-rumor { flex: 1; min-width: 0; }
.pick-chip.client { border-color: #b98600; }
.pick-chip.client::after { content: "★"; margin-left: 2px; color: #b98600; }
.pick-chip.on.client::after { color: #fff3cc; }

/* ---- 属性需求框 ---- */
.req-box {
  padding: 7px 8px;
  background: linear-gradient(180deg, #fffaf0, #f6efdd);
  border: 3px solid var(--ink);
  border-radius: 4px;
}
.req-rows { display: flex; flex-direction: column; gap: 5px; }
.req-row { display: flex; align-items: center; gap: 6px; }
.req-name { flex: none; width: 64px; font-size: 11.5px; font-weight: 800; }
.req-bar {
  flex: 1; height: 11px;
  background: #e2d3b3;
  border: 2px solid var(--ink);
  border-radius: 2px;
  overflow: hidden;
}
.req-bar i { display: block; height: 100%; transition: width .15s; }
.req-num { flex: none; font-size: 11px; font-weight: 900; font-variant-numeric: tabular-nums; }
.req-sum { margin-top: 6px; text-align: right; font-size: 12px; font-weight: 900; }

/* ---- 员工卡：在项目里 ---- */
.emp-pick.locked { opacity: .55; }
.sp-tag.busy { background: #dfe8f2; border-color: #6b8fae; color: #2b4a63; }

/* ---- 新配方点亮 ---- */
.discover-bar {
  display: flex; gap: 7px; align-items: center;
  margin-top: 10px; padding: 7px 9px;
  background: linear-gradient(180deg, #efe7fb, #e2d5f7);
  border: 3px solid #7d4fc0;
  border-radius: 4px;
}
.db-ico { flex: none; font-size: 18px; }

/* ---- 升级解锁 ---- */
.unlock-hero { text-align: center; padding: 4px 0 8px; }
.uh-lv { font-size: 34px; font-weight: 900; color: #8a5c00; line-height: 1; }
.uh-t { font-size: 15px; font-weight: 900; margin-top: 4px; }
.unlock-list { display: flex; flex-direction: column; gap: 6px; }
.unlock-item {
  display: flex; gap: 8px; align-items: center;
  padding: 7px 9px;
  background: var(--paper-2);
  border: 2px solid var(--line);
  border-radius: 3px;
}
.ui-ico { flex: none; font-size: 20px; }
.ui-t { font-size: 12.5px; font-weight: 900; }
.ui-s { font-size: 11px; color: var(--txt-dim); line-height: 1.45; }

/* ---- 公司扩建 ---- */
.corp-item {
  display: flex; gap: 8px; align-items: center;
  margin-top: 6px; padding: 7px 9px;
  background: var(--paper);
  border: 2px solid var(--line);
  border-radius: 3px;
}
.ci-ico { flex: none; font-size: 19px; }

/* ---- 配方图鉴 ---- */
.recipe-grid { display: grid; gap: 3px; }
.recipe-cell {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: 40px; padding: 4px 2px;
  font-size: 10.5px; font-weight: 900;
  border: 2px solid var(--line);
  border-radius: 3px;
  background: var(--paper-2);
}
.recipe-cell.head { background: var(--wood-2); color: #ffeccd; border-color: var(--ink); }
.recipe-cell.rowhead { flex-direction: row; gap: 3px; background: #f0e0bd; }
.recipe-cell.known b { font-size: 11.5px; }
.recipe-cell.known span { font-size: 9.5px; color: var(--txt-dim); font-weight: 700; }
.recipe-cell.unknown { color: #8d7a5e; background: #efe6d2; border-style: dashed; }
.recipe-cell.hint-4 { background: #e6ddf7; border-color: #7d4fc0; }
.recipe-cell.hint-3 { background: #d8ecfb; border-color: #2470b4; }
.recipe-cell.hint-2 { background: #e2f2dd; border-color: #2e7d32; }
.recipe-cell.hint-1 { background: #fdf1d8; border-color: #b08a2e; }
.recipe-cell.hint-0 { background: #fbe2de; border-color: #b0301f; }

/* ---- 事件发生在哪个项目 ---- */
.event-proj { text-align: center; font-size: 11px; font-weight: 800; color: var(--txt-dim); margin-top: -2px; }
.mini-flag.warn { background: #8a5a00; }

/* ---- 窄屏顶栏：5 个状态位不能把数字截断 ---- */
@media (max-width: 380px) {
  .topbar-row { gap: 3px; }
  .chip { gap: 2px; padding: 3px 3px; }
  .chip i { font-size: 10px; }
  .chip b { font-size: 11px; letter-spacing: -.5px; }
}
@media (max-width: 340px) {
  .chip { gap: 1px; padding: 2px 2px; }
  .chip i { font-size: 9px; }
  .chip b { font-size: 10.5px; }
}

/* ---- TapTap 广告：投资人注资卡 ---- */
.ad-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  margin-top: 10px;
  border: 3px solid var(--ink);
  background: linear-gradient(180deg, #fff8e6, #ffe7b8);
  box-shadow: 0 4px 0 rgba(51, 32, 15, .18);
}
.ad-ico { font-size: 26px; line-height: 1; flex: none; }
.ad-card .grow { min-width: 0; flex: 1 1 auto; }
.ad-t { font-weight: 900; font-size: 14px; color: #33200f; }
.ad-s { font-size: 11px; line-height: 1.45; color: #7a5a3a; margin-top: 2px; }
.ad-card .btn { flex: none; }


/* ================= 自研大作 / 媒体评测 / 畅销榜 / 荣誉奖杯 ================= */
.chip.chip-btn { cursor: pointer; user-select: none; }
.chip.chip-btn:active { transform: scale(0.94); }

.orig-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  margin-bottom: 12px;
  background: linear-gradient(135deg, #fff2db 0%, #ffe3b3 100%);
  border: 3px solid var(--ink);
  box-shadow: 0 4px 0 rgba(51, 32, 15, 0.22);
  cursor: pointer;
  transition: transform 0.08s;
}
.orig-banner:active { transform: translateY(2px); box-shadow: 0 2px 0 rgba(51, 32, 15, 0.22); }
.orig-banner-ico { font-size: 32px; flex: none; filter: drop-shadow(0 2px 0 rgba(0,0,0,0.15)); }
.orig-banner-t { font-size: 15px; font-weight: 900; color: #33200f; }
.orig-banner-s { font-size: 11px; color: #7a5a3a; margin-top: 2px; }

/* 自研立项表单 */
.orig-title-row {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}
.orig-input {
  flex: 1;
  padding: 8px 10px;
  font-size: 14px;
  font-weight: 800;
  border: 2px solid var(--ink);
  background: #fff;
  color: var(--txt);
  outline: none;
  border-radius: 4px;
}
.orig-input:focus { border-color: var(--brand-dk); }

.scale-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 12px;
}
.scale-card {
  padding: 8px 10px;
  border: 2px solid var(--line);
  background: var(--paper);
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.1s;
}
.scale-card.on {
  border-color: var(--ink);
  background: #fff9e6;
  box-shadow: 0 3px 0 var(--ink);
  transform: translateY(-1px);
}
.scale-card.locked { opacity: 0.55; cursor: not-allowed; background: #eae2d0; }
.scale-name { font-weight: 900; font-size: 13px; color: var(--txt); }
.scale-desc { font-size: 10px; color: var(--txt-dim); margin-top: 3px; line-height: 1.35; }

/* 研发侧重点 */
.pillar-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-bottom: 10px;
}
.pillar-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 8px;
  border: 2px solid var(--line);
  background: #fff;
  border-radius: 4px;
}
.pillar-info { display: flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 800; }
.pillar-ctrl { display: flex; align-items: center; gap: 6px; }
.pillar-btn {
  width: 22px;
  height: 22px;
  border: 2px solid var(--ink);
  background: var(--paper-2);
  font-weight: 900;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 3px;
}
.pillar-btn:active { background: var(--brand); }
.pillar-val { font-weight: 900; font-size: 13px; min-width: 14px; text-align: center; }

/* 媒体评分与殿堂 */
.review-container {
  margin: 10px 0;
  border: 3px solid var(--ink);
  background: #fff;
  padding: 10px;
  box-shadow: 0 4px 0 rgba(51, 32, 15, 0.18);
}
.review-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 8px;
  border-bottom: 2px dashed var(--line);
  margin-bottom: 8px;
}
.hall-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  font-weight: 900;
  font-size: 12px;
  border-radius: 3px;
  border: 2px solid var(--ink);
}
.hall-badge.platinum {
  background: linear-gradient(135deg, #ffd700, #ffae00);
  color: #3b200f;
  animation: pulse-gold 1.5s infinite alternate;
}
.hall-badge.gold {
  background: #ffecb3;
  color: #6b4c00;
}
.hall-badge.silver {
  background: #e0e0e0;
  color: #424242;
}

@keyframes pulse-gold {
  0% { transform: scale(1); filter: brightness(1); }
  100% { transform: scale(1.04); filter: brightness(1.15); box-shadow: 0 0 10px rgba(255, 215, 0, 0.6); }
}

.reviewer-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.reviewer-card {
  border: 2px solid var(--line);
  background: var(--paper);
  padding: 6px 8px;
  border-radius: 4px;
}
.rev-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 11px;
  font-weight: 800;
  margin-bottom: 4px;
}
.rev-score-paddle {
  background: #33200f;
  color: #ffc93c;
  padding: 1px 6px;
  border-radius: 3px;
  font-weight: 900;
  font-size: 13px;
}
.rev-quote {
  font-size: 10px;
  color: var(--txt-dim);
  line-height: 1.35;
}

/* 玩家弹幕评论 */
.bullet-box {
  background: #2b1f15;
  color: #ffe6a3;
  padding: 6px 10px;
  border-radius: 4px;
  font-size: 11px;
  margin-top: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
  overflow: hidden;
  white-space: nowrap;
}
.bullet-box i { color: #ff5722; font-style: normal; font-weight: 900; }

/* 员工职业头衔与经验条 */
.emp-title-tag {
  background: #e8f4fd;
  color: #1f6fae;
  border: 1px solid #1f6fae;
  padding: 1px 5px;
  font-size: 10px;
  font-weight: 800;
  border-radius: 3px;
  margin-left: 4px;
}
.xp-line {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 3px;
}
.xp-bar {
  flex: 1;
  height: 5px;
  background: #d8c4a0;
  border: 1px solid var(--ink);
  overflow: hidden;
  border-radius: 2px;
}
.xp-bar i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #4caf50, #8bc34a);
}
.sp-tag.burst {
  background: #ff5722 !important;
  color: #fff !important;
  border-color: #d84315 !important;
  animation: pulse-gold 0.8s infinite alternate;
}

/* 发售决择弹窗 */
.shipping-choice {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 10px;
}
.ship-btn-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 3px solid var(--ink);
  background: var(--paper);
  border-radius: 4px;
  cursor: pointer;
  transition: transform 0.08s;
  text-align: left;
}
.ship-btn-card:hover { background: #fff; }
.ship-btn-card:active { transform: translateY(2px); }
.ship-btn-card.polish { border-color: #2470b4; background: #eef7ff; }
.ship-btn-card.rush { border-color: #c0392b; background: #fff1f0; }

/* 畅销榜 */
.chart-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 11px;
}
.chart-table th, .chart-table td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--line);
  text-align: left;
}
.chart-table th { background: var(--paper-2); font-weight: 800; }
.chart-row.player { background: #fff8e1; font-weight: 900; }
.chart-rank {
  display: inline-flex;
  width: 20px;
  height: 20px;
  align-items: center;
  justify-content: center;
  border-radius: 3px;
  font-weight: 900;
  background: #e0d5be;
}
.chart-rank.top1 { background: #ffd700; color: #33200f; }
.chart-rank.top2 { background: #cfd8dc; color: #263238; }
.chart-rank.top3 { background: #ffb74d; color: #3e2723; }

/* 荣誉奖杯陈列室 */
.trophy-shelf {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.trophy-item {
  border: 2px solid var(--ink);
  background: #fffdf5;
  padding: 8px;
  text-align: center;
  border-radius: 4px;
  box-shadow: 0 3px 0 rgba(51, 32, 15, 0.15);
}
.trophy-ico { font-size: 28px; margin-bottom: 4px; filter: drop-shadow(0 2px 0 rgba(0,0,0,0.2)); }
.trophy-name { font-weight: 900; font-size: 11.5px; color: #33200f; }
.trophy-game { font-size: 10px; color: var(--txt-dim); margin-top: 2px; }
