/* ================================
   整个网页
================================ */

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    background-color: #f2f3f7;

    font-family:
        "Microsoft YaHei",
        "PingFang SC",
        Arial,
        sans-serif;

    color: #171744;
}


/* ================================
   角色卡主体
================================ */

.character-sheet {
    width: 900px;
    max-width: calc(100% - 40px);

    margin: 50px auto;
    padding: 55px 65px;

    background-color: white;

    border-radius: 6px;

    box-shadow:
        0 10px 35px rgba(20, 20, 60, 0.08);
}


/* ================================
   顶部标题
================================ */

.sheet-header {
    display: flex;

    justify-content: space-between;
    align-items: center;

    margin-bottom: 60px;
}


h1 {
    margin: 0;

    font-size: 42px;

    letter-spacing: 4px;
}


/* ================================
   基础资料
================================ */

.basic-info {
    display: grid;

    grid-template-columns: 2fr 1fr;

    column-gap: 45px;
    row-gap: 35px;
}


.field {
    display: flex;
    flex-direction: column;
}


.field label {
    margin-bottom: 8px;

    font-size: 15px;
    font-weight: bold;
}


.field input {
    width: 100%;

    padding: 8px 2px;

    font-size: 20px;

    color: #171744;

    background: transparent;

    border: none;
    border-bottom: 2px solid #272755;

    outline: none;

    transition: border-color 0.2s;
}


.field input:focus {
    border-bottom-color: #e02b38;
}


.full-width {
    grid-column: 1 / -1;
}


.section-title {
    margin: 0 0 25px 0;

    font-size: 24px;
    color: #171744;
}

.placeholder-section {
    margin-top: 65px;

    padding: 30px;

    border-top: 1px solid #ddddE8;
}
/* ================================
   手机适配
================================ */

@media (max-width: 650px) {

    .character-sheet {
        margin: 0;

        max-width: none;
        width: 100%;

        padding: 30px 25px;

        border-radius: 0;
    }

    .sheet-header {
        margin-bottom: 40px;
    }

    h1 {
        font-size: 32px;
    }

    .basic-info {
        grid-template-columns: 1fr;
    }

    .full-width {
        grid-column: auto;
    }


}


/* ================================
   现实 ARC
================================ */

.reality-section {
    margin-top: 50px;
    padding-top: 35px;
    border-top: 1px solid #dddde8;
}

.section-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.section-title-row .section-title {
    margin-bottom: 0;
}

.section-code {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: 1px solid #e02b38;
    color: #e02b38;
    font-weight: 800;
    font-size: 13px;
    border-radius: 4px;
}

.reality-selector-row {
    display: grid;
    grid-template-columns: 80px minmax(0, 1fr);
    align-items: center;
    gap: 20px;
    margin-bottom: 18px;
}

.reality-selector-row label {
    font-size: 17px;
    font-weight: 700;
}

.reality-select {
    width: 100%;
    max-width: 360px;
    min-height: 38px;
    border: 1px solid #d8dae4;
    border-radius: 5px;
    background: #fff;
    color: #171744;
    padding: 7px 10px;
    font: inherit;
    cursor: pointer;
    outline: none;
}

.reality-select:focus {
    border-color: #e02b38;
    box-shadow: 0 0 0 2px rgba(224, 43, 56, .10);
}

.reality-details {
    border: 1px solid #e4e5ec;
    border-radius: 7px;
    background: #fff;
    overflow: hidden;
}

.reality-empty {
    padding: 20px;
    color: #8a8c9c;
    font-size: 13px;
}

.reality-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.reality-details.is-empty .reality-content {
    display: none;
}

.reality-details:not(.is-empty) .reality-empty {
    display: none;
}

.reality-rule-card {
    padding: 18px 20px;
}

.reality-rule-card:first-child {
    border-right: 1px solid #eeeef4;
}

.rule-kicker {
    display: block;
    margin-bottom: 5px;
    color: #e02b38;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
}

.reality-rule-card h3 {
    margin: 0 0 8px;
    color: #171744;
    font-size: 17px;
}

.reality-rule-card p {
    margin: 0;
    color: #45455d;
    font-size: 13px;
    line-height: 1.65;
}

.reality-progress {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 13px 20px;
    border-top: 1px solid #eeeef4;
    background: #fafafd;
}

.reality-progress strong {
    color: #171744;
    font-size: 14px;
}

.reality-progress-boxes {
    flex: 1;
    display: flex;
    justify-content: flex-end;
}

@media (max-width: 650px) {
    .reality-selector-row {
        grid-template-columns: 54px minmax(0, 1fr);
        gap: 10px;
    }

    .reality-content {
        grid-template-columns: 1fr;
    }

    .reality-rule-card:first-child {
        border-right: 0;
        border-bottom: 1px solid #eeeef4;
    }
}


/* ARC 色彩系统：异常蓝 / 现实黄 / 职能红 */
:root {
    --arc-anomaly: #2d70c9;
    --arc-reality: #d7a51d;
    --arc-function: #e02b38;
}
.arc-yellow .section-title, .arc-yellow .section-code { color: var(--arc-reality); }
.arc-yellow .section-code { border-color: var(--arc-reality); }
.reality-section .rule-kicker { color: var(--arc-reality); }
.reality-arc-select:focus { border-color: var(--arc-reality); box-shadow: 0 0 0 2px rgba(215,165,29,.12); }

