/* ============================================================
   サマリータブ専用スタイル (#t-summary スコープ)
   index.html 既存クラス (.cd/.cl/.cv/.cs/.pos/.neg/.sc) は再利用、
   それ以外 (.card/.seg/.chart-box/.tbl/.lst/.bg/modal) は本ファイルで
   #t-summary 配下に限定して定義し、他ページ/他タブと衝突させない。
   ============================================================ */

#t-summary{padding-top:4px}
#t-summary .sum-sc{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;margin-bottom:16px}
#t-summary .sum-delta{font-size:11px;margin-top:5px;font-family:var(--mono);color:var(--tx2);line-height:1.5}

/* min-width:0 = グリッド blowout 防止。リスト内の長い No/テキストで列幅がずれず、
   CR/タイトル/記事 行も 作成者/ディレクション/CRフォーマット 行と同じ等幅 1/3 に固定される */
#t-summary .s-card{background:var(--bg2);border:1px solid var(--bdr);border-radius:var(--r,8px);padding:16px 18px;margin-bottom:16px;min-width:0;overflow:hidden}
#t-summary .s-card.nomb{margin-bottom:0}
#t-summary .s-card-h{font-size:13px;font-weight:700;color:var(--tx2);margin-bottom:14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#t-summary .s-card-h .sub{font-size:11px;color:var(--tx3);font-weight:400;font-family:var(--mono)}
#t-summary .s-card-h .spc{flex:1}

#t-summary .seg{display:inline-flex;border:1px solid var(--bdr2);border-radius:6px;overflow:hidden}
#t-summary .seg button{padding:4px 9px;font-size:11px;background:var(--bg3);color:var(--tx3);border:none;cursor:pointer;font-family:inherit;border-right:1px solid var(--bdr2)}
#t-summary .seg button:last-child{border-right:none}
#t-summary .seg button.active{background:var(--acc);color:#fff;font-weight:600}

#t-summary .s-row{display:grid;gap:16px;margin-bottom:16px}
#t-summary .r-1-1{grid-template-columns:1fr 1fr}
#t-summary .r-1-1-1{grid-template-columns:1fr 1fr 1fr}
#t-summary .chart-box{position:relative;height:392px}

#t-summary .s-tblwrap{overflow:auto;height:392px}
#t-summary .s-tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:13px}
/* 余白を最小化 + 薄い方眼(縦罫線)で視認性を確保し、横スクロールなしで8列を収める */
#t-summary .s-tbl{table-layout:fixed;width:100%}
#t-summary .s-tbl td{overflow:hidden}
#t-summary .s-tbl th{text-align:right;padding:3px 4px;color:var(--tx3);font-weight:500;font-size:10.5px;border-bottom:1px solid var(--bdr2);border-right:1px solid var(--bdr);white-space:nowrap;cursor:default;position:sticky;top:0;background:var(--bg2);z-index:2}
#t-summary .s-tbl th:first-child{text-align:left}
#t-summary .s-tbl th:last-child,#t-summary .s-tbl td:last-child{border-right:none}
#t-summary .s-tbl th.hot{color:var(--acc2)}
#t-summary .s-tbl td{padding:3px 4px;border-bottom:1px solid var(--bdr);border-right:1px solid var(--bdr);white-space:nowrap;font-family:var(--mono);font-size:11px;text-align:right;font-variant-numeric:tabular-nums}
#t-summary .s-tbl td:first-child{text-align:left;font-family:'Noto Sans JP',sans-serif;font-weight:600}
#t-summary .s-tbl .s-bg{margin-left:3px;padding:1px 5px}
#t-summary .s-tbl .s-pm-name{display:inline-block;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
#t-summary .s-tbl td.hot{background:rgba(59,130,246,.07)}
#t-summary .s-tbl tr:hover td{background:var(--bg3)}

#t-summary .s-bg{display:inline-block;font-size:10px;padding:1px 7px;border-radius:8px;font-weight:500;margin-left:6px;background:rgba(100,116,139,.18);color:var(--tx2)}
#t-summary .s-bg.b-yda{background:rgba(168,85,247,.15);color:var(--purple)}
#t-summary .s-bg.b-yts{background:rgba(239,68,68,.15);color:var(--red)}
#t-summary .s-bg.b-tiktok{background:rgba(100,116,139,.18);color:var(--tx2)}
#t-summary .s-bg.b-meta{background:rgba(59,130,246,.15);color:var(--acc2)}
#t-summary .s-bg.b-google{background:rgba(234,179,8,.15);color:var(--yellow)}
/* 取引先 種別バッジ (ASP/直/レベシェア) */
#t-summary .s-bg.b-asp{background:rgba(59,130,246,.15);color:var(--acc2)}
#t-summary .s-bg.b-direct{background:rgba(34,197,94,.15);color:var(--green)}
#t-summary .s-bg.b-revshare{background:rgba(168,85,247,.15);color:var(--purple)}
#t-summary .s-bg.b-other{background:rgba(100,116,139,.18);color:var(--tx2)}

