/* ═══════════════════════════════════════════════════════════════
   SedoNote 商品詳細ページ本文部品（item.css / v0.254 B-57・v0.258 B-59でアプリ内表示も兼任）
   - グローバルchrome（ヘッダー/フッター/ドック）は本体と共通の sn.css を読み込む
     ＝本ファイルには持たない（rn.css と同じ構え・静的フラット様式の土台を踏襲）
   - デザイントークンは sn.css の --sn-* と --surface, --action 等（body.flat スコープ）を参照
   - 角R: 等倍ページのコンテンツ部品 = 7px／小型バッジ = 4px（v0.175 統一ルール）
   - 影・ぼかし・グラデは使わない（フラット正典）
   - body.embed = ホーム検索モーダル内のiframe表示（chrome/CTAなし・余白圧縮・背景透過）
   ═══════════════════════════════════════════════════════════════ */

/* ── 上段: 画像（正方形）＋価格推移チャート ───────────────────────── */
.it-media{display:flex;gap:10px;margin-bottom:12px;--media-h:190px;}
.it-photo{flex:0 0 var(--media-h);width:var(--media-h);height:var(--media-h);
  background:var(--surface);border:1px solid var(--sn-line-3,rgba(255,255,255,.06));border-radius:7px;
  display:flex;align-items:center;justify-content:center;overflow:hidden;}
.it-photo img{width:100%;height:100%;object-fit:contain;}
.it-photo-ph{display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--text3);font-size:10.5px;letter-spacing:.05em;}
.it-photo-ph svg{opacity:.45;}
.it-chart-card{flex:1;min-width:0;height:var(--media-h);background:var(--surface);
  border:1px solid var(--sn-line-3,rgba(255,255,255,.06));border-radius:7px;padding:10px;
  display:flex;flex-direction:column;}
#it-chart{width:100%;flex:1;min-height:0;}
#it-chart a#tv-attr-logo{transform:scale(.5);transform-origin:bottom left;}  /* TradingView帰属ロゴ縮小（表示は維持） */
#it-chart-empty{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--text3);font-size:11px;}
/* チャート凡例（新品=金エリア/中古=青ライン） */
.it-legend{display:flex;gap:12px;margin-bottom:6px;flex-shrink:0;}
.it-lg{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;color:var(--text3);}
.it-lg i{width:12px;height:3px;border-radius:1px;display:inline-block;}
.it-lg-new{background:rgba(201,168,76,.9);}
.it-lg-used{background:rgba(91,155,213,.9);}