.function-section {
    margin-top: 50px; padding-top: 35px; border-top: 1px solid #dddde8;
}
.arc-red .section-title, .arc-red .section-code { color: var(--arc-function); }
.arc-red .section-code { border-color: var(--arc-function); }
.arc-selector-row {
    display:grid; grid-template-columns:80px minmax(0,1fr); align-items:center;
    gap:20px; margin-bottom:18px;
}
.arc-selector-row label { font-size:17px; font-weight:700; }
.arc-select {
    width:100%; max-width:360px; min-height:38px; border:1px solid #d8dae4;
    border-radius:5px; background:#fff; color:#171744; padding:7px 10px;
    font:inherit; cursor:pointer; outline:none;
}
.function-section .arc-select:focus { border-color:var(--arc-function); box-shadow:0 0 0 2px rgba(224,43,56,.10); }
.function-details { border:1px solid #e4e5ec; border-radius:7px; background:#fff; overflow:hidden; }
.arc-empty { padding:20px; color:#8a8c9c; font-size:13px; }
.function-details.is-empty .function-content { display:none; }
.function-details:not(.is-empty) .arc-empty { display:none; }
.function-content { display:grid; grid-template-columns:1fr 1.15fr; }
.function-directive, .permitted-card { padding:18px 20px; }
.function-directive { border-right:1px solid #eeeef4; }
.function-section .rule-kicker { color:var(--arc-function); }
.function-directive h3 { margin:0 0 8px; color:#171744; font-size:17px; }
.function-directive p, .permitted-card p { color:#45455d; font-size:13px; line-height:1.6; }
.permitted-intro { margin:0 0 9px; }
.permitted-actions { display:grid; gap:7px; }
.permitted-action { display:flex; align-items:center; gap:9px; color:#171744; font-size:13px; cursor:pointer; }
.permitted-action input { accent-color:var(--arc-function); }
.permitted-bonus { margin:12px 0 0; padding-top:10px; border-top:1px solid #eeeef4; font-size:11px !important; color:#77798b !important; }
@media(max-width:650px) {
  .arc-selector-row { grid-template-columns:54px minmax(0,1fr); gap:10px; }
  .function-content { grid-template-columns:1fr; }
  .function-directive { border-right:0; border-bottom:1px solid #eeeef4; }
}


/* 异常 ARC：蓝色 */
.anomaly-section { margin-top:50px; padding-top:35px; border-top:1px solid #dddde8; }
.arc-blue .section-title,.arc-blue .section-code { color:var(--arc-anomaly); }
.arc-blue .section-code { border-color:var(--arc-anomaly); }
.anomaly-select:focus { border-color:var(--arc-anomaly); box-shadow:0 0 0 2px rgba(45,112,201,.10); }
.anomaly-details { border:1px solid #e4e5ec; border-radius:7px; background:#fff; overflow:hidden; }
.anomaly-details.is-empty .anomaly-content { display:none; }
.anomaly-details:not(.is-empty) .arc-empty { display:none; }
.anomaly-note { padding:12px 18px; background:#f6f9fd; border-bottom:1px solid #e5edf8; color:#4c607c; font-size:12px; line-height:1.6; }
.anomaly-abilities { display:grid; grid-template-columns:repeat(3,1fr); }
.ability-card { position:relative; min-height:150px; padding:18px 16px 18px 48px; border-right:1px solid #eeeef4; }
.ability-card:last-child { border-right:0; }
.ability-number { position:absolute; left:16px; top:19px; color:#b7c9e3; font-size:11px; font-weight:800; }
.anomaly-section .rule-kicker { color:var(--arc-anomaly); }
.ability-card h3 { margin:0 0 8px; color:#171744; font-size:17px; }
.ability-card p { margin:0; color:#45455d; font-size:12px; line-height:1.65; }
.ability-qa { position:absolute; right:13px; top:15px; padding:3px 7px; border:1px solid var(--arc-anomaly); border-radius:3px; color:var(--arc-anomaly); font-size:10px; font-weight:800; }
@media(max-width:760px){
 .anomaly-abilities{grid-template-columns:1fr;}
 .ability-card{border-right:0;border-bottom:1px solid #eeeef4;}
 .ability-card:last-child{border-bottom:0;}
}


/* 异常 ARC v2：宽幅能力卡 */
.anomaly-abilities { display:flex; flex-direction:column; }
.ability-card-expanded {
  position:relative; min-height:0; padding:22px 24px 18px;
  border-right:0; border-bottom:1px solid #e8eaf0;
}
.ability-card-expanded:last-child { border-bottom:0; }
.ability-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:12px; }
.ability-card-expanded h3 { margin:3px 0 0; font-size:21px; }
.ability-card-expanded .ability-qa { position:static; flex:0 0 auto; font-size:11px; padding:5px 9px; }
.ability-trigger { padding:11px 13px; border-left:3px solid var(--arc-anomaly); background:#f7f9fc; color:#34344d; font-size:13px; line-height:1.7; }
.ability-rule-grid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; margin-top:14px; }
.ability-rule { padding:12px 13px; border:1px solid #e4e7ee; border-radius:5px; background:#fff; }
.ability-rule span { display:block; margin-bottom:6px; color:var(--arc-anomaly); font-size:11px; font-weight:800; letter-spacing:.04em; }
.ability-rule.failure span { color:#d44a56; }
.ability-rule p { margin:0; color:#45455d; font-size:12px; line-height:1.7; }
.ability-status { display:flex; justify-content:flex-end; gap:20px; margin-top:15px; padding-top:12px; border-top:1px dashed #dfe3eb; }
.ability-status label { display:flex; align-items:center; gap:7px; color:#34344d; font-size:12px; font-weight:700; cursor:pointer; }
.ability-status input { width:16px; height:16px; accent-color:var(--arc-anomaly); cursor:pointer; }
@media(max-width:760px){
  .ability-rule-grid { grid-template-columns:1fr; }
  .ability-status { justify-content:flex-start; }
}

.ability-growth{display:grid;grid-template-columns:145px minmax(170px,.8fr) minmax(300px,1.35fr);gap:12px 18px;align-items:start;margin-top:14px;padding-top:11px;border-top:1px dashed #dfe3eb}.growth-status{display:grid;gap:5px;font-size:12px}.growth-status>span{font-size:10px;color:#8b8e9d;font-weight:800}.growth-status label{display:flex;align-items:center;gap:6px;font-weight:700}.growth-status input{accent-color:var(--arc-anomaly)}.growth-question{padding-top:17px;font-size:12px;line-height:1.5;color:#34344d}.growth-answers{display:grid;gap:6px;padding-top:14px}.growth-answer-row{display:grid;grid-template-columns:minmax(0,1fr) auto 28px;gap:8px;align-items:center;font-size:12px;color:#34344d}.growth-boxes{display:flex;gap:4px}.growth-box{width:13px;height:13px;padding:0;border:1px solid #9eb6d7;border-radius:2px;background:#fff;cursor:pointer}.growth-box.filled{background:var(--arc-anomaly);border-color:var(--arc-anomaly)}.growth-code{font-size:11px;color:#171744;text-align:right}.ability-status{display:none!important}@media(max-width:760px){.ability-growth{grid-template-columns:1fr;gap:7px}.growth-question,.growth-answers{padding-top:0}.growth-status{grid-template-columns:auto auto auto;justify-content:start;gap:14px}}


/* 人际关系 v1 */
.relationship-section{margin-top:30px;border-top:1px solid #e3e5eb;padding-top:24px}
.relationship-title-row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:14px}
.relationship-subtitle{margin:5px 0 0;color:#858797;font-size:12px}
.relationship-add{border:1px solid #b8bdca;background:#fff;color:#242544;border-radius:5px;padding:8px 12px;font-weight:700;cursor:pointer}
.relationship-add:hover{background:#f5f6f9}
.relationship-list{display:grid;gap:16px}
.relationship-card{border:1px solid #dfe2e9;border-radius:7px;background:#fff;padding:18px 20px;box-shadow:0 1px 0 rgba(20,20,50,.02)}
.relationship-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.relationship-number{font-size:11px;font-weight:800;letter-spacing:.08em;color:#777b8c}
.network-badge{display:none;margin-left:10px;padding:3px 7px;border-radius:999px;background:#edf1f8;color:#253c68;font-size:10px;font-weight:800}
.network-member .network-badge{display:inline-block}
.relationship-delete{border:0;background:transparent;color:#a34a52;font-size:11px;cursor:pointer;padding:4px 6px}
.relationship-fields{display:grid;grid-template-columns:1.5fr 1fr;gap:14px}
.relationship-card label{display:grid;gap:6px;color:#747787;font-size:10px;font-weight:800;letter-spacing:.05em}
.relationship-card input[type=text],.relationship-card textarea,.relationship-card select{width:100%;box-sizing:border-box;border:1px solid #d9dce5;border-radius:4px;background:#fbfbfd;color:#292a42;font:inherit;font-size:13px;padding:9px 10px;outline:none}
.relationship-card input[type=text]:focus,.relationship-card textarea:focus,.relationship-card select:focus{border-color:#8999b5;background:#fff}
.relationship-description-label{margin-top:13px}.relationship-description{min-height:118px;resize:vertical;line-height:1.65}
.relationship-link-row{display:grid;grid-template-columns:1fr auto;align-items:end;gap:18px;margin-top:15px;padding-top:13px;border-top:1px dashed #e0e2e8}
.relationship-meta-label{display:block;margin-bottom:7px;color:#777b8c;font-size:10px;font-weight:800;letter-spacing:.06em}
.relationship-link-track{display:flex;gap:7px;flex-wrap:wrap}.relationship-link-point{width:20px;height:20px;border:1px solid #9ca8bc;background:#fff;clip-path:polygon(50% 5%,96% 92%,4% 92%);cursor:pointer}.relationship-link-point.filled{background:#334b75;border-color:#334b75}.relationship-link-value{font-size:13px;color:#292a42;padding-bottom:2px}
.relationship-bonus-row{display:grid;grid-template-columns:minmax(240px,1fr) auto;align-items:end;gap:18px;margin-top:14px}.relationship-used-label{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center;gap:7px!important;font-size:12px!important;color:#34354d!important;letter-spacing:0!important;padding-bottom:8px}.relationship-used-label input{accent-color:#334b75}
@media(max-width:760px){.relationship-title-row{align-items:flex-start;flex-direction:column}.relationship-fields,.relationship-bonus-row{grid-template-columns:1fr}.relationship-used-label{padding-bottom:0}.relationship-card{padding:16px}.relationship-description{min-height:140px}}

/* ========================================
   人际关系 v2 · 现实（黄色）视觉系统
======================================== */
.relationship-section{
  margin-top:38px;
  padding-top:30px;
  border-top:1px solid #e6dfc8;
}
.relationship-title-row{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:16px;
}
.relationship-section .section-title{
  margin-bottom:0;
  color:var(--arc-reality);
}
.relationship-subtitle{
  margin:6px 0 0;
  color:#858797;
  font-size:12px;
}
.relationship-add{
  border:1px solid rgba(215,165,29,.62);
  background:#fffaf0;
  color:#72540d;
  border-radius:5px;
  padding:8px 12px;
  font-weight:800;
  cursor:pointer;
  transition:background .18s,border-color .18s;
}
.relationship-add:hover{
  background:#fff4d6;
  border-color:var(--arc-reality);
}
.relationship-list{display:grid;gap:18px}
.relationship-card{
  position:relative;
  overflow:hidden;
  border:1px solid #e5e0d3;
  border-radius:7px;
  background:#fff;
  padding:19px 21px 20px;
  box-shadow:0 1px 0 rgba(20,20,50,.025);
}
.relationship-card::before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;
  width:4px;
  background:var(--arc-reality);
}
.relationship-card-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:16px;
  padding-bottom:10px;
  border-bottom:1px solid #eee8d8;
}
.relationship-heading{display:flex;align-items:center;gap:9px}
.relationship-number{
  font-size:11px;
  font-weight:900;
  letter-spacing:.1em;
  color:#806216;
}
.network-badge{
  display:none;
  margin-left:0;
  padding:3px 8px;
  border:1px solid rgba(215,165,29,.38);
  border-radius:999px;
  background:#fff5d6;
  color:#795b0e;
  font-size:10px;
  font-weight:900;
}
.network-member .network-badge{display:inline-block}
.relationship-delete{
  border:0;
  background:transparent;
  color:#9b6969;
  font-size:11px;
  cursor:pointer;
  padding:4px 6px;
}
.relationship-delete:hover{color:#c43d48}
.relationship-fields{
  display:grid;
  grid-template-columns:1.5fr 1fr;
  gap:16px;
}
.relationship-card label{
  display:grid;
  gap:7px;
  color:#686b7d;
  font-size:11px;
  font-weight:800;
  letter-spacing:.04em;
}
.relationship-card input[type=text],
.relationship-card textarea,
.relationship-card select{
  width:100%;
  box-sizing:border-box;
  border:1px solid #ded9cb;
  border-radius:4px;
  background:#fffdfa;
  color:#292a42;
  font:inherit;
  font-size:13px;
  padding:9px 10px;
  outline:none;
  transition:border-color .18s,box-shadow .18s,background .18s;
}
.relationship-card input[type=text]:focus,
.relationship-card textarea:focus,
.relationship-card select:focus{
  border-color:var(--arc-reality);
  box-shadow:0 0 0 2px rgba(215,165,29,.10);
  background:#fff;
}
.relationship-description-label{margin-top:14px}
.relationship-description{min-height:150px;resize:vertical;line-height:1.7}
.relationship-link-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  margin-top:16px;
  padding-top:14px;
  border-top:1px dashed #e2dccd;
}
.relationship-link-group{min-width:0}
.relationship-meta-label{
  display:block;
  margin-bottom:8px;
  color:#756f61;
  font-size:10px;
  font-weight:900;
  letter-spacing:.07em;
}
.relationship-link-track{
  display:flex;
  gap:7px;
  align-items:center;
  flex-wrap:wrap;
}
.relationship-link-point{
  width:17px;
  height:17px;
  padding:0;
  border:2px solid #c5a856;
  border-radius:50%;
  background:#fff;
  cursor:pointer;
  appearance:none;
  clip-path:none;
  transition:transform .12s,background .12s,border-color .12s;
}
.relationship-link-point:hover{
  transform:scale(1.08);
  border-color:var(--arc-reality);
}
.relationship-link-point.filled{
  background:var(--arc-reality);
  border-color:var(--arc-reality);
}
.relationship-link-value{
  flex:none;
  min-width:42px;
  padding-bottom:0;
  color:#615021;
  font-size:13px;
  font-variant-numeric:tabular-nums;
  text-align:right;
}
.relationship-bonus-row{
  display:grid;
  grid-template-columns:minmax(240px,1fr) auto;
  align-items:end;
  gap:18px;
  margin-top:16px;
}
.relationship-used-label{
  display:flex!important;
  grid-template-columns:auto 1fr!important;
  align-items:center;
  gap:7px!important;
  padding-bottom:8px;
  color:#34354d!important;
  font-size:12px!important;
  letter-spacing:0!important;
}
.relationship-used-label input{accent-color:var(--arc-reality)}
.relationship-bonus-description{
  margin-top:12px;
  padding:13px 14px 14px;
  border-left:3px solid var(--arc-reality);
  background:#fffaf0;
}
.relationship-bonus-description.is-empty{display:none}
.relationship-bonus-title{
  display:block;
  margin-bottom:6px;
  color:#6e5312;
  font-size:12px;
  font-weight:900;
}
.relationship-bonus-description p{
  margin:0;
  color:#3e3d46;
  font-size:12px;
  line-height:1.7;
}
@media(max-width:760px){
  .relationship-title-row{align-items:flex-start;flex-direction:column}
  .relationship-fields,.relationship-bonus-row{grid-template-columns:1fr}
  .relationship-used-label{padding-bottom:0}
  .relationship-card{padding:17px 16px 18px 19px}
  .relationship-description{min-height:160px}
  .relationship-link-row{align-items:center}
  .relationship-link-track{gap:6px}
  .relationship-link-point{width:16px;height:16px}
}


/* ========================================
   多页面角色档案 v1
======================================== */
body{background:#eef0f5}
.sheet-app{
  width:min(1180px,calc(100% - 32px));
  margin:34px auto 56px;
  display:grid;
  grid-template-columns:150px minmax(0,1fr);
  gap:0;
  align-items:start;
}
.character-sheet{
  width:100%;max-width:none;margin:0;padding:44px 36px 56px;
  border-radius:0 7px 7px 0;min-height:900px;
}
.sheet-tabs{
  position:sticky;top:24px;
  display:flex;flex-direction:column;
  padding:18px 0 16px;
  background:#171744;color:#fff;
  border-radius:7px 0 0 7px;overflow:hidden;
  box-shadow:0 10px 35px rgba(20,20,60,.08);
}
.tabs-brand{padding:0 18px 16px;color:#e02b38;font-size:30px;line-height:1;border-bottom:1px solid rgba(255,255,255,.12)}
.sheet-tab{
  display:grid;gap:4px;width:100%;padding:15px 16px;
  border:0;border-left:4px solid transparent;background:transparent;
  color:#cfd0dc;text-align:left;cursor:pointer;font:inherit;font-size:13px;font-weight:800;
}
.sheet-tab:hover{background:rgba(255,255,255,.06);color:#fff}
.sheet-tab.active{background:#fff;color:#171744;border-left-color:#e02b38}
.tab-index{font-size:9px;letter-spacing:.14em;color:#8c8ea4}.sheet-tab.active .tab-index{color:#e02b38}
.sheet-page{display:none}.sheet-page.active{display:block}
.sheet-header{margin-bottom:46px}

/* 详细 ARC 的下拉已移到顶部 */
.anomaly-section,.reality-section,.function-section{scroll-margin-top:20px}

/* 次级页面 */
.page-heading{display:flex;gap:17px;align-items:flex-start;margin:2px 0 30px;padding-bottom:19px;border-bottom:1px solid #e3e4ea}
.page-number{font-size:30px;font-weight:300;color:#c7c8d2;line-height:1}.page-heading p{margin:0 0 4px;color:#e02b38;font-size:9px;font-weight:900;letter-spacing:.18em}.page-heading h2{margin:0;font-size:27px;letter-spacing:.04em}.page-heading div>span{display:block;margin-top:6px;color:#818394;font-size:12px}
.placeholder-section{margin-top:34px;padding-top:27px;border-top:1px solid #e5e1d6}.placeholder-card{padding:19px 20px;border:1px dashed #cfd1da;border-radius:7px;background:#fafafe}.placeholder-card strong{font-size:13px}.placeholder-card p{margin:7px 0 0;color:#767889;font-size:12px;line-height:1.65}
.balance-preview{display:grid;gap:12px}.balance-lane{display:grid;grid-template-columns:64px 1fr;gap:16px;align-items:center;padding:16px 18px;border:1px solid #e1e2e8;border-radius:7px;background:#fff}.balance-lane>span{display:grid;place-items:center;width:52px;height:52px;clip-path:polygon(50% 0,100% 100%,0 100%);padding-top:13px;color:#fff;font-size:22px;font-weight:900}.balance-lane small{display:block;margin-bottom:2px;font-weight:900}.balance-lane strong{font-size:15px}.balance-lane p{margin:4px 0 0;color:#747687;font-size:11px;line-height:1.55}.balance-function>span{background:var(--arc-function)}.balance-function small{color:var(--arc-function)}.balance-reality>span{background:#f3ad2f}.balance-reality small{color:#b67a00}.balance-anomaly>span{background:var(--arc-anomaly)}.balance-anomaly small{color:var(--arc-anomaly)}.balance-placeholder{margin-top:16px}

@media(max-width:900px){
  .sheet-app{width:min(100% - 20px,900px);grid-template-columns:1fr;margin:10px auto 30px}
  .sheet-tabs{position:sticky;top:0;z-index:30;display:grid;grid-template-columns:repeat(3,1fr);padding:0;border-radius:6px 6px 0 0}
  .tabs-brand{display:none}.sheet-tab{border-left:0;border-bottom:3px solid transparent;padding:11px 10px;text-align:center}.sheet-tab.active{border-bottom-color:#e02b38}
  .character-sheet{border-radius:0 0 6px 6px;padding:36px 30px 44px}
}
@media(max-width:620px){
  .character-sheet{padding:28px 18px 38px}.sheet-header{margin-bottom:34px}.page-heading h2{font-size:23px}
}


/* ========================================
   多页面角色档案 v2：书签导航与 ARC 总览
======================================== */
.sheet-app{
  grid-template-columns:132px minmax(0,1fr);
  gap:14px;
}
.character-sheet{
  border-radius:10px;
}
.sheet-tabs{
  position:sticky;
  top:24px;
  padding:10px;
  gap:10px;
  background:transparent;
  color:#171744;
  border-radius:0;
  overflow:visible;
  box-shadow:none;
}
.tabs-brand{
  width:44px;
  height:44px;
  margin:0 auto 6px;
  padding:0;
  display:grid;
  place-items:center;
  color:#e52d3a;
  font-size:24px;
  border:0;
}
.sheet-tab{
  position:relative;
  width:100%;
  min-height:88px;
  padding:13px 10px 12px;
  display:grid;
  grid-template-columns:32px minmax(0,1fr);
  align-items:center;
  gap:9px;
  border:1px solid #d9dce6;
  border-left:1px solid #d9dce6;
  border-radius:13px;
  background:#fff;
  color:#5e6276;
  text-align:left;
  box-shadow:0 5px 16px rgba(30,32,60,.055);
  transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease;
}
.sheet-tab:hover{
  transform:translateY(-1px);
  background:#fff;
  color:#171744;
  border-color:#bfc4d2;
  box-shadow:0 8px 20px rgba(30,32,60,.09);
}
.sheet-tab.active{
  background:#fff;
  color:#171744;
  border:1px solid #e52d3a;
  box-shadow:0 8px 22px rgba(229,45,58,.10);
}
.bookmark-icon{
  position:relative;
  display:block;
  width:24px;
  height:31px;
  margin:auto;
  border:3px solid currentColor;
  border-bottom:0;
  border-radius:4px 4px 1px 1px;
  color:#9b9eae;
}
.bookmark-icon::after{
  content:"";
  position:absolute;
  left:3px;
  right:3px;
  bottom:-7px;
  height:14px;
  background:#fff;
  border-left:3px solid currentColor;
  border-bottom:3px solid currentColor;
  transform:rotate(-45deg) skew(6deg,6deg);
  transform-origin:center;
}
.sheet-tab.active .bookmark-icon{color:#e52d3a}
.tab-copy{display:grid;gap:4px;min-width:0}
.tab-index{font-size:9px;letter-spacing:.16em;color:#a0a3b1}
.sheet-tab.active .tab-index{color:#e52d3a}
.tab-label{font-size:12px;font-weight:850;line-height:1.35}
.sheet-page{display:none!important}
.sheet-page.active{display:block!important}

/* 详细 ARC 仍显示当前选择，但不重复放下拉菜单 */
.arc-detail-heading{
  align-items:flex-end;
  margin-bottom:18px;
}
.arc-detail-heading>div{display:grid;gap:3px}
.arc-detail-kicker{
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
}
.arc-blue .arc-detail-kicker,.arc-blue .section-code{color:var(--arc-anomaly);border-color:var(--arc-anomaly)}
.arc-yellow .arc-detail-kicker,.arc-yellow .section-code{color:#d89313;border-color:#f3a62a}
.arc-red .arc-detail-kicker,.arc-red .section-code{color:var(--arc-function);border-color:var(--arc-function)}
.arc-detail-heading .section-title{
  margin:0;
  font-size:25px;
}
.arc-blue .section-title{color:var(--arc-anomaly)}
.arc-yellow .section-title{color:#d89313}
.arc-red .section-title{color:var(--arc-function)}

@media(max-width:900px){
  .sheet-app{grid-template-columns:1fr;gap:0}
  .sheet-tabs{
    top:0;
    z-index:30;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:7px;
    padding:8px;
    background:#eef0f5;
  }
  .tabs-brand{display:none}
  .sheet-tab{
    min-height:58px;
    grid-template-columns:24px 1fr;
    padding:8px 10px;
    border-bottom:1px solid #d9dce6;
    text-align:left;
  }
  .sheet-tab.active{border:1px solid #e52d3a}
  .bookmark-icon{width:18px;height:23px;border-width:2px}
  .bookmark-icon::after{left:2px;right:2px;bottom:-5px;height:10px;border-left-width:2px;border-bottom-width:2px}
}
@media(max-width:620px){
  .sheet-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sheet-tab{grid-template-columns:1fr;justify-items:center;text-align:center;gap:4px}
  .tab-index{display:none}
  .tab-label{font-size:10px}
}

/* ========================================
   多页面角色档案 v3：资产 / 成长页
======================================== */
/* 关系与资产页：资产结构 */
.asset-section{
  margin-top:38px;
  padding-top:30px;
  border-top:1px solid #e7e3d8;
  scroll-margin-top:24px;
}
.relationship-section{scroll-margin-top:24px}
.asset-title-row{align-items:flex-end;gap:16px}
.module-status{
  flex:0 0 auto;
  padding:5px 8px;
  border:1px solid #d8dae2;
  border-radius:999px;
  color:#90929f;
  font-size:9px;
  font-weight:850;
  letter-spacing:.11em;
}
.asset-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:15px;
}
.asset-panel{
  min-height:220px;
  padding:18px 19px;
  border:1px solid #dedfe5;
  border-radius:8px;
  background:#fff;
  position:relative;
  overflow:hidden;
}
.asset-panel::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:#a1a4af;
}
.requisition-panel::before{background:#777d8d}
.benefit-panel::before{background:var(--arc-reality)}
.asset-panel-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}
.asset-kicker{
  display:block;
  color:#999ba7;
  font-size:9px;
  font-weight:900;
  letter-spacing:.15em;
}
.asset-panel h3{margin:3px 0 0;font-size:18px;color:#171744}
.asset-panel-head>strong{
  font-size:28px;
  line-height:1;
  font-weight:350;
  color:#c2c4cc;
}
.asset-panel>p{
  margin:15px 0 0;
  color:#767886;
  font-size:11px;
  line-height:1.7;
}
.asset-empty{
  margin-top:22px;
  padding:18px 14px;
  border:1px dashed #d6d7dd;
  border-radius:6px;
  background:#fafafd;
  color:#aaaab4;
  text-align:center;
  font-size:11px;
}

/* 工作 / 生活页：正式结构框架 */
.balance-dashboard{
  padding:21px 22px 22px;
  border:1px solid #dedfe6;
  border-radius:9px;
  background:#fbfbfd;
}
.balance-dashboard-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  margin-bottom:16px;
  padding-bottom:14px;
  border-bottom:1px solid #e5e5eb;
}
.balance-eyebrow{
  display:block;
  color:#8e909d;
  font-size:9px;
  font-weight:900;
  letter-spacing:.16em;
}
.balance-dashboard-head h3{margin:3px 0 0;font-size:19px;color:#171744}
.balance-preview{gap:10px}
.balance-lane{
  grid-template-columns:64px minmax(180px,.85fr) minmax(220px,1fr);
  gap:18px;
  padding:15px 17px;
  border-radius:7px;
  background:#fff;
}
.balance-lane-copy{min-width:0}
.balance-lane-copy strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.balance-track-shell{min-width:0}
.balance-track-shell>span{
  display:block;
  margin-bottom:6px;
  color:#8b8d9a;
  font-size:9px;
  font-weight:850;
  letter-spacing:.08em;
}
.balance-track-disabled{
  padding:10px 12px;
  border:1px dashed #d7d8de;
  border-radius:5px;
  background:#fafafd;
  color:#a0a1ab;
  font-size:10px;
}
.balance-next-section{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:14px;
}
.balance-info-card{
  padding:16px 17px;
  border:1px solid #e2e3e8;
  border-radius:7px;
  background:#fff;
}
.balance-info-card>span{display:block;color:#989aa7;font-size:9px;font-weight:900;letter-spacing:.09em}
.balance-info-card>strong{display:block;margin-top:4px;font-size:14px;color:#171744}
.balance-info-card>p{margin:7px 0 0;color:#797b89;font-size:11px;line-height:1.65}

@media(max-width:900px){
  .asset-grid,.balance-next-section{grid-template-columns:1fr}
  .balance-lane{grid-template-columns:58px 1fr}
  .balance-track-shell{grid-column:2}
}
@media(max-width:620px){
  .balance-dashboard{padding:16px 14px}
  .balance-dashboard-head{align-items:flex-start}
  .balance-lane{grid-template-columns:52px minmax(0,1fr);gap:12px;padding:14px}
  .balance-lane>span{width:46px;height:46px;font-size:20px}
  .asset-panel{min-height:190px}
}


/* ========================================
   申购物资 v1
   ======================================== */
.requisition-title-row{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:13px}
.requisition-add{border:1px solid #aeb4c2;background:#fff;color:#22233f;border-radius:5px;padding:8px 12px;font-size:11px;font-weight:800;cursor:pointer;transition:.15s ease}
.requisition-add:hover{background:#f4f5f8;border-color:#8e95a5}
.requisition-summary-line{display:flex;align-items:baseline;gap:7px;margin:0 0 12px;color:#8b8d9a;font-size:10px;font-weight:800;letter-spacing:.05em}
.requisition-summary-line strong{color:#292a43;font-size:12px;letter-spacing:0}
.requisition-list{display:grid;gap:16px}
.requisition-card{position:relative;border:1px solid #dfe2e9;border-radius:8px;background:#fff;padding:18px 20px 17px;box-shadow:0 1px 0 rgba(20,20,50,.02);overflow:hidden}
.requisition-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#777d8d}
.requisition-card.is-function::before{background:var(--arc-function)}
.requisition-card-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}
.requisition-heading{display:flex;align-items:center;gap:8px;min-width:0}
.requisition-number{font-size:10px;font-weight:900;letter-spacing:.09em;color:#777b8c}
.requisition-source{display:inline-flex;align-items:center;padding:3px 7px;border-radius:999px;font-size:9px;font-weight:900;letter-spacing:.04em;white-space:nowrap}
.requisition-source.source-function{background:#fff0ef;color:#ba3e43;border:1px solid #f0c7c7}
.requisition-source.source-custom{background:#f1f2f5;color:#6f7380;border:1px solid #dedfe5}
.requisition-delete{border:0;background:transparent;color:#a34a52;font-size:11px;cursor:pointer;padding:4px 6px}
.requisition-delete:hover{color:#c43d48}
.requisition-lock{color:#a0a2ad;font-size:9px;font-weight:800;letter-spacing:.05em}
.requisition-card label{display:grid;gap:6px;color:#747787;font-size:10px;font-weight:800;letter-spacing:.05em}
.requisition-card input[type=text],.requisition-card textarea{width:100%;box-sizing:border-box;border:1px solid #d9dce5;border-radius:4px;background:#fbfbfd;color:#292a42;font:inherit;font-size:13px;padding:9px 10px;outline:none}
.requisition-card input[type=text]:focus,.requisition-card textarea:focus{border-color:#8d94a5;background:#fff}
.requisition-card input[readonly],.requisition-card textarea[readonly]{background:#f7f7f9;color:#4d4f5f;border-color:#e3e4e9;cursor:default}
.requisition-name-label{max-width:520px}
.requisition-description-label{margin-top:13px}
.requisition-description{min-height:122px;resize:vertical;line-height:1.68}
.requisition-card textarea[readonly]{resize:none}
.requisition-status-row{display:flex;justify-content:flex-end;align-items:center;margin-top:13px;padding-top:12px;border-top:1px dashed #e0e2e8}
.requisition-used-label{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center;gap:7px!important;color:#34354d!important;font-size:11px!important;letter-spacing:0!important;cursor:pointer}
.requisition-used-label input{accent-color:#555d70}
.requisition-card.is-function .requisition-used-label input{accent-color:var(--arc-function)}
.requisition-empty{padding:28px 20px;border:1px dashed #d6d8df;border-radius:7px;background:#fafafd;color:#a0a1ac;text-align:center;font-size:11px;line-height:1.65}
#requisitionOverviewNames{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:760px){
  .requisition-title-row{align-items:flex-start;flex-direction:column}
  .requisition-card{padding:16px 16px 15px 19px}
  .requisition-name-label{max-width:none}
  .requisition-description{min-height:145px}
}

/* ========================================
   视觉修正 · 申购物资 / ARC 标题
======================================== */
.requisition-section .section-title{color:#171744!important}
.requisition-add{
  border:1px solid rgba(224,43,56,.58)!important;
  background:#fff7f7!important;
  color:#a92832!important;
  border-radius:5px!important;
  padding:8px 12px!important;
  font-weight:800!important;
}
.requisition-add:hover{background:#fff0f1!important;border-color:var(--arc-function)!important}
.arc-detail-kicker{text-transform:none;font-size:11px;letter-spacing:.1em}
.arc-detail-heading .section-title{font-size:31px;line-height:1.05}

/* ========================================
   工作 / 生活平衡 v1
======================================== */
.life-dashboard{padding:22px;border:1px solid #dfe1e7;border-radius:9px;background:#fff;margin-bottom:16px}
.life-dashboard-top{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}
.life-dashboard-top h3{margin:3px 0 6px;color:#171744;font-size:22px}
.life-dashboard-top p{max-width:620px;margin:0;color:#747687;font-size:11px;line-height:1.7}
.life-time-counter{min-width:145px;text-align:right}
.life-time-counter>span{display:block;color:#8d8f9b;font-size:9px;font-weight:900;letter-spacing:.08em}
.life-time-counter strong{display:block;margin-top:2px;color:#171744;font-size:26px;font-variant-numeric:tabular-nums}
.life-time-counter strong b{font-size:32px}
.life-time-counter small{display:block;color:#999ba7;font-size:10px}
.life-allocation-bar{display:flex;height:9px;margin-top:19px;border-radius:999px;overflow:hidden;background:#eceef2}
.life-allocation-bar span{display:block;width:0;transition:width .2s ease}
.allocation-c{background:var(--arc-function)}.allocation-r{background:var(--arc-reality)}.allocation-a{background:var(--arc-anomaly)}
.life-allocation-legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:9px;color:#696b7a;font-size:10px;font-weight:800}
.life-allocation-legend span::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}
.life-allocation-legend .legend-c::before{background:var(--arc-function)}
.life-allocation-legend .legend-r::before{background:var(--arc-reality)}
.life-allocation-legend .legend-a::before{background:var(--arc-anomaly)}

.life-tracks{display:grid;gap:15px}
.life-track-card{--track-color:#777;position:relative;overflow:hidden;border:1px solid #dfe2e8;border-radius:9px;background:#fff;padding:18px 19px 17px}
.life-track-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--track-color)}
.track-c{--track-color:var(--arc-function)}.track-r{--track-color:var(--arc-reality)}.track-a{--track-color:var(--arc-anomaly)}
.life-track-head{display:flex;align-items:center;justify-content:space-between;gap:20px}
.life-track-ident{display:flex;align-items:center;gap:12px;min-width:0}
.life-track-letter{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--track-color);color:#fff;font-size:17px;font-weight:900}
.life-track-ident small{display:block;color:var(--track-color);font-size:9px;font-weight:900;letter-spacing:.12em}
.life-track-ident h3{margin:2px 0 0;color:#23243f;font-size:16px;font-weight:900}
.spend-time-button{border:1px solid color-mix(in srgb,var(--track-color) 50%,white);background:#fff;color:var(--track-color);border-radius:5px;padding:8px 11px;font-size:10px;font-weight:900;cursor:pointer}
.spend-time-button:hover{background:color-mix(in srgb,var(--track-color) 7%,white)}
.spend-time-button:disabled{opacity:.4;cursor:not-allowed}
.life-track-status{display:flex;flex-wrap:wrap;gap:14px;margin:13px 0 9px;padding-top:11px;border-top:1px solid #ececf1;color:#8b8d9a;font-size:9px;font-weight:800}
.life-track-status b{color:#414252;font-size:10px}
.life-track-grid{display:grid;grid-template-columns:repeat(15,minmax(0,1fr));gap:5px}
.life-cell{height:23px;padding:0;border:1px solid #d8dce5;border-radius:4px;background:#fff;position:relative;cursor:default}
.life-cell.open{background:#fff}
.life-cell.marked{background:var(--track-color);border-color:var(--track-color)}
.life-cell.marked::after{content:"";position:absolute;inset:5px;border:1px solid rgba(255,255,255,.72);border-radius:2px}
.life-cell.struck{background:#f3f3f5;border-color:#dedfe4}
.life-cell.struck::before,.life-cell.struck::after{content:"";position:absolute;left:3px;right:3px;top:50%;height:1px;background:#aaaeba}
.life-cell.struck::before{transform:rotate(28deg)}.life-cell.struck::after{transform:rotate(-28deg)}
.life-track-benefit{margin:11px 0 0;color:#737584;font-size:10px;line-height:1.65}
.life-note-panel{display:flex;align-items:center;flex-wrap:wrap;gap:14px;margin-top:14px;padding:13px 15px;border:1px solid #e1e3e8;border-radius:7px;background:#fbfbfd;color:#777987;font-size:10px}
.life-note-panel>strong{color:#34354d}.life-note-panel>span{display:flex;align-items:center;gap:5px}.life-note-panel .sample{display:inline-block;width:15px;height:15px;border:1px solid #d6d9e1;border-radius:3px;background:#fff;position:relative}.life-note-panel .sample.marked{background:#555d70}.life-note-panel .sample.struck{background:#f0f1f3}.life-note-panel .sample.struck::after{content:"×";position:absolute;inset:-3px 0 0;text-align:center;color:#9da0aa}.life-note-panel p{flex-basis:100%;margin:0;padding-top:8px;border-top:1px solid #e7e8ec;line-height:1.6}

.life-modal-backdrop{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:20px;background:rgba(17,18,40,.48);backdrop-filter:blur(2px)}
.life-modal-backdrop[hidden]{display:none}
.life-modal{width:min(560px,100%);max-height:min(760px,calc(100vh - 40px));overflow:auto;border-radius:9px;background:#fff;box-shadow:0 24px 70px rgba(10,10,30,.28);padding:20px}
.life-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-bottom:13px;border-bottom:1px solid #e8e8ed}
.life-modal-head span{color:#9294a1;font-size:9px;font-weight:900;letter-spacing:.12em}.life-modal-head h3{margin:4px 0 0;color:#171744;font-size:19px}
.life-modal-head button{border:0;background:transparent;color:#8d8f9c;font-size:24px;line-height:1;cursor:pointer}
.life-modal-body{display:grid;gap:13px;padding:16px 0;color:#3d3e50;font-size:12px;line-height:1.6}
.life-modal-summary{padding:11px 12px;border-left:3px solid var(--modal-color,#777);background:#fafafd}
.life-modal-field{display:grid;gap:6px}.life-modal-field>span{color:#747686;font-size:10px;font-weight:900;letter-spacing:.04em}
.life-modal-field select{width:100%;border:1px solid #d8dbe4;border-radius:5px;background:#fff;color:#2f3048;padding:9px 10px;font:inherit;font-size:12px}
.life-modal-choice{display:grid;gap:7px}.life-modal-choice label{display:flex;align-items:flex-start;gap:8px;padding:10px 11px;border:1px solid #e0e2e8;border-radius:5px;cursor:pointer}.life-modal-choice input{margin-top:2px}
.life-modal-warning{color:#a45a31;font-size:10px}.life-modal-actions{display:flex;justify-content:flex-end;gap:9px;padding-top:13px;border-top:1px solid #e8e8ed}.life-modal-actions button{border-radius:5px;padding:8px 13px;font-size:11px;font-weight:900;cursor:pointer}.modal-cancel{border:1px solid #d7dae2;background:#fff;color:#646675}.modal-confirm{border:1px solid var(--modal-color,#171744);background:var(--modal-color,#171744);color:#fff}

@media(max-width:760px){
  .arc-detail-heading .section-title{font-size:27px}
  .life-dashboard-top,.life-track-head{align-items:flex-start;flex-direction:column}
  .life-time-counter{text-align:left;min-width:0}
  .life-track-grid{grid-template-columns:repeat(10,minmax(0,1fr))}
  .spend-time-button{width:100%}
}
/* 标题统一使用主文字色，主题色保留在卡片、边框和按钮。 */
.relationship-section .section-title,
.requisition-section .section-title{color:#171744!important}

/* ========================================
   工作 / 生活平衡 v2：任务评优、撤销、重置
======================================== */
.life-awards-panel{margin:0 0 16px;padding:20px;border:1px solid #dfe1e7;border-radius:9px;background:#fff}
.life-awards-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding-bottom:14px;border-bottom:1px solid #ececf1}
.life-awards-head h3{margin:3px 0 5px;color:#171744;font-size:19px}.life-awards-head p{margin:0;max-width:640px;color:#777987;font-size:10px;line-height:1.65}
.life-awards-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.life-secondary-button{border:1px solid #cfd3dd;border-radius:5px;background:#fff;color:#4c4e61;padding:8px 11px;font-size:10px;font-weight:900;cursor:pointer}.life-secondary-button:hover:not(:disabled){border-color:#171744;color:#171744}.life-secondary-button:disabled{opacity:.42;cursor:not-allowed}.life-secondary-button.danger{color:#a34a50;border-color:#dfc9cb}
.life-awards-grid{display:grid;grid-template-columns:minmax(190px,1.25fr) auto repeat(3,minmax(110px,.7fr));gap:10px;align-items:stretch;padding-top:14px}
.life-award-picker{display:grid;gap:5px}.life-award-picker>span{color:#777987;font-size:9px;font-weight:900}.life-award-picker select{width:100%;border:1px solid #d8dbe4;border-radius:5px;background:#fff;color:#292a42;padding:9px 10px;font-size:11px;font-weight:800}
.life-award-record{align-self:end;border:1px solid #171744;border-radius:5px;background:#171744;color:#fff;padding:9px 13px;font-size:10px;font-weight:900;cursor:pointer}
.life-award-stat{position:relative;display:grid;grid-template-columns:1fr auto;gap:2px 8px;align-content:center;padding:10px 11px;border:1px solid #e2e4e9;border-radius:6px;background:#fbfbfd}.life-award-stat::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:6px 0 0 6px;background:#999}.life-award-stat span{font-size:9px;font-weight:900;color:#555768}.life-award-stat strong{grid-row:1/3;grid-column:2;font-size:22px;line-height:1;color:#25263e}.life-award-stat small{font-size:8px;color:#9294a0}.life-award-stat.stat-c::before{background:var(--arc-function)}.life-award-stat.stat-r::before{background:var(--arc-reality)}.life-award-stat.stat-a::before{background:var(--arc-anomaly)}
.life-undo-hint{margin-top:10px;color:#9395a1;font-size:9px;min-height:14px}
@media(max-width:900px){.life-awards-grid{grid-template-columns:1fr 1fr}.life-award-stat{min-height:54px}.life-awards-head{flex-direction:column}.life-awards-actions{justify-content:flex-start}}
@media(max-width:620px){.life-awards-grid{grid-template-columns:1fr}.life-award-record{align-self:auto}}
.life-cell.bonus{background:color-mix(in srgb,var(--track-color) 18%,white);border:2px solid var(--track-color)}
.life-cell.bonus::after{content:"+";position:absolute;inset:0;display:grid;place-items:center;color:var(--track-color);font-size:12px;font-weight:900}
.life-note-panel .sample.bonus{border:2px solid #646b7c;background:#fff}.life-note-panel .sample.bonus::after{content:"+";position:absolute;inset:-3px 0 0;text-align:center;color:#646b7c;font-weight:900}


/* Work / Life v3 — 机构评级与始终可见的成长轨道 */
.competency-rank-map{
  margin-top:2px;
}
.rank-row{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:5px;
  color:#9a9cab;
  font-size:9px;
  font-weight:800;
  line-height:1.2;
}
.rank-row span{
  min-width:0;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.rank-row-top{margin-bottom:5px}
.rank-row-bottom{margin-top:5px}
.competency-ranked{
  grid-template-rows:repeat(2,23px);
}
.competency-ranked .life-cell:nth-child(3n){
  box-shadow:4px 0 0 -3px rgba(231,47,58,.30);
}
.competency-ranked .life-cell:nth-child(15){
  box-shadow:none;
}
.life-track-grid:empty::before{
  content:"";
  display:block;
  min-height:23px;
  border:1px solid #e2e4ea;
  border-radius:4px;
}
@media(max-width:760px){
  .rank-row{font-size:8px;gap:3px}
  .competency-ranked{grid-template-columns:repeat(15,minmax(18px,1fr));overflow-x:auto}
}


/* Work / Life v4 — 晋升强化与资源来源重置 */
.competency-head-actions{display:flex;align-items:center;gap:12px}
.competency-rank-summary{min-width:180px;padding:7px 10px;border-left:3px solid var(--arc-function);background:#fff7f8;border-radius:4px}
.competency-rank-summary>span{display:block;color:#9b7c81;font-size:8px;font-weight:900;letter-spacing:.08em}
.competency-rank-summary strong{display:block;margin-top:1px;color:var(--arc-function);font-size:15px;line-height:1.2}
.competency-rank-summary small{display:block;margin-top:3px;color:#777987;font-size:8px;font-weight:800}
.rank-row span{position:relative;padding:4px 5px;border-radius:4px;transition:.15s ease}
.rank-row span::before{content:"";display:inline-block;width:6px;height:6px;margin-right:4px;border:1px solid #c7c9d1;border-radius:50%;vertical-align:1px;background:#fff}
.rank-row span.rank-complete{color:#b34a52;background:#fff5f6}
.rank-row span.rank-complete::before{background:var(--arc-function);border-color:var(--arc-function)}
.rank-row span.rank-current{color:#fff;background:var(--arc-function);font-weight:900;box-shadow:0 2px 7px rgba(225,43,54,.22)}
.rank-row span.rank-current::before{background:#fff;border-color:#fff}
.rank-row span.rank-next{color:var(--arc-function);outline:1px solid rgba(225,43,54,.32);background:#fff}
.competency-ranked .life-cell.rank-current-cell{outline:2px solid rgba(225,43,54,.48);outline-offset:-2px;background:#fff5f6}
.competency-ranked .life-cell.rank-current-cell.marked{background:var(--track-color)}
.competency-ranked .life-cell.rank-current-cell.bonus{background:color-mix(in srgb,var(--track-color) 18%,white)}
.competency-ranked .life-cell.rank-end-cell{border-right-width:2px;border-right-color:rgba(225,43,54,.40)}
.reset-choice-list{display:grid;gap:9px;margin-bottom:12px}
.reset-choice{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;padding:11px 12px;border:1px solid #e2e3e8;border-radius:7px;background:#fff;cursor:pointer}
.reset-choice:has(input:checked){border-color:color-mix(in srgb,var(--modal-color) 55%,#ddd);background:color-mix(in srgb,var(--modal-color) 5%,white)}
.reset-choice input{margin-top:3px;accent-color:var(--modal-color)}
.reset-choice b{display:block;color:#25263e;font-size:12px}
.reset-choice small{display:block;margin-top:4px;color:#7d7f8c;font-size:10px;line-height:1.55}
.reset-effect-preview{display:grid;gap:4px;padding:10px 12px;border-left:3px solid #d9dbe2;background:#f7f7f9;color:#666977;font-size:9px;line-height:1.5}
@media(max-width:760px){.competency-head-actions{width:100%;justify-content:space-between}.competency-rank-summary{min-width:0;flex:1}}

/* ===== Cloud v1 ===== */
.sheet-header{gap:22px}
.cloud-panel{margin-left:auto;min-width:300px;display:grid;gap:7px;align-self:center}
.cloud-status-line{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:800;color:#181846;justify-content:flex-end}
.cloud-dot{width:8px;height:8px;border-radius:50%;background:#aeb4c2;box-shadow:0 0 0 3px rgba(174,180,194,.14)}
.cloud-dot[data-state="owner"]{background:#2f8f60;box-shadow:0 0 0 3px rgba(47,143,96,.12)}
.cloud-dot[data-state="viewer"]{background:#2874c7;box-shadow:0 0 0 3px rgba(40,116,199,.12)}
.cloud-dot[data-state="busy"]{background:#dca20b;box-shadow:0 0 0 3px rgba(220,162,11,.12)}
.cloud-dot[data-state="error"]{background:#e72a38;box-shadow:0 0 0 3px rgba(231,42,56,.12)}
.cloud-actions{display:flex;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.cloud-actions button{border:1px solid #cfd3de;background:#fff;color:#181846;border-radius:6px;padding:7px 9px;font:inherit;font-size:10px;font-weight:800;cursor:pointer}
.cloud-actions button:hover:not(:disabled){border-color:#171744;background:#f7f8fb}
.cloud-actions button:disabled{opacity:.4;cursor:not-allowed}
.cloud-actions #cloudSave{border-color:#171744;background:#171744;color:#fff}
.cloud-panel small{font-size:9px;color:#8b8e9d;text-align:right;max-width:420px;overflow-wrap:anywhere}
@media(max-width:900px){.sheet-header{flex-wrap:wrap}.cloud-panel{order:3;width:100%;min-width:0}.cloud-status-line,.cloud-actions{justify-content:flex-start}.cloud-panel small{text-align:left}}

/* Cloud v1.1 — 菜鸟 2 格，其余评级按 3 格视觉分组 */
.rank-row.rank-row-shaped{grid-template-columns:repeat(15,minmax(0,1fr));gap:4px}
.rank-row.rank-row-shaped span{display:block}
@media(max-width:760px){.rank-row.rank-row-shaped{min-width:600px}}

/* Cloud v2 — shared viewer mode */
.cloud-viewer-mode input[readonly],
.cloud-viewer-mode textarea[readonly],
.cloud-viewer-mode select:disabled{
  opacity:1;
  color:inherit;
  -webkit-text-fill-color:currentColor;
  cursor:default;
}
.cloud-viewer-mode input:not([type="checkbox"]):not([type="radio"])[readonly],
.cloud-viewer-mode textarea[readonly],
.cloud-viewer-mode select:disabled{
  background:#fafbfc;
}
.cloud-viewer-mode button:disabled:not(.cloud-actions button){
  opacity:.62;
  cursor:default;
}
.cloud-viewer-mode .cloud-actions #cloudRefresh,
.cloud-viewer-mode .cloud-actions #cloudShare{opacity:1}

/* Cloud v3 — local character library */
.cloud-actions #cloudLibrary{border-color:#d3d6df;background:#f8f8fb;color:#171744}
.cloud-library-backdrop{position:fixed;inset:0;z-index:250;background:rgba(20,20,45,.28);display:flex;align-items:center;justify-content:center;padding:24px}
.cloud-library-backdrop[hidden]{display:none}
.cloud-library-modal{width:min(720px,100%);max-height:min(78vh,760px);overflow:auto;background:#fff;border:1px solid #d7dae3;border-radius:14px;box-shadow:0 24px 70px rgba(23,23,68,.18);padding:20px}
.cloud-library-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;border-bottom:1px solid #e7e8ee;padding-bottom:12px;margin-bottom:10px}
.cloud-library-head span{font-size:9px;letter-spacing:.15em;color:#8b8e9d;font-weight:800}
.cloud-library-head h2{margin:3px 0 0;font-size:24px;color:#171744}
.cloud-library-head button{width:32px;height:32px;border:1px solid #d7dae3;border-radius:8px;background:#fff;color:#171744;font-size:20px;cursor:pointer}
.cloud-library-note{margin:0 0 14px;font-size:11px;line-height:1.6;color:#747789}
.cloud-library-list{display:grid;gap:9px}
.cloud-library-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;border:1px solid #e0e2e9;border-radius:10px;padding:12px 13px;background:#fff}
.cloud-library-item.current{border-color:#171744;box-shadow:inset 3px 0 0 #171744}
.cloud-library-name{font-size:14px;font-weight:900;color:#171744;margin-bottom:3px}
.cloud-library-meta{font-size:10px;color:#8b8e9d;display:flex;gap:10px;flex-wrap:wrap;overflow-wrap:anywhere}
.cloud-library-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.cloud-library-actions button{border:1px solid #cfd3de;border-radius:6px;background:#fff;color:#171744;padding:6px 8px;font:inherit;font-size:10px;font-weight:800;cursor:pointer}
.cloud-library-actions .open-character{background:#171744;border-color:#171744;color:#fff}
.cloud-library-actions .remove-character{color:#a02b35;border-color:#e3c6ca}
.cloud-library-empty{padding:30px 10px;text-align:center;color:#8b8e9d;font-size:12px;border:1px dashed #d7dae3;border-radius:10px}
@media(max-width:650px){.cloud-library-item{grid-template-columns:1fr}.cloud-library-actions{justify-content:flex-start}.cloud-library-backdrop{padding:12px}.cloud-library-modal{padding:15px}}

/* Cloud v4 account */
.cloud-actions #cloudAccount{border-color:#171744;background:#fff;color:#171744}
.cloud-auth-modal{width:min(520px,100%)}
.cloud-auth-field{display:grid;gap:6px;margin:12px 0;font-size:11px;font-weight:800;color:#171744}
.cloud-auth-field input{width:100%;box-sizing:border-box;border:1px solid #d7dae3;border-radius:8px;padding:11px 12px;font:inherit;font-size:13px;color:#171744;background:#fff}
.cloud-auth-field input:focus{outline:2px solid rgba(23,23,68,.12);border-color:#171744}
.cloud-auth-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.cloud-auth-actions button{border:1px solid #171744;border-radius:7px;background:#171744;color:#fff;padding:9px 12px;font:inherit;font-size:11px;font-weight:900;cursor:pointer}
.cloud-auth-actions button:disabled{opacity:.45;cursor:not-allowed}
.cloud-auth-actions button.danger{background:#fff;color:#a02b35;border-color:#e3c6ca}
.cloud-account-card{display:grid;gap:5px;border:1px solid #e0e2e9;border-radius:10px;padding:13px;background:#f8f8fb}
.cloud-account-card span{font-size:9px;letter-spacing:.12em;color:#8b8e9d;font-weight:900}
.cloud-account-card strong{font-size:13px;color:#171744;overflow-wrap:anywhere}
.cloud-auth-message{min-height:18px;margin-top:12px;font-size:11px;line-height:1.5;color:#747789}
.cloud-auth-message[data-kind="error"]{color:#b32835}.cloud-auth-message[data-kind="ok"]{color:#237450}

/* Cloud v5 — refined sync toolbar + autosave */
.cloud-panel{
  min-width:560px;
  max-width:720px;
  border:1px solid #e0e2e9;
  border-radius:12px;
  background:linear-gradient(180deg,#fff 0%,#fafafd 100%);
  padding:11px 12px;
  box-shadow:0 4px 14px rgba(23,23,68,.045);
}
.cloud-panel-main{display:grid;grid-template-columns:minmax(215px,1fr) auto;gap:14px;align-items:center}
.cloud-identity{min-width:0;display:grid;gap:4px}
.cloud-status-line{justify-content:flex-start;font-size:11px;line-height:1.25}
.cloud-panel small{display:block;max-width:100%;text-align:left;font-size:9px;color:#8b8e9d;white-space:normal}
.cloud-sync-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:9px;color:#8b8e9d}
.cloud-sync-badge{display:inline-flex;align-items:center;min-height:20px;padding:2px 7px;border-radius:999px;background:#eff0f5;color:#696d7d;font-size:8px;font-weight:900;letter-spacing:.03em;white-space:nowrap}
.cloud-sync-badge[data-state="dirty"]{background:#fff1d3;color:#986400}
.cloud-sync-badge[data-state="saving"]{background:#fff1d3;color:#986400}
.cloud-sync-badge[data-state="saved"]{background:#e6f4ec;color:#24704c}
.cloud-sync-badge[data-state="error"]{background:#fde7ea;color:#b32835}
.cloud-sync-badge[data-state="readonly"]{background:#e9f1fb;color:#2868aa}
.cloud-autosave-toggle{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:9px;font-weight:800;color:#676b7c;user-select:none}
.cloud-autosave-toggle input{position:absolute;opacity:0;pointer-events:none}
.cloud-toggle-track{width:27px;height:15px;border-radius:999px;background:#c8cbd5;position:relative;transition:.18s ease;box-shadow:inset 0 0 0 1px rgba(23,23,68,.06)}
.cloud-toggle-track span{position:absolute;width:11px;height:11px;border-radius:50%;background:#fff;left:2px;top:2px;box-shadow:0 1px 3px rgba(0,0,0,.18);transition:.18s ease}
.cloud-autosave-toggle input:checked + .cloud-toggle-track{background:#2f8f60}
.cloud-autosave-toggle input:checked + .cloud-toggle-track span{transform:translateX(12px)}
.cloud-actions{justify-content:flex-end;align-items:center;gap:5px;max-width:350px}
.cloud-actions button{min-height:31px;border-radius:7px;padding:7px 9px;font-size:9px;background:#fff;transition:background .15s,border-color .15s,transform .1s}
.cloud-actions button:hover:not(:disabled){transform:translateY(-1px)}
.cloud-actions #cloudSave.cloud-primary{background:#171744;border-color:#171744;color:#fff;box-shadow:0 2px 5px rgba(23,23,68,.13)}
.cloud-actions #cloudShare{border-color:#e0c7ca;color:#9e2733;background:#fffafb}
.cloud-actions #cloudLibrary{background:#f5f5f9}
.cloud-actions #cloudAccount.cloud-account-button{border-color:#171744;background:#fff;color:#171744}
@media(max-width:1050px){
  .cloud-panel{min-width:0;width:100%;max-width:none;order:3}
  .cloud-panel-main{grid-template-columns:1fr auto}
}
@media(max-width:720px){
  .cloud-panel{padding:10px;margin-top:5px}
  .cloud-panel-main{grid-template-columns:1fr;gap:10px}
  .cloud-actions{justify-content:flex-start;max-width:none}
  .cloud-actions button{flex:1 1 auto;min-width:78px}
  .cloud-sync-meta{justify-content:space-between}
}


/* Cloud v5.1 — stable autosave feedback */
.cloud-status-line{min-height:16px}
.cloud-panel small#cloudRoleHint{min-height:12px}
.cloud-sync-meta{min-height:20px}
.cloud-sync-badge{min-width:48px;justify-content:center;box-sizing:border-box}
#cloudSaveTime{display:inline-block;min-width:92px}

/* Cloud v5.2 — cloud controls moved to page footer */
.cloud-footer{
  margin-top:28px;
  padding:18px 0 4px;
  border-top:1px solid #e8e9ee;
  display:flex;
  justify-content:center;
}
.cloud-footer .cloud-panel{
  margin-left:0;
  width:100%;
  max-width:920px;
  min-width:0;
  box-sizing:border-box;
}

/* Cloud v5.2 — Work / Life mobile competency layout */
@media(max-width:760px){
  .track-c .life-track-head{gap:12px}
  .track-c .competency-head-actions{
    width:100%;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:8px;
  }
  .track-c .competency-rank-summary{
    width:100%;
    min-width:0;
    flex:none;
    box-sizing:border-box;
    padding:9px 11px;
  }
  .track-c .spend-time-button{width:100%}
  .competency-rank-map{
    width:100%;
    min-width:0;
    overflow:visible;
  }
  .rank-row.rank-row-shaped{
    min-width:0 !important;
    width:100%;
    grid-template-columns:repeat(15,minmax(0,1fr));
    gap:3px;
  }
  .competency-ranked{
    width:100%;
    min-width:0;
    grid-template-columns:repeat(15,minmax(0,1fr));
    gap:3px;
    overflow:visible;
  }
  .competency-ranked .life-cell{
    min-width:0;
    height:24px;
  }
  .rank-row.rank-row-shaped span{
    min-width:0;
    padding:4px 2px;
    font-size:7.5px;
    letter-spacing:-.02em;
  }
  .rank-row.rank-row-shaped span::before{
    width:4px;
    height:4px;
    margin-right:2px;
  }
  .life-track-status{gap:8px 11px}
}

@media(max-width:520px){
  .cloud-footer{margin-top:20px;padding-top:14px}
  .cloud-footer .cloud-panel{padding:10px}
  .rank-row.rank-row-shaped span{
    font-size:7px;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    line-height:1.05;
  }
  .rank-row.rank-row-shaped span::before{display:none}
  .competency-ranked{gap:2px}
  .competency-ranked .life-cell{height:23px;border-radius:3px}
}

/* ========================================
   Cloud v6 — terminology, portraits, mobile polish
======================================== */


/* Cleaner bookmark icon geometry. */
.bookmark-icon{
  width:25px;height:32px;margin:auto;border:0;border-radius:0;background:currentColor;
  clip-path:polygon(0 0,100% 0,100% 100%,50% 78%,0 100%);color:#9b9eae;
}
.bookmark-icon::before{
  content:"";position:absolute;inset:3px;background:#fff;
  clip-path:polygon(0 0,100% 0,100% 100%,50% 76%,0 100%);
}
.bookmark-icon::after{display:none}
.sheet-tab.active .bookmark-icon{color:#e52d3a}

/* 隐藏的文件选择框（证件照与人际关系照片共用） */
.relationship-photo-frame img[hidden]{display:none}
.photo-file-input{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.relationship-photo-card button{border:1px solid #cfd3de;background:#fff;color:#171744;border-radius:6px;padding:6px 7px;font:inherit;font-size:9px;font-weight:850;cursor:pointer}
.relationship-photo-remove{color:#a02b35;border-color:#e3c6ca;background:#fffafb}
.relationship-photo-card button:disabled{opacity:.45;cursor:not-allowed}
.relationship-photo-help{font-size:7.5px;color:#9295a4;line-height:1.35;text-align:center}
.relationship-photo-help.is-error{color:#b32835}

/* Relationship portraits use the same ID-photo language, but compact. */
.relationship-main{display:grid;grid-template-columns:104px minmax(0,1fr);gap:16px;align-items:start}
.relationship-content{min-width:0;display:grid;gap:12px}
.relationship-photo-card{display:grid;gap:5px;min-width:0}
.relationship-photo-frame{position:relative;width:100%;aspect-ratio:3/4;overflow:hidden;border:1px solid #d9dce6;border-radius:7px;background:#f5f6f9}
.relationship-photo-frame img{width:100%;height:100%;object-fit:cover;display:block}
.relationship-photo-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:#989baa}
.relationship-photo-placeholder[hidden]{display:none}
.relationship-photo-placeholder>span{position:relative;width:34px;height:40px}
.relationship-photo-placeholder>span::before{content:"";position:absolute;left:9px;top:0;width:16px;height:16px;border-radius:50%;background:#ced1da}
.relationship-photo-placeholder>span::after{content:"";position:absolute;left:2px;bottom:0;width:30px;height:22px;border-radius:15px 15px 5px 5px;background:#ced1da}
.relationship-photo-placeholder small{font-size:7px;letter-spacing:.13em;font-weight:850}

/* Competency rank edge separators removed; rank map remains the visual indicator. */
.competency-ranked .life-cell.rank-end-cell,
.competency-ranked .life-cell:nth-child(3n),
.competency-ranked .life-cell:nth-child(15){border-right-width:1px;border-right-color:#d8dce5}
.competency-ranked .life-cell.marked.rank-end-cell,
.competency-ranked .life-cell.marked:nth-child(3n),
.competency-ranked .life-cell.marked:nth-child(15){border-right-color:var(--track-color)}

/* Keep all three Work/Life tracks on the same 15-column snake grid on phones.
   The JS places the second half at columns 15→1, so changing to 10 columns compresses the right edge. */
@media(max-width:760px){
  .life-track-grid,
  .competency-ranked{grid-template-columns:repeat(15,minmax(0,1fr))!important;gap:3px;min-width:0!important;width:100%;overflow:visible!important}
  .life-track-grid .life-cell{min-width:0;height:24px;border-radius:3px}
  .sheet-tab{grid-template-columns:28px minmax(0,1fr);gap:6px;padding-left:8px;padding-right:8px}
  .tab-label{font-size:10.5px;overflow-wrap:anywhere}
}

@media(max-width:620px){
  .relationship-main{grid-template-columns:84px minmax(0,1fr);gap:12px}
  .relationship-photo-card button{padding:5px 4px;font-size:8px}
  .life-track-grid,.competency-ranked{gap:2px}
  .life-track-grid .life-cell{height:22px}
  .bookmark-icon{width:22px;height:28px}
  .sheet-tab{grid-template-columns:1fr;gap:6px;min-height:104px;text-align:center;align-content:center}
  .tab-copy{justify-items:center}
  .tab-index{display:none}
  .tab-label{font-size:10px;line-height:1.25}
}

@media(max-width:430px){
  .relationship-main{grid-template-columns:1fr}
  .relationship-photo-card{grid-template-columns:86px 1fr auto;grid-template-rows:auto auto;align-items:end;column-gap:7px}
  .relationship-photo-frame{grid-row:1/3;grid-column:1}
  .relationship-photo-upload{grid-column:2}
  .relationship-photo-remove{grid-column:3}
  .relationship-photo-help{grid-column:2/4;text-align:left}
}

/* 数据安全：其他标签页修改了同一角色时的提示条 */
.model-stale-banner{
  position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:400;
  width:min(560px,calc(100% - 32px));box-sizing:border-box;
  display:flex;align-items:center;gap:12px;padding:12px 14px;
  border:1px solid #e3c6ca;border-radius:10px;background:#fffafb;color:#7d1f29;
  box-shadow:0 12px 32px rgba(23,23,68,.18);font-size:13px;line-height:1.5
}
.model-stale-banner span{flex:1;min-width:0}
.model-stale-banner button{
  flex:none;min-height:40px;padding:8px 14px;border:0;border-radius:8px;
  background:#171744;color:#fff;font:inherit;font-weight:800;cursor:pointer
}


/* 现实进度条（详情页与总览共用）：▶ 1 › 2 › 3 › 4 › ⊗
   --track-line：方框边框 / 箭头颜色；总览在黄色底上改成白色 */
.reality-track{
  --track-line:#f5a524;--track-ink:#0e1528;
  display:grid;grid-template-columns:12px repeat(4,minmax(0,1fr) 12px) minmax(0,1fr);
  align-items:center;gap:3px;width:100%;max-width:380px;
}
.reality-track-start{width:12px;height:16px;background:var(--track-line);clip-path:polygon(0 0,100% 50%,0 100%)}
.reality-track-sep{justify-self:center;width:8px;height:8px;border-top:3px solid var(--track-line);border-right:3px solid var(--track-line);transform:rotate(45deg)}
.reality-track-box{
  aspect-ratio:1/1;min-width:0;min-height:38px;max-height:56px;padding:0;
  border:3px solid var(--track-line);border-radius:8px;background:#fff;color:var(--track-ink);
  font:inherit;font-size:18px;font-weight:900;cursor:pointer;transition:background .12s,color .12s;
}
.reality-track-box:hover{background:#fff6e3}
.reality-track-box.filled{background:var(--track-line);border-color:var(--track-line);color:var(--track-ink)}
.reality-track-box:focus-visible,.reality-track-end:focus-visible{outline:3px solid var(--track-ink);outline-offset:2px}
.reality-track-end{
  justify-self:center;aspect-ratio:1/1;width:100%;min-width:34px;max-width:52px;padding:0;
  border:3px solid var(--track-line);border-radius:50%;background:#fff;color:var(--track-line);
  font:inherit;font-size:18px;font-weight:900;cursor:pointer;
}
.reality-track-end:disabled{opacity:.55;cursor:default}
/* 4 格已满：⊗ 变成醒目的「更换现实」按钮 */
.reality-track.is-full .reality-track-end{background:var(--dossier-red,#d9262f);border-color:var(--dossier-red,#d9262f);color:#fff;animation:realityEndPulse 1.8s ease-in-out infinite}
@keyframes realityEndPulse{0%,100%{box-shadow:0 0 0 0 rgba(217,38,47,.45)}50%{box-shadow:0 0 0 6px rgba(217,38,47,0)}}
@media (prefers-reduced-motion:reduce){.reality-track.is-full .reality-track-end{animation:none}}

/* 详情页：进度说明原文在左，进度条在右 */
.reality-progress-info{flex:1;min-width:0;display:grid;gap:2px}
.reality-progress-rule{margin:6px 0 0;color:#45455d;font-size:13px;line-height:1.7}
.reality-progress-rule:empty{display:none}
.reality-progress > .reality-progress-boxes{flex:none;width:min(380px,46%)}
@media(max-width:650px){
  .reality-progress{flex-direction:column;align-items:stretch}
  .reality-progress > .reality-progress-boxes{width:100%}
}
.cloud-viewer-mode .reality-track-box:disabled{opacity:1;cursor:default}
.cloud-viewer-mode .reality-track.is-full .reality-track-end{animation:none}

/* ========================================================================
   v8 — 新版布局：顶部红色横幅导航 + 主档案仪表盘（跑团时 90% 的需求在一页）
   颜色变量：--ink 深蓝黑 / --red 职能红 / --blue 异常蓝 / --yellow 现实黄
   大字（姓名、代号、评级、ARC 名称）由 script.js 的 fitDossierText() 按宽度自动缩小，
   --fit-max 是最大字号。
   ======================================================================== */
:root{
  --ink:#1b1d36;
  --red:#d9262f;
  --blue:#1655b0;
  --yellow:#f5ac32;
  --amber-text:#d98a06;
  --paper:#efece6;
  --surface:#f5f4f1;
  --line:#dddad4;
  --muted:#7b7e89;
  /* 兼容旧样式里用到的变量名 */
  --dossier-ink:var(--ink);
  --dossier-red:var(--red);
  --dossier-blue:var(--blue);
  --dossier-yellow:var(--yellow);
  --dossier-muted:var(--muted);
}
body{
  margin:0;
  background-color:var(--paper);
  /* 很淡的纸张颗粒 */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.35 0 0 0 0 0.3 0 0 0 0 0.25 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  color:var(--ink);
  font-family:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
}
.app-shell{max-width:1480px;margin:0 auto;padding:14px 18px 48px}

/* ---------- 顶部横幅 ---------- */
.app-header{display:flex;align-items:stretch;gap:6px;margin-bottom:16px}
.app-brand,.app-nav,.app-settings-button{background:linear-gradient(100deg,#de2a33 0%,#cf222b 100%);color:#fff}
.app-brand{display:flex;align-items:center;gap:14px;padding:10px 6px 10px 18px;border-radius:8px 0 0 8px}
.app-logo{flex:none;width:62px;color:#fff}
.app-logo svg{display:block;width:100%;height:auto;fill:currentColor}
.app-brand-text{display:grid;line-height:1}
.app-kicker{font-size:13px;font-weight:700;letter-spacing:.22em;opacity:.92}
.app-page-title{margin:4px 0 0;font-size:52px;font-weight:900;letter-spacing:.04em;line-height:1;white-space:nowrap;color:#fff}
.app-nav{flex:1;min-width:0;display:flex;align-items:center;gap:2px;padding:0 14px;border-radius:0 8px 8px 0;overflow-x:auto;scrollbar-width:none}
.app-nav::-webkit-scrollbar{display:none}
.app-tab{
  flex:none;padding:8px 10px;border:0;border-radius:6px;background:none;color:rgba(255,255,255,.6);
  font:inherit;font-size:28px;font-weight:900;white-space:nowrap;cursor:pointer;transition:color .15s,background .15s;
}
.app-tab::before{content:"/";margin-right:4px;font-weight:400;opacity:.8}
.app-tab:hover{color:#fff;background:rgba(255,255,255,.08)}
.app-tab:focus-visible,.app-settings-button:focus-visible{outline:3px solid #fff;outline-offset:-4px}
.app-tab.active{display:none}
.app-settings-button{
  flex:none;display:flex;align-items:center;gap:12px;padding:0 22px;border:0;border-radius:8px;
  font:inherit;font-size:24px;font-weight:900;cursor:pointer;
}
.app-menu-icon{position:relative;width:20px;height:3px;background:currentColor;border-radius:2px}
.app-menu-icon::before,.app-menu-icon::after{content:"";position:absolute;left:0;width:20px;height:3px;background:currentColor;border-radius:2px}
.app-menu-icon::before{top:-7px}.app-menu-icon::after{top:7px}

/* 其他页面：白色纸面 */
.app-main > .sheet-page:not(#page-main){padding:30px 34px 40px;border-radius:10px;background:#fff;box-shadow:0 8px 28px rgba(27,29,54,.06)}

/* ---------- 主档案两栏 ---------- */
.main-grid{display:grid;grid-template-columns:minmax(0,1.66fr) minmax(360px,1fr);gap:18px;align-items:start}
.main-left,.main-right{display:grid;gap:18px;min-width:0}

/* ---------- 特工信息 ---------- */
.info-block{display:grid;grid-template-columns:186px minmax(0,1fr);gap:12px}
.info-photo{position:relative;display:flex;min-width:0}
.dossier-photo{
  position:relative;display:flex;align-items:center;justify-content:center;width:100%;min-height:240px;
  padding:0;overflow:hidden;border:3px solid #4a4c5a;border-radius:14px;background:#e6e4e0;
  color:var(--muted);font:inherit;cursor:pointer;transition:box-shadow .15s;
}
.dossier-photo:hover:not(:disabled),.dossier-photo:focus-visible{box-shadow:0 0 0 4px rgba(27,29,54,.14);outline:none}
.dossier-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.dossier-photo img[hidden],.dossier-photo-placeholder[hidden],.dossier-photo-status[hidden]{display:none}
.dossier-photo-placeholder{font-size:16px;font-weight:500;line-height:1.7;text-align:center}
.dossier-photo-status{position:absolute;left:8px;right:8px;bottom:8px;padding:6px 8px;border-radius:7px;background:rgba(27,29,54,.88);color:#fff;font-size:13px;line-height:1.4;text-align:center}
.dossier-photo-status.is-error{background:rgba(185,28,36,.92)}
.dossier-photo-remove{
  position:absolute;top:8px;right:8px;width:34px;height:34px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;
  background:rgba(27,29,54,.78);color:#fff;font:inherit;font-size:20px;line-height:1;cursor:pointer;opacity:0;transition:opacity .15s;
}
.dossier-photo-wrap:hover .dossier-photo-remove,.dossier-photo-remove:focus-visible{opacity:1}
.dossier-photo-remove[hidden]{display:none}
@media (hover:none){.dossier-photo-remove{opacity:1}}

.info-grid{
  display:grid;gap:8px;min-width:0;
  grid-template-columns:minmax(0,1.6fr) minmax(0,.72fr) minmax(0,1.08fr);
  grid-template-rows:repeat(3,minmax(76px,auto));
  grid-template-areas:"name gender reward" "code age reprimand" "rank rank overload";
}
.info-name{grid-area:name}.info-gender{grid-area:gender}.info-code{grid-area:code}.info-age{grid-area:age}
.info-rank{grid-area:rank}.stat-card-reward{grid-area:reward}.stat-card-reprimand{grid-area:reprimand}.stat-card-overload{grid-area:overload}

.info-card label,.stat-card label,.info-rank-label{display:flex;align-items:baseline;gap:7px;white-space:nowrap}
.info-card label strong,.stat-card label strong,.info-rank-label strong{font-size:15px;font-weight:900}
.info-card label small,.stat-card label small,.info-rank-label small{font-size:10px;font-weight:600;letter-spacing:.1em;color:var(--muted)}

.info-card{display:flex;flex-direction:column;justify-content:space-between;min-width:0;padding:8px 14px 6px 16px;border-left:7px solid var(--ink);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}
.info-input{
  --fit-max:36px;width:100%;min-width:0;margin:0;padding:0;border:0;border-bottom:2px solid transparent;border-radius:0;
  background:transparent;color:var(--ink);font-family:inherit;font-size:var(--fit-max);font-weight:900;line-height:1.25;outline:none;
}
.info-input:focus{border-bottom-color:var(--red)}

.info-rank{
  position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto 1fr;align-items:end;min-width:0;
  padding:10px 16px 8px;border-radius:6px;background:linear-gradient(110deg,#de2a33 0%,#c71f28 100%);color:#fff;overflow:hidden;
}
.info-rank-label{align-self:start}
.info-rank-label small{color:rgba(255,255,255,.75)}
.info-rank-code{align-self:start;font-size:26px;font-weight:900;line-height:1;letter-spacing:.02em}
.info-rank-value{
  --fit-max:40px;grid-column:1/-1;width:100%;min-width:0;margin:0;padding:0;border:0;background:transparent;
  color:#fff;-webkit-text-fill-color:#fff;font-family:inherit;font-size:var(--fit-max);font-weight:900;line-height:1.15;text-align:right;outline:none;cursor:default;
}

.stat-card{
  --c:var(--ink);--on-c:#fff;
  display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;padding:8px 10px 8px 14px;
  border-left:7px solid var(--c);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);
}
.stat-card label{flex-direction:column;align-items:flex-start;gap:2px}
.stat-card label strong{font-size:18px}
.stat-card-reward{--c:var(--red)}
.stat-card-reprimand{--c:var(--blue)}
.stat-card-overload{--c:var(--yellow);--on-c:var(--ink)}
/* 计数器：点击数字直接输入 */
.stat-input{
  flex:none;width:78px;height:56px;margin:0;padding:0 4px;border:0;border-radius:5px;background:var(--c);color:var(--on-c);
  font-family:inherit;font-size:36px;font-weight:900;text-align:center;cursor:text;-moz-appearance:textfield;appearance:textfield;
}
.stat-input::-webkit-outer-spin-button,.stat-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.stat-input:hover{box-shadow:0 0 0 3px rgba(27,29,54,.12)}
.stat-input:focus{outline:3px solid var(--ink);outline-offset:2px}

/* ---------- ARC 三栏 ---------- */
.arc-switch{display:none}
.arc-overview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:start}
.arc-col{min-width:0;display:grid;gap:8px}
.arc-col-a{--c:var(--blue);--on-c:#fff;--c-text:var(--blue);--c-ink:#123566;--c-soft:#e5edf9}
.arc-col-r{--c:var(--yellow);--on-c:var(--ink);--c-text:var(--amber-text);--c-ink:#3a2600;--c-soft:#fdf1da}
.arc-col-c{--c:var(--red);--on-c:#fff;--c-text:var(--red);--c-ink:#5c1016;--c-soft:#fbe6e7}

/* 栏头：三角字母 + 中英文标签 + 超大名称（就是下拉框） + 底部色条 */
.arc-col-head{
  position:relative;display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:end;gap:6px;
  min-height:64px;padding:4px 6px 4px 4px;border:2px solid var(--c);border-bottom-width:10px;background:#fff;
}
.arc-col-head::after{
  content:"";position:absolute;right:10px;bottom:-9px;width:7px;height:7px;
  border-right:2px solid var(--on-c);border-bottom:2px solid var(--on-c);transform:rotate(45deg);pointer-events:none;
}
.arc-col-mark{position:relative;width:58px;align-self:end;color:var(--c)}
.arc-col-mark svg{display:block;width:100%;height:auto;fill:currentColor}
.arc-col-mark b{position:absolute;left:0;right:0;bottom:6%;text-align:center;color:#fff;font-family:"Arial Black","Noto Sans SC",sans-serif;font-size:30px;font-weight:900;line-height:1}
.arc-col-r .arc-col-mark b{color:#fff}
.arc-col-label{display:grid;line-height:1.05;padding-bottom:4px;color:var(--c-text)}
.arc-col-label small{font-size:9px;font-weight:700;letter-spacing:.1em}
.arc-col-label strong{font-size:17px;font-weight:900}
.arc-col-select{
  --fit-max:44px;appearance:none;-webkit-appearance:none;width:100%;min-width:0;margin:0;padding:0 2px 0 0;border:0;border-radius:0;
  background:transparent;color:var(--c-text);font-family:inherit;font-size:var(--fit-max);font-weight:900;line-height:1.15;
  text-align:right;text-align-last:right;cursor:pointer;outline:none;text-overflow:ellipsis;
}
.arc-col-select:has(option[value=""]:checked){opacity:.55}
.arc-col-select option{color:var(--ink);font-size:16px;font-weight:500;text-align:left}
.arc-col-head:focus-within{box-shadow:0 0 0 3px rgba(27,29,54,.18)}
.arc-col-body{display:grid;gap:8px;min-width:0}

/* 未选择 ARC 时 */
.arc-empty-cta{
  width:100%;min-height:120px;border:2px dashed var(--c);border-radius:8px;background:var(--c-soft);
  color:var(--c-ink);font:inherit;font-size:16px;font-weight:800;cursor:pointer;
}

/* 通用区块：彩色标题条 + 白色内容 */
.ov-block{border:2px solid var(--c);background:#fff;min-width:0}
.ov-block-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0;padding:6px 12px;background:var(--c);color:var(--on-c);font-size:20px;font-weight:900;line-height:1.3}
.ov-block-count{font-size:22px}
.ov-block-body{padding:10px 12px 12px;color:var(--c-ink)}
.ov-sub{display:block;font-size:17px;font-weight:900;line-height:1.35;color:var(--c-ink)}
.ov-text{margin:4px 0 0;font-size:13px;line-height:1.75;color:#3d3f52}
.ov-hint{margin:0;font-size:12.5px;line-height:1.6;color:var(--c-ink);opacity:.9}
.ov-hint-small{margin-top:8px;font-size:12px;opacity:.75}
.ov-small-label{display:block;font-size:12px;font-weight:700;color:var(--c-ink);opacity:.8}

/* 异常：能力数 + 可展开的能力卡片 */
.ov-count{display:flex;align-items:center;justify-content:space-between;padding:6px 12px;background:var(--c);color:var(--on-c);font-size:18px;font-weight:900}
.ov-count b{font-size:28px;line-height:1}
.ov-ability{position:relative;border:2px solid var(--c);background:#fff;min-width:0}
.ov-ability-head{
  display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;padding:6px 10px 7px;border:0;
  background:var(--c);color:var(--on-c);font:inherit;text-align:left;cursor:pointer;
}
.ov-ability-head:focus-visible,.ov-ability-toggle:focus-visible,.ov-link-bar:focus-visible,.ov-more:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.ov-ability-titles{display:grid;min-width:0;line-height:1.15}
.ov-ability-code{font-size:11px;font-weight:700;opacity:.9}
.ov-ability-name{font-size:22px;font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ov-qa-tag{flex:none;padding:1px 6px;border-radius:3px;background:#fff;color:var(--c);font-size:15px;font-weight:900;line-height:1.5}
.ov-ability-body{padding:9px 12px 26px;color:var(--c-ink)}
.ov-ability-summary{margin:0;font-size:13.5px;line-height:1.7;text-align:center}
.ov-ability-summary.is-clamped{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ov-rule{position:relative;margin:0 0 8px;padding-left:26px;font-size:13px;line-height:1.65}
.ov-rule b{font-weight:900}
.ov-rule-icon{position:absolute;left:0;top:2px;width:19px;height:17px;display:grid;place-items:center;background:var(--c);color:#fff;font-size:10px;font-weight:900}
.ov-rule-success .ov-rule-icon,.ov-rule-boost .ov-rule-icon{clip-path:polygon(50% 0,100% 100%,0 100%);padding-top:4px}
.ov-rule-success .ov-rule-icon::before{content:"✓"}
.ov-rule-boost .ov-rule-icon::before{content:"★";font-size:8px}
.ov-rule-failure .ov-rule-icon{width:18px;height:18px;border-radius:50%}
.ov-rule-failure .ov-rule-icon::before{content:"✕"}
.ov-ability-foot{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:4px}
.ov-badge{padding:2px 8px;border-radius:999px;background:var(--c-soft);color:var(--c-ink);font-size:12px;font-weight:700}
.ov-more{margin-left:auto;padding:4px 6px;border:0;background:none;color:var(--c-text);font:inherit;font-size:13px;font-weight:800;cursor:pointer}
.ov-ability-toggle{position:absolute;right:6px;bottom:4px;width:26px;height:20px;padding:0;border:0;background:none;cursor:pointer}
.ov-ability-toggle::before{content:"";position:absolute;left:6px;top:5px;border-left:7px solid transparent;border-right:7px solid transparent;border-top:9px solid var(--c)}
.ov-ability.is-open .ov-ability-toggle::before{border-top:0;border-bottom:9px solid var(--c)}

/* 现实：进度块与倦怠释放是黄色底 */
.ov-progress,.ov-release{background:var(--c)}
.ov-progress{padding-bottom:10px}
.ov-progress .ov-hint{padding:0 12px;color:var(--ink)}
.ov-progress .reality-track{--track-line:#fff;max-width:none;margin:8px 12px 0;width:auto}
.ov-progress .reality-track-box{border-color:#fff}
.ov-progress .reality-track-box.filled{background:#e8900c;border-color:#fff;color:var(--ink)}
.ov-release{padding:10px 12px 12px;color:var(--ink)}
.ov-release .ov-sub{font-size:22px;color:var(--ink)}
.ov-release .ov-text{color:#3a2600;font-size:12.5px}

/* 职能 */
.ov-directive-title{display:block;font-size:28px;font-weight:900;line-height:1.25;color:var(--red)}
.ov-check{display:flex;align-items:center;gap:12px;min-height:46px;margin-top:4px;color:var(--red);font-size:18px;font-weight:900;line-height:1.3;cursor:pointer}
.ov-check input{
  flex:none;appearance:none;-webkit-appearance:none;position:relative;width:30px;height:30px;margin:0;
  border:3px solid var(--red);border-radius:5px;background:#fff;cursor:pointer;
}
.ov-check input:checked{background:var(--red)}
.ov-check input:checked::after{content:"";position:absolute;left:7px;top:2px;width:8px;height:15px;border-right:4px solid #fff;border-bottom:4px solid #fff;transform:rotate(45deg)}
.ov-check input:focus-visible{outline:3px solid var(--ink);outline-offset:2px}

/* 人际关系 / 申购物资：标题条（点击去对应页面）+ 列表 */
.ov-link-bar{
  display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;padding:7px 12px;border:0;
  background:var(--c);color:var(--on-c);font:inherit;font-size:20px;font-weight:900;cursor:pointer;text-align:left;
}
.ov-link-arrow{width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:11px solid currentColor}
.ov-list{list-style:none;margin:0;padding:2px 0 2px 12px;border-left:4px solid var(--c)}
.ov-list-item{display:grid;grid-template-columns:16px minmax(0,1fr) auto;align-items:center;gap:10px;padding:7px 4px;border-bottom:1px solid var(--line);font-size:17px;font-weight:800}
.ov-list-item:last-child{border-bottom:0}
.ov-dot{width:16px;height:16px;border-radius:50%;background:var(--c)}
.ov-list-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ov-list-value{font-weight:900;font-variant-numeric:tabular-nums}
.ov-list-item.is-used{opacity:.5}
.ov-list-item.is-network .ov-list-value{color:var(--c-text)}
.ov-list-empty{padding:8px 4px;color:var(--muted);font-size:14px}

/* ---------- 右栏：资质保证 ---------- */
.qa-panel,.bg-panel{border:2px solid #cfcdd4;border-radius:10px;background:#f7f6f4;overflow:hidden}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 16px;background:var(--ink);color:#fff}
.panel-head h2{margin:0;font-size:30px;font-weight:900;line-height:1.2;color:#fff}
.panel-head h2 small{margin-left:10px;font-size:13px;font-weight:700;letter-spacing:.08em}
.qa-refill{
  min-height:34px;padding:4px 12px;border:2px solid rgba(255,255,255,.75);border-radius:7px;background:transparent;color:#fff;
  font:inherit;font-size:13px;font-weight:800;cursor:pointer;
}
.qa-refill:hover{background:#fff;color:var(--ink)}
.qa-list{padding:4px 12px}
.qa-row{display:grid;grid-template-columns:116px minmax(0,1fr) 74px;align-items:center;column-gap:10px;min-height:48px;border-bottom:1px solid #e3e2e6}
.qa-row:last-child{border-bottom:0}
.qa-name{display:flex;align-items:baseline;gap:6px;min-width:0;white-space:nowrap}
.qa-name strong{font-size:24px;font-weight:900;color:var(--ink)}
.qa-name small{font-size:9.5px;font-weight:600;letter-spacing:.08em;color:var(--muted);overflow:hidden;text-overflow:ellipsis}
.aptitude-track{min-width:0}
.aptitude-svg{display:block;width:100%;height:auto;overflow:visible}
.aptitude-point{fill:#fff;stroke:#d3d5dd;stroke-width:2;vector-effect:non-scaling-stroke;cursor:pointer;transition:fill .15s,stroke .15s}
.aptitude-point:hover{stroke:var(--red)}
.aptitude-point.filled{fill:var(--red);stroke:var(--red)}
.aptitude-point.locked,.aptitude-point.locked:hover{fill:#efeff2;stroke:#e6e6ea;cursor:not-allowed}
.qa-score-wrap{position:relative}
.qa-score{
  display:flex;align-items:baseline;justify-content:center;width:100%;height:40px;padding:0;border:2px solid #c9a5a8;border-radius:8px;
  background:#fff;color:var(--ink);font:inherit;font-size:24px;font-weight:900;line-height:1;cursor:pointer;font-variant-numeric:tabular-nums;
}
.qa-score:hover{border-color:var(--red)}
.qa-score:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.qa-score-max{color:var(--red)}
.qa-score-max b{font-weight:900}
.qa-max-select{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
/* QA 用完（上限 > 0、当前 0）：灰色 + 数字框细红边浅红底，提醒再掷会燃尽 */
.qa-row.is-spent .qa-name strong,.qa-row.is-spent .qa-score-value{color:#a3a5b0}
.qa-row.is-spent .qa-score{border-color:var(--red);background:#fdeeee}
/* 上限为 0：纯灰 */
.qa-row.is-none .qa-name strong,.qa-row.is-none .qa-score,.qa-row.is-none .qa-score-max{color:#b2b4bd}
.qa-row.is-none .qa-score{border-color:#d6d7dd}
.qa-note{margin:0;padding:8px 16px 12px;color:var(--muted);font-size:12px;line-height:1.6}

/* 修改上限的小菜单 */
.qa-max-menu{position:absolute;z-index:300;width:220px;padding:10px;border:2px solid var(--ink);border-radius:10px;background:#fff;box-shadow:0 12px 30px rgba(27,29,54,.22)}
.qa-max-menu[hidden]{display:none}
.qa-max-menu-title{display:block;margin-bottom:8px;font-size:13px;font-weight:800;color:var(--muted)}
.qa-max-menu-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.qa-max-option{height:38px;padding:0;border:2px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font:inherit;font-size:18px;font-weight:900;cursor:pointer}
.qa-max-option:hover{border-color:var(--red)}
.qa-max-option.is-current{border-color:var(--red);background:var(--red);color:#fff}

/* ---------- 右栏：特工背景 ---------- */
.bg-section{border-top:1px solid #e3e2e6}
.bg-section summary{
  display:flex;align-items:center;justify-content:space-between;gap:8px;margin:10px 12px 0;padding:6px 10px;
  border-left:5px solid var(--ink);background:#e7e6e9;font-size:17px;font-weight:900;cursor:pointer;list-style:none;
}
.bg-section summary::-webkit-details-marker{display:none}
.bg-section summary::after{content:"";width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid #9a9ca8}
.bg-section[open] summary::after{border-top:0;border-bottom:8px solid #9a9ca8}
.bg-section textarea{
  display:block;width:calc(100% - 24px);min-height:120px;margin:6px 12px 12px;padding:8px 10px;border:1px solid transparent;border-radius:6px;
  background:transparent;color:var(--ink);font:inherit;font-size:15px;line-height:1.75;resize:vertical;box-sizing:border-box;
}
.bg-section textarea:focus{outline:none;border-color:#cfcdd4;background:#fff}

/* ---------- 设置抽屉 ---------- */
.settings-backdrop{position:fixed;inset:0;z-index:240;background:rgba(20,20,45,.32)}
.settings-backdrop[hidden],.settings-drawer[hidden]{display:none}
.settings-drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:245;width:min(440px,100%);overflow-y:auto;
  padding:18px 18px 28px;background:var(--paper);box-shadow:-12px 0 32px rgba(20,20,45,.2);box-sizing:border-box;
}
.settings-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.settings-head h2{margin:0;font-size:28px;font-weight:900}
.settings-close{width:40px;height:40px;border:2px solid var(--ink);border-radius:8px;background:#fff;color:var(--ink);font-size:22px;line-height:1;cursor:pointer}
.settings-section{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding:12px 14px;border-radius:10px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.settings-label{font-size:14px;font-weight:800}
.settings-dossier .dossier-number-value{font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;font-size:15px;font-weight:700;letter-spacing:.06em;overflow-wrap:anywhere}
.settings-dossier .dossier-number-value.is-empty{color:var(--muted);font-family:inherit}
.settings-drawer .cloud-footer{margin:0;padding:0;border:0;display:block}
.settings-drawer .cloud-panel,.settings-drawer .cloud-footer .cloud-panel{min-width:0;max-width:none;width:100%;margin:0;box-sizing:border-box}
.settings-drawer .cloud-panel-main{grid-template-columns:1fr;gap:12px}
.settings-drawer .cloud-actions{justify-content:flex-start;max-width:none}
.settings-drawer .cloud-actions button{flex:1 1 calc(50% - 6px);min-height:40px;font-size:13px}
.settings-drawer .cloud-panel small{font-size:12px}
.settings-drawer .cloud-sync-meta,.settings-drawer .cloud-status-line{font-size:13px}

/* ---------- 只读分享页 ---------- */
.cloud-viewer-mode .dossier-photo:disabled{opacity:1;cursor:default}
.cloud-viewer-mode .dossier-photo-hint,.cloud-viewer-mode .dossier-photo-remove,.cloud-viewer-mode .qa-refill,.cloud-viewer-mode .arc-empty-cta{display:none}
/* 需要压过旧的通用规则 .cloud-viewer-mode input:not([type=checkbox]):not([type=radio])[readonly]（浅灰底） */
.cloud-viewer-mode .info-grid input.info-input[readonly]:not([type="checkbox"]):not([type="radio"]),
.cloud-viewer-mode .bg-section textarea[readonly]{background:transparent;cursor:default}
.cloud-viewer-mode .info-grid input.stat-input[readonly]:not([type="checkbox"]):not([type="radio"]){background:var(--c);color:var(--on-c);-webkit-text-fill-color:var(--on-c);cursor:default}
.cloud-viewer-mode .info-grid input.info-rank-value[readonly]:not([type="checkbox"]):not([type="radio"]){background:transparent;color:#fff;-webkit-text-fill-color:#fff}
.cloud-viewer-mode .arc-col-select:disabled{background:transparent;opacity:1;color:var(--c-text);-webkit-text-fill-color:var(--c-text);cursor:default}
.cloud-viewer-mode .arc-col-head::after{display:none}
.cloud-viewer-mode .qa-score:disabled{opacity:1;cursor:default}
.cloud-viewer-mode .aptitude-point{cursor:default}
.cloud-viewer-mode .ov-check input:disabled{opacity:1;cursor:default}
.cloud-viewer-mode .ov-check{cursor:default}
.cloud-viewer-mode .reality-track-box:disabled{opacity:1;cursor:default}

/* 从主档案跳到详情页时的定位高亮 */
#relationships,#requisitions,.ability-card{scroll-margin-top:20px}
.is-flash{animation:arcFlash 1.4s ease-out}
@keyframes arcFlash{0%,30%{box-shadow:0 0 0 4px rgba(22,85,176,.35)}100%{box-shadow:0 0 0 4px rgba(22,85,176,0)}}

/* ---------- 窄屏 ---------- */
@media(max-width:1180px){
  .main-grid{grid-template-columns:1fr}
  .main-right{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .app-page-title{font-size:44px}
  .app-tab{font-size:22px}
}
@media(max-width:900px){
  .app-header{flex-wrap:wrap}
  .app-brand{flex:1;border-radius:8px}
  .app-nav{order:3;flex-basis:100%;border-radius:8px;padding:2px 6px}
  .app-tab{font-size:17px;padding:8px 8px}
  .app-page-title{font-size:36px}
  .app-logo{width:46px}
  .app-settings-button{font-size:18px;padding:0 16px}
  .main-right{grid-template-columns:1fr}
  .info-block{grid-template-columns:132px minmax(0,1fr)}
  .info-grid{
    grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:none;
    grid-template-areas:"name name name name gender gender" "code code code code age age" "rank rank rank rank rank rank" "reward reward reprimand reprimand overload overload";
  }
  .stat-card{flex-direction:column;align-items:stretch;gap:6px;padding:8px}
  .stat-card label{flex-direction:row;align-items:baseline}
  .stat-card label small{display:none}
  .stat-input{width:100%;height:48px;font-size:30px}
  .app-main > .sheet-page:not(#page-main){padding:22px 18px 30px}
}
/* 手机：一次显示一栏 ARC，用 A / R / C 按钮切换 */
@media(max-width:760px){
  .arc-switch{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
  .arc-switch-btn{
    --c:var(--ink);display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;
    border:2px solid var(--c);border-radius:10px;background:#fff;color:var(--c);font:inherit;font-size:15px;font-weight:800;cursor:pointer;
  }
  .arc-switch-btn span{font-size:18px;font-weight:900}
  .arc-switch-a{--c:var(--blue)}.arc-switch-r{--c:#b06f00}.arc-switch-c{--c:var(--red)}
  .arc-switch-btn.is-active{background:var(--c);color:#fff}
  .arc-switch-r.is-active{background:var(--yellow);border-color:var(--yellow);color:var(--ink)}
  .arc-overview-grid{grid-template-columns:1fr}
  .arc-col{display:none}
  .arc-overview-grid[data-active="a"] .arc-col-a,
  .arc-overview-grid[data-active="r"] .arc-col-r,
  .arc-overview-grid[data-active="c"] .arc-col-c{display:grid}
  #relationships,#requisitions,.ability-card{scroll-margin-top:12px}
}
@media(max-width:560px){
  .app-shell{padding:8px 10px 36px}
  .app-kicker{font-size:10px}
  .app-page-title{font-size:30px}
  .info-block{grid-template-columns:1fr}
  .info-photo .dossier-photo{min-height:180px;max-width:150px;margin:0 auto}
  .info-input{--fit-max:28px}
  .info-rank-value{--fit-max:32px}
  .qa-row{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"name . score" "track track track";row-gap:4px;padding:6px 0}
  .qa-name{grid-area:name}.aptitude-track{grid-area:track}.qa-score-wrap{grid-area:score;width:74px}
  .qa-name strong{font-size:20px}
  .panel-head h2{font-size:24px}
}