/* リストは高さ固定(392px)+縦スクロール。指標切替で件数=10のまま高さは不変。
   flex-shrink:0 で行が潰れず、メタは nowrap で折返さない */
#t-summary .lst{display:flex;flex-direction:column;height:392px;overflow-y:auto}
#t-summary .lst-row{display:flex;align-items:center;gap:10px;padding:8px 6px;border-bottom:1px solid var(--bdr);cursor:pointer;border-radius:6px;flex-shrink:0}
#t-summary .lst-row:hover{background:var(--bg3)}
#t-summary .lst-no{font-family:var(--mono);font-size:12px;color:var(--acc2);font-weight:600;min-width:128px;white-space:nowrap}
#t-summary .lst-meta{font-family:var(--mono);font-size:12px;font-weight:700;margin-left:auto;text-align:right;white-space:nowrap}
#t-summary .lst-txt{font-size:11px;color:var(--tx3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
#t-summary .lst-empty{padding:24px;text-align:center;color:var(--tx3);font-size:12px}
/* サムネ付き行 (CR=GDrive画像 / 記事=LP縮小iframe)。行が高くなり縦スクロール許容 */
#t-summary .lst-row.with-thumb{align-items:flex-start}
#t-summary .lst-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;overflow:hidden}
#t-summary .lst-main .lst-no{min-width:0}
#t-summary .lst-thumb{flex:0 0 auto;width:52px;height:66px;border-radius:4px;object-fit:cover;background:var(--bg3);border:1px solid var(--bdr2)}
#t-summary .lst-thumb.art{width:60px;height:78px;overflow:hidden;position:relative;background:#fff}
#t-summary .lst-thumb.art iframe{position:absolute;top:0;left:0;width:600px;height:780px;border:0;transform:scale(.1);transform-origin:top left;pointer-events:none;background:#fff}

/* CR / 記事: 2列×5行 セルグリッド (スクロールなし・固定高さ392px) */
#t-summary .cells{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(5,1fr);gap:6px;height:392px}
#t-summary .cells .lst-empty{grid-column:1/-1}
#t-summary .cell{display:flex;align-items:center;gap:7px;padding:5px 7px;border:1px solid var(--bdr);border-radius:6px;background:var(--bg);cursor:pointer;overflow:hidden;min-width:0}
#t-summary .cell:hover{background:var(--bg3)}
#t-summary .cell-rank{flex:0 0 auto;width:19px;height:19px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;font-family:var(--mono);background:var(--bg3);color:var(--tx2)}
#t-summary .cell-rank.r1{background:#f59e0b;color:#1a1d26}
#t-summary .cell-rank.r2{background:#9ca3af;color:#1a1d26}
#t-summary .cell-rank.r3{background:#b45309;color:#fff}
#t-summary .cell-thumb{flex:0 0 auto;width:44px;height:58px;border-radius:4px;object-fit:cover;background:var(--bg3);border:1px solid var(--bdr2)}
#t-summary .cell-thumb.art{overflow:hidden;position:relative;background:#fff}
#t-summary .cell-thumb.art iframe{position:absolute;top:0;left:0;width:440px;height:580px;border:0;transform:scale(.1);transform-origin:top left;pointer-events:none;background:#fff}
#t-summary .cell-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;overflow:hidden}
#t-summary .cell-no{font-family:var(--mono);font-size:11px;color:var(--acc2);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#t-summary .cell-hook{font-size:10px;color:var(--tx3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#t-summary .cell-meta{font-size:11px;font-weight:700;font-family:var(--mono);white-space:nowrap}

/* 詳細モーダル (サマリー専用) */
#sumMov{position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;align-items:center;justify-content:center;z-index:9999;padding:20px}
#sumMov.show{display:flex}
#sumMov .mdl{background:var(--bg2);border:1px solid var(--bdr2);border-radius:12px;max-width:520px;width:100%;max-height:85vh;overflow:auto}
#sumMov .mdl-h{padding:14px 18px;border-bottom:1px solid var(--bdr);display:flex;align-items:center;justify-content:space-between}
#sumMov .mdl-h .t{font-size:14px;font-weight:700}
#sumMov .mdl-h button{background:none;border:none;color:var(--tx3);font-size:20px;cursor:pointer}
#sumMov .mdl-b{padding:18px}
#sumMov .mdl-stat{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
#sumMov .mdl-stat .s{background:var(--bg3);border-radius:8px;padding:10px 12px}
#sumMov .mdl-stat .s .l{font-size:11px;color:var(--tx3)}
#sumMov .mdl-stat .s .v{font-size:16px;font-weight:700;font-family:var(--mono);margin-top:3px}

@media(max-width:1100px){
  #t-summary .sum-sc{grid-template-columns:repeat(4,1fr)}
  #t-summary .r-1-1,#t-summary .r-1-1-1{grid-template-columns:1fr}
}