:root{
  --card:#231b28;
  --ink:#fff;
  --muted:#cfcfe8;
  --border:#3a2c44;
  --acc:#7c3aed;
  --shadow:0 8px 18px rgba(0,0,0,.35);
}
body{background:#120f14;color:var(--ink)}
.wrap{max-width:1100px;margin:0 auto;padding:16px}

/* ヘッダー（70px統一） */
.site-header.cinema-header{background:#1a141b;border-bottom:1px solid var(--border)}
.header-inner{ min-height:70px }
.brand-logo{ height:70px }
.cinema-menu .menu-icon{ height:70px }
.cinema-menu .menu-link{ display:inline-flex; align-items:center; height:70px }
.hamburger{ height:70px; line-height:70px; padding:0 16px }

/* セクション共通 */
.card{ background:var(--card); border:1px solid var(--border); border-radius:14px; box-shadow:var(--shadow) }
.card-hd{ padding:14px 16px; border-bottom:1px solid var(--border); font-weight:800 }
.card-bd{ padding:14px 16px }

.row{ display:flex; gap:10px; align-items:center; flex-wrap:wrap }
.col{ display:flex; flex-direction:column; gap:8px }
.label{ color:#ddd; font-size:14px }
.input{
  background:#2d2433; color:#fff; border:1px solid #4a3a55; border-radius:10px;
  padding:10px 12px; outline:none; width:100%;
}
.btn{
  border:1px solid #4a3a55; border-radius:10px; padding:10px 14px; color:#fff;
  background:#2d2433; cursor:pointer; transition:.15s; font-weight:700;
}
.btn:hover{ filter:brightness(1.05) }
.btn.acc{ background:var(--acc); border-color:var(--acc) }
.btn.danger{ background:#7f1d1d; border-color:#7f1d1d }

/* 一覧カード */
.grid{ display:grid; gap:16px; grid-template-columns:repeat(3,1fr) }
@media(max-width:1000px){ .grid{ grid-template-columns:repeat(2,1fr) } }
@media(max-width:640px){  .grid{ grid-template-columns:1fr } }

.work{ overflow:hidden; position:relative }
.work .head{padding:10px 12px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.work .meta{font-size:12px;color:var(--muted)}
.thumb-wrap{ position:relative; background:#0f0e12; border-top:1px solid var(--border); border-bottom:1px solid var(--border) }
.thumb{ width:100%; height:170px; object-fit:cover; display:block }
.work .body{padding:12px}
.btn-row{display:flex;gap:8px;flex-wrap:wrap}
.empty{color:#cfcfe8;background:#2b2332;border:1px dashed #4a3a55;border-radius:12px;padding:14px;text-align:center}

.sec-title{margin:18px 0 10px}
.sec-title span{background:#2b2332;border:1px solid var(--border);border-radius:10px;padding:8px 12px;display:inline-block}

/* ================= 舞台（背景＋左右キャラ）共通 ================= */
.thumb-stage { width:100% }
.thumb-stage .stage{
  position:relative; width:100%; aspect-ratio:16/9;
  background:#000; border-radius:12px; overflow:hidden;
}
.thumb-stage .bg{
  position:absolute; inset:0; background-size:cover; background-position:center; z-index:1;
}
.thumb-stage .char-wrap{
  position:absolute; inset-inline:0; bottom:0; display:flex; align-items:flex-end; pointer-events:none; z-index:2;
}
.thumb-stage .char-wrap.right{ justify-content:flex-end }
.thumb-stage .char-fig{ margin:0; padding:0 8px; height:100%; display:flex; align-items:flex-end }
.thumb-stage .char-fig img{
  display:block; width:auto; height:95%;  /* entries_list と同等の既定値 */
}
.thumb-stage .char-fig.pose-up   img{ height:70% }
.thumb-stage .char-fig.pose-full img{ height:95% }
.right-flip{ transform:scaleX(-1) }

.title-band{
  position:absolute; left:0; right:0; top:0;
  background:linear-gradient(180deg, rgba(0,0,0,.65), rgba(0,0,0,0));
  padding:8px 10px; font-weight:800; font-size:16px; color:#fff; text-shadow:0 2px 6px rgba(0,0,0,.45);
  z-index:6;
}

/* ============================================================= */
/* =============== ここから mypage 専用の上書き =================== */
/* ============================================================= */

/* ============================================================= */
/* mypage 専用（entries_list と同じロジック・重複なしの決定版）     */
/* ============================================================= */

/* 1) ステージは 170px 固定。16:9 は無効化 */
body[data-page="mypage"] .thumb-stage .stage{
  height:170px !important;
  aspect-ratio:auto !important;
  overflow:hidden !important;
}

/* 2) ラップは上下左右ぴったり */
body[data-page="mypage"] .thumb-stage .stage .char-wrap{
  position:absolute !important;
  inset:0 !important;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:flex-start !important;
}
body[data-page="mypage"] .thumb-stage .stage .char-wrap.right{
  justify-content:flex-end !important;
}

/* 3) 画像は figure に追従（img は 100%/100%） */
body[data-page="mypage"] .thumb-stage .char-fig{
  position:relative !important;
  margin:0 !important;
  padding:0 8px !important;
  height:auto !important;
  display:flex !important;
  align-items:flex-end !important;
  filter:drop-shadow(0 12px 14px rgba(0,0,0,.35)) !important;
}
body[data-page="mypage"] .thumb-stage .char-fig img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}

/* 4) 縮尺は figure 側（entries_list と同値） */
body[data-page="mypage"] .thumb-stage .char-fig.pose-full{
  height:70% !important;
  margin-bottom:0 !important;
}
body[data-page="mypage"] .thumb-stage .char-fig.pose-up{
  height:120% !important;
  margin-bottom:-20% !important;
}
body[data-page="mypage"] .thumb-stage .char-fig.pose-up img{
  object-position:top center !important;
}

/* 5) 空 src は非表示（安全網） */
body[data-page="mypage"] .thumb-stage .char-fig img[src=""],
body[data-page="mypage"] .thumb-stage .char-fig img:not([src]){
  display:none !important;
}
