body.data-page{
  --data-green:#22c55e;
  --data-green-dark:#15803d;
  --accent-gold:#4ade80;
  --btn-grad-start:#34d399;
  --btn-grad-end:#15803d;
  --xfade-edge:rgba(74,222,128,.35);
}
.data-page .status-hero-copy{
  background:linear-gradient(180deg,#2bd96b,#149244)!important;
  border-color:rgba(111,255,165,.72)!important;
  box-shadow:0 4px 14px rgba(16,185,129,.28), inset 0 1px 0 rgba(255,255,255,.24)!important;
}
.data-page .status-toolbar{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.data-page .status-toolbtn.active{
  background:linear-gradient(180deg,rgba(34,197,94,.95),rgba(21,128,61,.88));
  border-color:rgba(134,239,172,.8);
}
.data-page .character-master-title::after{
  content:"キャラ・スタイル原本";
  font-size:11px;
  margin-left:8px;
  color:#86efac;
}
.data-equipment-view{
  max-width:760px;
  margin:14px auto 90px;
  padding:0 12px;
}
.data-equipment-frame{
  display:block;
  width:100%;
  min-height:760px;
  border:0;
  border-radius:18px;
  background:transparent;
  overflow:hidden;
}
.data-page .data-role-note{
  margin:0 0 14px;
  padding:12px 14px;
  border:1px solid rgba(34,197,94,.36);
  border-radius:14px;
  background:rgba(10,45,28,.66);
  color:#d9ffe7;
  line-height:1.65;
  font-size:13px;
}
@media(max-width:640px){
  .data-page .status-toolbar{ gap:6px; }
  .data-page .status-toolbtn{ min-width:0; padding-left:4px; padding-right:4px; }
  .data-page .status-toolbtn .txt{ font-size:12px; }
  .data-equipment-view{ padding:0 8px; }
}
.data-page .container{max-width:760px;}
.data-page .character-master-grid,
.data-page .new-character-master-grid{grid-template-columns:1fr;}

/* v53.07: キャラ・スタイル管理のページ式候補一覧をデータ管理デザインへ統一 */
.data-page .manage-char-toolbar{
  margin:0 0 8px;
}
.data-page .manage-char-sort{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:9px;
  width:100%;
  padding:8px 10px;
  border:1px solid rgba(34,197,94,.24);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(240,253,244,.92),rgba(236,253,245,.72));
  color:#475569;
  box-shadow:none;
}
.data-page .manage-char-sort span{
  color:#166534;
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}
.data-page .manage-char-sort select{
  min-width:0;
  min-height:38px;
  padding:7px 34px 7px 10px;
  border:1px solid rgba(34,197,94,.28);
  border-radius:10px;
  background:rgba(255,255,255,.96);
  color:#172033;
  font-size:13px;
  font-weight:850;
  box-shadow:inset 0 1px 2px rgba(15,23,42,.04);
}
.data-page .manage-char-sort select:focus{
  border-color:rgba(34,197,94,.58);
  box-shadow:0 0 0 3px rgba(34,197,94,.13);
}
.data-page .manage-char-inline-panel{
  width:100%;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.data-page .manage-char-inline-note{
  margin:0 0 9px;
  padding:8px 10px;
  border:1px solid rgba(34,197,94,.18);
  border-left:4px solid rgba(34,197,94,.78);
  border-radius:10px;
  background:rgba(240,253,244,.68);
  color:#5b6b63;
  font-size:11px;
  line-height:1.5;
}
.data-page .manage-char-inline-panel .manage-char-picker-list{
  gap:7px;
}
.data-page .manage-char-option{
  position:relative;
  gap:10px;
  min-height:62px;
  padding:8px 10px;
  border:1px solid rgba(148,163,184,.24);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,250,252,.90));
  box-shadow:0 4px 12px rgba(15,23,42,.055);
  overflow:hidden;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease, transform .08s ease;
}
.data-page .manage-char-option::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:rgba(34,197,94,.32);
}
.data-page .manage-char-option:hover{
  border-color:rgba(34,197,94,.38);
  background:linear-gradient(180deg,#fff,rgba(240,253,244,.86));
}
.data-page .manage-char-option:active{
  transform:translateY(1px);
}
.data-page .manage-char-option.selected{
  padding-right:42px;
  border-color:rgba(34,197,94,.68);
  background:linear-gradient(180deg,rgba(240,253,244,.98),rgba(220,252,231,.86));
  box-shadow:0 0 0 2px rgba(34,197,94,.12),0 7px 16px rgba(21,128,61,.10);
}
.data-page .manage-char-option.selected::before{
  background:linear-gradient(180deg,#4ade80,#16a34a);
}
.data-page .manage-char-option.selected::after{
  content:"✓";
  position:absolute;
  top:50%;
  right:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border-radius:50%;
  background:linear-gradient(180deg,#34d399,#15803d);
  color:#fff;
  font-size:14px;
  font-weight:1000;
  line-height:1;
  box-shadow:0 4px 10px rgba(21,128,61,.22);
  transform:translateY(-50%);
}
.data-page .manage-char-option-thumb{
  width:44px;
  height:44px;
  flex:0 0 44px;
  border:2px solid rgba(34,197,94,.42);
  background:#f8fafc;
  box-shadow:0 3px 8px rgba(15,23,42,.10);
}
.data-page .manage-char-option.selected .manage-char-option-thumb{
  border-color:rgba(21,128,61,.68);
}
.data-page .manage-char-option-name{
  color:#172033;
  font-size:14px;
  font-weight:900;
  line-height:1.25;
}
.data-page .manage-char-option-meta{
  gap:5px;
  margin-top:4px;
}
.data-page .manage-char-chip{
  min-height:20px;
  padding:2px 7px;
  border:1px solid rgba(34,197,94,.16);
  border-radius:999px;
  background:rgba(240,253,244,.86);
  color:#166534;
  font-size:10px;
  font-weight:900;
  line-height:1.3;
}
.data-page .manage-char-option-meta .manage-char-chip:nth-child(2){
  border-color:rgba(59,130,246,.15);
  background:rgba(239,246,255,.92);
  color:#1d4ed8;
}
.data-page .manage-char-chip.cp-on{
  border-color:rgba(245,158,11,.20);
  background:#fff7df;
  color:#9a5c09;
}
.data-page .manage-char-chip.cp-off{
  border-color:rgba(148,163,184,.20);
  background:#eef2f6;
  color:#64748b;
}
.data-page .manage-char-picker-pagination{
  justify-content:space-between;
  gap:8px;
  margin-top:10px;
  padding:8px;
  border:1px solid rgba(34,197,94,.18);
  border-radius:12px;
  background:linear-gradient(180deg,rgba(240,253,244,.74),rgba(248,250,252,.78));
}
.data-page .manage-char-picker-pagination .btn{
  min-width:80px;
  min-height:36px;
  padding:7px 11px;
  margin:0;
  border:1px solid rgba(34,197,94,.26);
  border-radius:10px;
  background:rgba(255,255,255,.96);
  color:#166534;
  font-size:12px;
  font-weight:900;
  box-shadow:0 3px 9px rgba(15,23,42,.06);
}
.data-page .manage-char-picker-pagination .btn:not(:disabled):active{
  background:rgba(220,252,231,.88);
}

.data-page .manage-char-picker-page-info{
  min-width:0;
  flex:1 1 auto;
  padding:7px 8px;
  border:1px solid rgba(34,197,94,.14);
  border-radius:10px;
  background:rgba(255,255,255,.80);
  color:#476152;
  font-size:11px;
  font-weight:900;
  text-align:center;
  font-variant-numeric:tabular-nums;
}
.data-page .manage-char-picker-empty{
  padding:24px 12px;
  border:1px dashed rgba(34,197,94,.28);
  border-radius:12px;
  background:rgba(240,253,244,.58);
  color:#64748b;
}
@media(max-width:640px){
  .data-page .manage-char-sort{
    grid-template-columns:58px minmax(0,1fr);
    gap:7px;
    padding:7px 8px;
  }
  .data-page .manage-char-sort select{
    min-height:36px;
    font-size:12.5px;
  }
  .data-page .manage-char-inline-note{
    padding:7px 9px;
    font-size:10.5px;
  }
  .data-page .manage-char-option{
    min-height:58px;
    padding:7px 8px;
    gap:8px;
    border-radius:11px;
  }
  .data-page .manage-char-option.selected{ padding-right:38px; }
  .data-page .manage-char-option.selected::after{
    right:9px;
    width:22px;
    height:22px;
    font-size:13px;
  }
  .data-page .manage-char-option-thumb{
    width:42px;
    height:42px;
    flex-basis:42px;
  }
  .data-page .manage-char-option-name{ font-size:13.5px; }
  .data-page .manage-char-chip{ padding:2px 6px; font-size:9.5px; }
  .data-page .manage-char-picker-pagination{
    gap:6px;
    padding:7px;
  }
  .data-page .manage-char-picker-pagination .btn{
    min-width:68px;
    min-height:34px;
    padding:6px 8px;
    font-size:11px;
  }
  .data-page .manage-char-picker-page-info{
    padding:6px 4px;
    font-size:10px;
  }
}

/* v53.09 — Data Management contrast reinforcement */
.data-page .character-link-note,
.data-page .manage-char-inline-note,
.data-page .manage-char-picker-page-info{
  color:#475569;
}
.data-page .manage-char-chip.cp-off,
.data-page .manage-char-picker-empty{
  color:#475569;
}
.data-page .manage-char-picker-pagination .btn:disabled{
  border-color:#cbd5e1;
  background:#eef2f7;
  color:#64748b;
  opacity:1;
}
.data-page #styleFormTitle{
  color:#166534 !important;
}

/* v53.10: 管理者側の標準BASE設定 */
.data-page .data-admin-base-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  margin:0 0 14px;
  padding:11px 12px;
  border:1px solid rgba(34,197,94,.34);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(240,253,244,.96),rgba(236,253,245,.84));
  box-shadow:0 6px 16px rgba(21,128,61,.08);
}
.data-page .data-admin-base-copy{ min-width:0; }
.data-page .data-admin-base-title{
  margin-bottom:3px;
  color:#166534;
  font-size:13px;
  font-weight:950;
}
.data-page .data-admin-base-note{
  color:#4b6355;
  font-size:11px;
  font-weight:650;
  line-height:1.5;
}
.data-page .data-admin-base-controls{
  display:grid;
  grid-template-columns:auto 76px;
  align-items:center;
  gap:5px 7px;
  min-width:176px;
}
.data-page .data-admin-base-controls label{
  color:#166534;
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}
.data-page #adminStandardBase{
  width:76px;
  min-width:76px;
  height:34px;
  padding:4px 6px;
  border:1px solid rgba(34,197,94,.36);
  border-radius:9px;
  background:#fff;
  color:#0f172a;
  font-size:16px;
  font-weight:950;
  text-align:center;
}
.data-page #adminStandardBase:focus{
  border-color:rgba(22,163,74,.7);
  box-shadow:0 0 0 3px rgba(34,197,94,.14);
}
.data-page .data-admin-base-effective{
  grid-column:1 / -1;
  color:#475569;
  font-size:10.5px;
  font-weight:750;
  text-align:right;
}
.data-page .data-admin-base-effective.is-override{
  color:#6d28d9;
  font-weight:850;
}
@media(max-width:620px){
  .data-page .data-admin-base-panel{
    grid-template-columns:1fr;
    gap:9px;
  }
  .data-page .data-admin-base-controls{
    grid-template-columns:auto minmax(76px,110px);
    justify-content:end;
  }
  .data-page .data-admin-base-effective{ text-align:left; }
}