/* ===== GW Gantt – v5.6 (clean view) ===== */

:root{
  --gw-cell: 52px;
  --gw-bar-h: 22px;
  --gw-row-pad: 10px;
  --gw-label: 200px;

  /* Light */
  --gw-bg:#f7f9fd;
  --gw-panel:#ffffff;
  --gw-text:#0b1220;
  --gw-subtext:#364152;
  --gw-border:#e5eaf3;
  --gw-grid:#e8edf7;       /* 日線（細） */
  --gw-grid-top:#eef2fb;
  --gw-grid-row:#ffffff;
  --gw-today:#2f7dff22;
  --gw-weekline:#d6def1;   /* 週線（太） */
  --gw-monthline:#b6c2e6;  /* 月線（太） */
  --gw-hover:#0069ff;

  --media-max-h: min(60vh, 420px);
}
body.light-theme{
  --gw-bg:#f7f9fd; --gw-panel:#ffffff; --gw-text:#0b1220; --gw-subtext:#364152;
  --gw-border:#e5eaf3; --gw-grid:#e8edf7; --gw-grid-top:#eef2fb; --gw-grid-row:#ffffff;
  --gw-today:#2f7dff22; --gw-weekline:#d6def1; --gw-monthline:#b6c2e6; --gw-hover:#0069ff;
}
body.dark-theme{
  --gw-bg:#0f131a; --gw-panel:#141a23; --gw-text:#e8eef9; --gw-subtext:#cbd7eb;
  --gw-border:#1f2430; --gw-grid:#182031; --gw-grid-top:#171c26; --gw-grid-row:#141923;
  --gw-today:#4da3ff55; --gw-weekline:#22314a; --gw-monthline:#3a4b6a; --gw-hover:#9bd;
  --media-max-h: min(60vh, 360px);
}

.gantt-wrapper{
  margin: 10px 0 20px;
  color: var(--gw-text);
  font: 14px/1.5 ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, 'Noto Sans JP', Helvetica, Arial;
  background: transparent;
}

/* ===== Toolbar ===== */
.gw-toolbar{
  display:flex; gap:8px; align-items:center; flex-wrap:wrap;
  margin: 0 0 10px;
}
.gw-toolbar .gw-nav,
.gw-toolbar select{
  border:1px solid var(--gw-border);
  background:var(--gw-panel); color:var(--gw-text);
  border-radius:8px; padding:6px 10px; cursor:pointer;
}
.gw-toolbar .gw-nav:hover{ border-color: var(--gw-hover); color: var(--gw-hover); }
/* WP 絵文字 <img class="emoji"> の縦ズレ対策 */
.gw-toolbar img.emoji{ width:1em; height:1em; vertical-align:-0.15em; }

/* ===== Canvas ===== */
#gw-gantt{
  position: relative;
  border:1px solid var(--gw-border);
  background: var(--gw-panel);
  border-radius: 10px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  touch-action: pan-x;
  cursor: grab;
  contain: paint;
}
#gw-gantt.is-dragging{ cursor: grabbing; }
#gw-gantt .gw-sheet{ --gw-days: 31; min-width: calc(var(--gw-label) + (var(--gw-days) * var(--gw-cell))); }

/* ===== 2段スケール ===== */
#gw-scale{ position: sticky; top: 0; z-index: 4; background: var(--gw-panel); border-bottom:1px solid var(--gw-border); }
.gw-scale-monthbar{
  display:grid; grid-template-columns: var(--gw-label) repeat(var(--gw-days), var(--gw-cell));
  background: linear-gradient(180deg, var(--gw-grid-top), var(--gw-panel));
  height: 28px;
}
.gw-scale-left{ position: sticky; left:0; z-index:5; background: linear-gradient(180deg, var(--gw-grid-top), var(--gw-panel)); border-right:2px solid var(--gw-monthline); }
.gw-month{ grid-column: 2 / span var(--gw-days); display:flex; align-items:center; padding-left: 8px; font-weight:700; }