/* ── 統計（買取系4区画／Amazon系2区画の連結カード・区画は｜ヘアライン） ── */
.it-summary{display:flex;gap:8px;margin-bottom:14px;}
.it-sg{height:84px;background:var(--surface);border:1px solid var(--sn-line-3,rgba(255,255,255,.06));border-radius:7px;display:flex;min-width:0;}
.it-sg-4{flex:4 1 0;}
.it-sg-2{flex:2 1 0;}
.it-seg{flex:1 1 0;min-width:0;padding:0 14px;display:flex;flex-direction:column;justify-content:center;}
.it-seg + .it-seg{border-left:1px solid var(--sn-line-2,rgba(255,255,255,.08));}
.it-ph .it-stat-val{color:var(--text3);opacity:.55;}   /* Amazonプレースホルダ（B-58実装まで薄色） */
.it-stat-label{font-size:10.5px;color:var(--text3);letter-spacing:.05em;margin-bottom:4px;}
.it-stat-val{font-size:17px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;line-height:1.2;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.it-stat-val.it-price{color:var(--success);}
.it-stat-sub{font-size:10.5px;color:var(--text3);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* ── セクション見出し ─────────────────────────────────────────── */
.it-sec{margin-bottom:18px;}
.it-sec-title{font-size:12.5px;font-weight:600;color:var(--text3);letter-spacing:.03em;padding-bottom:6px;margin-bottom:8px;border-bottom:1px solid var(--sn-line-2,rgba(255,255,255,.08));}

/* ── モールリンク（実売確認導線＝アフィリエイト着地面） ───────────── */
.it-ec{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px;}
.it-ec-btn{display:inline-flex;align-items:center;justify-content:center;flex:1 1 0;min-width:120px;
  height:var(--ctl-h,32px);padding:0 14px;background:var(--surface);
  border:1px solid var(--sn-line-2,rgba(255,255,255,.08));border-radius:7px;color:var(--text2);
  font-size:12.5px;text-decoration:none;cursor:pointer;}
.it-ec-btn:hover{background:var(--surface2);color:var(--text);border-color:var(--sn-line-1,rgba(255,255,255,.14));}

/* ── 下段4カラム（買取新品｜買取中古｜Az新品｜Az中古・v0.258 IZUNA決定） ── */
.it-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;align-items:start;}
.it-col{min-width:0;}

/* 店舗別価格リスト（面コンテナ＋ヘアライン行） */
.it-list,.it-az{background:var(--surface);border:1px solid var(--sn-line-3,rgba(255,255,255,.06));border-radius:7px;overflow:hidden;}
.it-none{padding:16px 12px;font-size:11px;color:var(--text3);text-align:center;}
.it-row{display:flex;align-items:center;gap:12px;padding:6px 12px;border-bottom:1px solid var(--sn-line-row,rgba(255,255,255,.055));}
.it-row:last-child{border-bottom:none;}
.it-rank{flex-shrink:0;width:20px;text-align:center;font-size:11px;color:var(--text3);font-variant-numeric:tabular-nums;}
.it-rank.top{color:var(--sn-badge-gold-tx,#cdb37c);font-weight:600;}
.it-row-main{flex:1;min-width:0;}
.it-store{font-size:12.5px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.it-upd{font-size:10px;color:var(--text3);margin-top:1px;}
.it-row-right{flex-shrink:0;text-align:right;}
.it-row-price{font-size:13px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;}
.it-row-price.top{color:var(--success);}
/* v0.262 B-61(a'): stale行（48h超〜14日）＝順位なし・減灰・「最終確認◯日前」表示 */
.it-row.stale{opacity:.55;}
.it-row.stale .it-row-price{font-weight:400;}
.it-detail{font-size:10px;color:var(--action,#25a0d5);text-decoration:none;}
.it-detail:hover{text-decoration:underline;}
.it-more{font-size:10.5px;color:var(--text3);padding:6px 12px;border-bottom:1px solid var(--sn-line-row,rgba(255,255,255,.055));}
.it-note-foot{font-size:10.5px;color:var(--text3);margin-top:10px;line-height:1.6;}

/* Amazon出品者リスト（B-58実装までのプレースホルダ: 薄グレーのマスク＋予告ノート） */
.it-az{position:relative;}
.it-az-body{opacity:.5;}  /* v0.262c: 減灰濃度はIZUNA実機調整で確定（.3→.45→.5） */
.it-az-mask{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(120,120,120,.07);}
.it-az-note{background:var(--menu);border:1px solid var(--border2);border-radius:7px;padding:10px 14px;
  font-size:11px;color:var(--text2);text-align:center;line-height:1.8;}

/* ── CTA・404 ────────────────────────────────────────────────── */
.it-cta-card{background:var(--surface);border:1px solid var(--sn-line-3,rgba(255,255,255,.06));border-radius:7px;padding:12px 16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:18px;}
.it-cta-txt{flex:1;min-width:220px;font-size:12px;color:var(--text2);line-height:1.7;}
.it-cta{display:inline-flex;align-items:center;height:var(--ctl-h,32px);padding:0 18px;background:var(--action,#25a0d5);border:none;border-radius:7px;color:#fff;font-size:12.5px;font-weight:600;text-decoration:none;cursor:pointer;}
.it-cta:hover{opacity:.9;}
.it-empty{background:var(--surface);border:1px solid var(--sn-line-3,rgba(255,255,255,.06));border-radius:7px;padding:28px 18px;text-align:center;font-size:13px;color:var(--text2);line-height:2.2;}

/* ── embed（ホーム検索モーダル内のiframe表示・v0.258 B-59） ─────────
      chrome分の余白を外し、モーダル面（--surface）が透けるよう背景を持たない */
body.embed{background:var(--surface) !important;}  /* モーダル面と同色（透過はcolor-scheme不一致で白化するため不可） */
body.embed .main{padding-top:0;min-height:0;}
body.embed .content{padding:12px 14px 18px;max-width:none;}
body.embed .page-head{margin-bottom:12px;padding-right:34px;}  /* モーダル右上の✕と商品名が重ならないように */
.it-openfull,.it-more a{color:var(--action,#25a0d5);text-decoration:none;}
.it-openfull:hover,.it-more a:hover{text-decoration:underline;}
body.embed .it-media{--media-h:170px;}
/* embed時のスクロールバー: 未指定だとOS標準の白い太バーが出て「背景が白い」見えになる */
body.embed{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.16) transparent;}
body.embed.light{scrollbar-color:rgba(0,0,0,.2) transparent;}
body.embed::-webkit-scrollbar{width:6px;}
body.embed::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:3px;}
body.embed.light::-webkit-scrollbar-thumb{background:rgba(0,0,0,.18);}
body.embed::-webkit-scrollbar-track{background:transparent;}

@media(max-width:820px){
  .it-cols{grid-template-columns:1fr 1fr;}  /* 2×2: 買取店の段→Amazonの段 */
  .it-summary{flex-direction:column;}
  .it-sg{height:auto;}
  .it-seg{padding:10px 14px;}
  .it-seg + .it-seg{border-left:none;border-top:1px solid var(--sn-line-2,rgba(255,255,255,.08));}
}
@media(max-width:560px){
  .it-cols{grid-template-columns:1fr;}
  .it-media{flex-direction:column;--media-h:170px;}
  .it-photo{flex:0 0 auto;width:100%;height:170px;}
  .it-ec{flex-direction:column;}
}
