@charset "utf-8";
/* ============================================================
   ログイン前のロボ詳細 (2026-10-30。 templates5/guest/robot.tpl)
   カード・AI判定値の輪・グラフ・数字の並びはトップの代表ロボのカード (quorea-lp.css) を使い、 ここは並べ方だけ
   ============================================================ */

/* ── 見出し ── */
.rb-head {
	position: relative; overflow: hidden;
	padding: 64px 0 48px;
	border-bottom: 1px solid var(--border);
}
.rb-head::before {
	content: ""; position: absolute; right: -6%; top: -60%;
	width: 820px; height: 820px; border-radius: 50%;
	background: radial-gradient(closest-side, rgba(232,138,74,0.24), rgba(224,86,42,0.08) 55%, transparent 72%);
	pointer-events: none;
}
.rb-head-grid { z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 40px; }
.rb-head .eyebrow { margin-bottom: 12px; }
.rb-title { font-size: 36px; line-height: 1.35; letter-spacing: -0.6px; overflow-wrap: anywhere; }
.rb-meta { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 16px 0 0; padding: 0; list-style: none; font-size: 14px; color: var(--text); }
.rb-meta .rb-sym { font-weight: 500; color: var(--heading); }
.rb-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.rb-score .ring { width: 132px; height: 132px; }
.rb-score .ring span { font-size: 40px; }
.rb-score .ring span small { font-size: 11px; margin-top: 6px; }

/* ── 時価 ── */
.rb-sec { padding: 48px 0 0; }
.rb-sec-tight { padding-top: 40px; }
.rb-perf { padding: 0; overflow: hidden; }
.rb-perf-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 26px 28px 6px; }
.rb-asof { font-size: 12.5px; color: var(--body); }
.rb-h-note { margin-left: 10px; font-size: 13px; font-weight: 400; letter-spacing: 0; color: var(--body); white-space: nowrap; }
.rb-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 18px; margin-top: 8px; font-size: 12.5px; color: var(--body); }
.rb-legend span { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.rb-legend i { display: inline-block; width: 18px; height: 0; border-top: 2.6px solid #e0562a; }
.rb-legend i.k0 { border-top: 1.2px solid rgba(224,86,42,0.6); }
.rb-legend i.k2 { border-top: 1.4px dashed #9a8676; }
.rb-perf .chart { padding: 0 20px; }
.rb-stats { grid-template-columns: repeat(3, 1fr); }
.rb-stats div:nth-child(even) { border-left: 0; }
.rb-stats div:nth-child(n+2) { border-left: 1px solid var(--border); }
.rb-stats div:nth-child(3n+1) { border-left: 0; }
.rb-stats div:nth-child(n+3) { border-top: 0; }
.rb-stats div:nth-child(n+4) { border-top: 1px solid var(--border); }
.rb-stats b.rb-brokers { font-size: 15px; font-weight: 400; line-height: 1.6; letter-spacing: 0; }
.rb-notes { margin-top: 18px; }

/* ── 説明・取引 ── */
.rb-block { padding-top: 8px; }
.rb-h2 { font-size: 22px; font-weight: 400; line-height: 1.5; letter-spacing: -0.2px; }
.rb-sub { margin-top: 6px; font-size: 13px; color: var(--body); }
.rb-desc { margin-top: 14px; font-size: 15px; line-height: 2; color: var(--text); overflow-wrap: anywhere; }
.rb-table-wrap { margin-top: 16px; overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; background: var(--white); box-shadow: var(--shadow-soft); }
.rb-table { width: 100%; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.rb-table th { padding: 12px 16px; text-align: left; font-size: 12px; font-weight: 500; color: var(--label); background: var(--tint); border-bottom: 1px solid var(--border); white-space: nowrap; }
.rb-table td { padding: 12px 16px; border-bottom: 1px solid var(--border); color: var(--heading); vertical-align: top; white-space: nowrap; }
.rb-table tr:last-child td { border-bottom: 0; }
.rb-table .num { text-align: right; }
.rb-when { display: block; }
.rb-price { display: block; font-size: 12.5px; color: var(--body); }
.rb-pl.up { color: var(--ember-deep); }
.rb-pl.down { color: var(--label); }
.rb-empty { margin-top: 14px; color: var(--body); }

/* ── 終わりの申し込み ── */
.rb-cta { padding: 64px 0 104px; }
.rb-cta-box {
	display: flex; justify-content: space-between; align-items: center; gap: 32px;
	padding-top: 40px; padding-bottom: 40px;
	border-top: 1px solid var(--border);
}
.rb-cta-title { font-size: 24px; font-weight: 400; line-height: 1.5; }
.rb-cta-lead { margin-top: 8px; font-size: 14px; color: var(--text); }
.rb-cta .rb-ctas { margin-top: 0; flex: none; }

@media (max-width: 860px) {
	.rb-head { padding: 40px 0 32px; }
	.rb-head::before { width: 520px; height: 520px; right: -45%; top: -40%; }
	.rb-head-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.rb-score { order: -1; }
	.rb-score .ring { width: 96px; height: 96px; }
	.rb-score .ring span { font-size: 30px; }
	.rb-title { font-size: 26px; letter-spacing: -0.3px; }
	.rb-ctas .btn { flex: 1 1 100%; }
	.rb-perf-head { flex-direction: column; gap: 2px; padding: 20px 20px 4px; }
	.rb-perf .chart { padding: 0 8px; }
	.rb-stats { grid-template-columns: repeat(2, 1fr); }
	.rb-stats div:nth-child(n) { border-left: 0; border-top: 1px solid var(--border); }
	.rb-stats div:nth-child(-n+2) { border-top: 0; }
	.rb-stats div:nth-child(even) { border-left: 1px solid var(--border); }
	.rb-stats div { padding: 12px 16px 14px; }
	.rb-cta { padding: 48px 0 72px; }
	.rb-cta-box { flex-direction: column; align-items: stretch; }
}