.gw-scale-daybar{
  display:grid; grid-template-columns: var(--gw-label) repeat(var(--gw-days), var(--gw-cell));
  height: 36px;
}
.gw-day{
  border-right:1px solid var(--gw-grid);       /* 日線=細 */
  display:flex; align-items:center; justify-content:center;
  font-size: 12px; color:var(--gw-subtext);
  white-space: nowrap;                          /* 縦積み防止 */
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  pointer-events: none;
}
.gw-day.is-week { border-right:2px solid var(--gw-weekline); } /* 週線=太 */
.gw-day.is-today{ background: var(--gw-today); color: var(--gw-text); font-weight: 700; }

/* ===== Rows ===== */
#gw-rows{ position: relative; z-index: 1; background: var(--gw-panel); }
.gw-group{ border-bottom:1px solid var(--gw-border); background: linear-gradient(180deg, var(--gw-grid-row), var(--gw-panel)); }
.gw-group__title{
  display:grid; grid-template-columns: var(--gw-label) 1fr;
  align-items:center; height: 32px; border-bottom:1px dashed var(--gw-border);
}
.gw-group__title .label{
  position: sticky; left:0; z-index:3;
  background: linear-gradient(180deg, var(--gw-grid-row), var(--gw-panel));
  padding: 6px 10px; font-weight:700;
  border-right:2px solid var(--gw-monthline); /* 左列とグリッドの境界を太線で固定 */
}
.gw-group__title .grid{
  display:grid; grid-template-columns: repeat(var(--gw-days), var(--gw-cell));
  height: 100%;
  border-left:2px solid var(--gw-monthline);  /* 本体側も左端月線=太線でヘッダと合わせる */
}
.gw-group__title .grid > i{ border-right: 1px solid var(--gw-grid); pointer-events:none; }
.gw-group__title .grid > i.is-week{ border-right:2px solid var(--gw-weekline); }

.gw-row{ display:grid; grid-template-columns: var(--gw-label) 1fr; gap:0; padding: var(--gw-row-pad) 0; }
.gw-row + .gw-row{ border-top:1px solid var(--gw-border); }
.gw-label{
  position: sticky; left:0; z-index:2;
  background: var(--gw-panel);
  padding: 4px 10px 0 10px; cursor:pointer;
  border-right:2px solid var(--gw-monthline);
}
.gw-label .title{ font-weight:600; display:block; }
.gw-label .meta{ font-size:12px; color: var(--gw-subtext); }

.gw-grid{
  display:grid; grid-template-columns: repeat(var(--gw-days), var(--gw-cell));
  position: relative; min-height: calc(var(--gw-bar-h) + 8px); align-items:center;
  border-left:2px solid var(--gw-monthline);  /* 左端月線=太線 */
}
.gw-grid > i{ height: 100%; border-right:1px solid var(--gw-grid); pointer-events:none; }
.gw-grid > i.is-week{ border-right:2px solid var(--gw-weekline); }

/* うっすら行の読みガイド */
.gw-row:hover .gw-grid{ background: linear-gradient(180deg, transparent, rgba(127,127,127,.03), transparent); }

.gw-bar{
  height: var(--gw-bar-h); border-radius: 999px; display:flex; align-items:center;
  padding: 0 10px; font-size: 12px; color: #0b1220;
  background: linear-gradient(180deg,#a8d8ff,#74baff); border:1px solid #6aaef7;
  box-shadow: 0 1px 0 rgba(255,255,255,.35) inset, 0 6px 20px rgba(49,93,158,.25);
  cursor:pointer; overflow:hidden; user-select:none; -webkit-tap-highlight-color: transparent;
  transform: translateZ(0); /* 文字のにじみ軽減 */
}
.gw-bar:hover{ outline:2px solid var(--gw-hover); }
.gw-bar[data-item="character"]{ background:linear-gradient(180deg,#ffd2f0,#ff9cdc); border-color:#ff78ca; }
.gw-bar[data-item="weapon"]{    background:linear-gradient(180deg,#ffe5a8,#ffd071); border-color:#f3b04b; }
.gw-bar[data-item="event"]{     background:linear-gradient(180deg,#c7ffcc,#8ef3a1); border-color:#76da89; }
.gw-bar[data-item="quest"]{     background:linear-gradient(180deg,#e2d4ff,#c1b0ff); border-color:#a390ff; }
.gw-bar[data-item="story"]{     background:linear-gradient(180deg,#c5f1ff,#8dd8f3); border-color:#75c2dc; }
.gw-bar[data-item="other"]{     background:linear-gradient(180deg,#e9eef6,#d2dbe7); border-color:#c3ccda; }

/* ===== Modal ===== */
.gw-modal{ position: fixed; inset:0; z-index: 2147483000; display:none; }
.gw-modal.is-open{ display:block; }
.gw-modal__overlay{ position:absolute; inset:0; background: rgba(0,0,0,.60); }
.gw-modal__dialog{
  position:absolute; top:50%; left:50%; transform: translate(-50%,-50%);
  width: min(900px, 95vw);
  max-height: 90vh; overflow:auto;
  background: var(--gw-panel); color: var(--gw-text);
  border:1px solid var(--gw-border); border-radius: 12px;
  box-shadow: 0 10px 50px rgba(0,0,0,.4); padding: 16px 16px 22px;
}
.gw-modal.is-onecol .gw-modal__dialog{
  width: min( calc(var(--media-max-h) * 1.7778 + 48px), 92vw);
  max-width: 760px;
}
.gw-modal__close{
  position:absolute; top:8px; right:8px; font-size:22px; width:36px; height:36px;
  border-radius: 999px; border:1px solid var(--gw-border);
  background: var(--gw-panel); color: var(--gw-text); cursor: pointer;
}
.gw-modal__title{
  margin: 0 40px 8px 0;
  overflow-wrap:anywhere; word-break:break-word;
}
.gw-modal__content{
  white-space: pre-wrap; overflow-wrap:anywhere; word-break:break-word;
}
.gw-meta{ margin-top: 6px; }
.gw-meta__row{ margin: 6px 0; color: var(--gw-subtext); }
.gw-remain{ margin-left: 8px; color: var(--gw-text); font-weight: 600; }
.gw-clock span{ margin-right: 8px; }

/* ===== Modal Media ===== */
#gw-media{ display:grid; gap:10px; margin: 8px 0 6px; }
.gw-modal.is-twocol #gw-media{ grid-template-columns: 1fr 1fr; }
.gw-modal.is-onecol #gw-media{ grid-template-columns: 1fr; }

#gw-media .media-box{
  border:1px solid var(--gw-border); border-radius:10px; overflow:hidden; background:#000;
  aspect-ratio: 16 / 9;
  max-height: var(--media-max-h);
}
#gw-media img{ width:100%; height:100%; object-fit: cover; display:block; }
#gw-media lite-youtube, #gw-media lite-youtube-embed, #gw-media iframe{ width:100%; height:100%; display:block; }

/* ===== Mobile ===== */
@media (max-width: 640px){
  :root{ --gw-label: 160px; --gw-cell: 44px; --gw-bar-h: 20px; }
  .gw-modal__dialog{ width: 96vw; }

  .gw-modal #gw-media{ display:block; }
  .gw-media-slider{ position:relative; touch-action: pan-y; }
  .gw-media-track{ display:flex; gap:0; will-change: transform; transition: transform .35s ease; }
  .gw-media-slide{ flex:0 0 100%; padding: 2px; box-sizing: border-box; }
  .gw-media-nav{
    position:absolute; top:50%; transform:translateY(-50%);
    width:34px; height:34px; border-radius:999px; border:1px solid var(--gw-border);
    background: var(--gw-panel); color: var(--gw-text); cursor:pointer;
  }
  .gw-media-prev{ left:8px; } .gw-media-next{ right:8px; }
  .gw-media-dots{ display:flex; gap:6px; justify-content:center; padding:6px 0 2px; }
  .gw-media-dots button{ width:8px; height:8px; border-radius:999px; border:0; background:#9aa6bf; opacity:.5; }
  .gw-media-dots button.is-active{ opacity:1; background:#4c84ff; }
}