/* きぼうギア比較 v0.6 スタイル — 今風・かっこいい・買いたくなる。全て .gpc- スコープでテーマ非干渉。 */

.gpc-app, .gpc-deals {
	--gpc-accent: #10b981;
	--gpc-accent2: #0ea5a4;
	--gpc-grad: linear-gradient(135deg, #10b981, #0ea5a4);
	--gpc-ink: #0f172a;
	--gpc-sub: #64748b;
	--gpc-line: #e8edf3;
	--gpc-soft: #f1f5f9;
	--gpc-shadow: 0 4px 16px rgba(15, 23, 42, .06);
	--gpc-shadow-hi: 0 14px 32px rgba(15, 23, 42, .14);
	-webkit-font-smoothing: antialiased;
}

.gpc-app {
	font-family: -apple-system, "Hiragino Sans", "Noto Sans JP", system-ui, sans-serif;
	color: var(--gpc-ink);
	max-width: 780px;
	margin: 1.6em auto;
	line-height: 1.5;
}

.gpc-title {
	font-size: 1.4rem;
	font-weight: 800;
	letter-spacing: .01em;
	margin: 0 0 .7em;
}

/* ===== 検索バー ===== */
.gpc-controls {
	display: flex;
	gap: .55rem;
	margin-bottom: 1rem;
	background: #fff;
	padding: .4rem;
	border-radius: 16px;
	box-shadow: var(--gpc-shadow);
	border: 1px solid var(--gpc-line);
}
.gpc-input {
	flex: 1;
	min-width: 0;
	padding: .75em 1em;
	border: none;
	border-radius: 12px;
	font-size: 1.02rem;
	background: transparent;
	color: var(--gpc-ink);
}
.gpc-input:focus { outline: none; }
.gpc-search-btn {
	padding: .75em 1.5em;
	border: none;
	border-radius: 12px;
	background: var(--gpc-grad);
	color: #fff;
	font-weight: 800;
	font-size: 1rem;
	cursor: pointer;
	white-space: nowrap;
	box-shadow: 0 6px 16px rgba(16, 185, 129, .35);
	transition: transform .15s, box-shadow .15s, filter .15s;
}
.gpc-search-btn:hover { transform: translateY(-1px); filter: brightness(1.05); box-shadow: 0 10px 22px rgba(16, 185, 129, .45); }
.gpc-search-btn:active { transform: translateY(0); }

.gpc-status {
	min-height: 1.4em;
	font-size: .88rem;
	color: var(--gpc-sub);
	font-weight: 600;
	margin-bottom: .7rem;
	padding-left: .2rem;
}

/* ===== カード ===== */
.gpc-list { display: flex; flex-direction: column; gap: .7rem; }

.gpc-card {
	position: relative;
	display: flex;
	align-items: stretch;
	gap: .9rem;
	padding: .85rem .95rem;
	border: 1px solid var(--gpc-line);
	border-radius: 18px;
	background: #fff;
	text-decoration: none;
	color: inherit;
	box-shadow: var(--gpc-shadow);
	transition: box-shadow .18s, transform .18s, border-color .18s;
}
.gpc-card:hover {
	box-shadow: var(--gpc-shadow-hi);
	transform: translateY(-3px);
	border-color: #d6e4dd;
}
.gpc-card--best {
	border: 2px solid var(--gpc-accent);
	background: linear-gradient(180deg, #f0fdf8, #ffffff 60%);
	box-shadow: 0 8px 26px rgba(16, 185, 129, .20);
}

/* 順位メダル */
.gpc-rank {
	position: absolute;
	top: -9px;
	left: -9px;
	width: 30px;
	height: 30px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	font-weight: 800;
	font-size: .85rem;
	color: #fff;
	background: #94a3b8;
	box-shadow: 0 3px 8px rgba(15, 23, 42, .25);
	border: 2px solid #fff;
	z-index: 2;
}
.gpc-rank--1 { background: linear-gradient(135deg, #f59e0b, #fcd34d); color: #7c2d12; }
.gpc-rank--2 { background: linear-gradient(135deg, #94a3b8, #cbd5e1); color: #1e293b; }
.gpc-rank--3 { background: linear-gradient(135deg, #b45309, #d97706); color: #fff; }

.gpc-thumb {
	width: 78px;
	height: 78px;
	object-fit: contain;
	border-radius: 12px;
	background: var(--gpc-soft);
	border: 1px solid var(--gpc-line);
	flex: 0 0 auto;
}
.gpc-thumb--none { display: block; }
.gpc-thumb--amazon {
	display: flex; align-items: center; justify-content: center;
	font-weight: 900; font-size: 1.7rem; color: #fff;
	background: linear-gradient(135deg, #ff9900, #ff7a00); border: none;
}

.gpc-card-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.gpc-card-top { display: flex; align-items: center; gap: .35rem; margin-bottom: .3rem; flex-wrap: wrap; }

.gpc-chip {
	font-size: .7rem;
	font-weight: 800;
	color: #fff;
	padding: .2em .6em;
	border-radius: 6px;
	line-height: 1.5;
	letter-spacing: .02em;
}
.gpc-chip--rakuten { background: #bf0000; }
.gpc-chip--yahoo   { background: #ff0033; }
.gpc-chip--amazon  { background: #232f3e; }

.gpc-badge {
	font-size: .7rem;
	font-weight: 800;
	padding: .2em .6em;
	border-radius: 6px;
}
.gpc-badge--best {
	background: linear-gradient(135deg, #fbbf24, #f59e0b);
	color: #7c2d12;
	box-shadow: 0 2px 6px rgba(245, 158, 11, .4);
}
.gpc-badge--top { background: #ecfdf5; color: #047857; border: 1px solid #a7f3d0; }

.gpc-name {
	font-size: .95rem;
	font-weight: 700;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.gpc-shop { font-size: .78rem; color: var(--gpc-sub); margin-top: .2rem; }
.gpc-review { font-size: .82rem; margin-top: auto; padding-top: .25rem; }
.gpc-stars { color: #f59e0b; letter-spacing: 1px; }
.gpc-norev { color: #b6c0cc; }
.gpc-revcount { color: var(--gpc-sub); }

.gpc-card-price {
	flex: 0 0 auto;
	text-align: right;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 128px;
}
.gpc-eff {
	font-size: 1.5rem;
	font-weight: 900;
	color: var(--gpc-ink);
	line-height: 1.05;
	letter-spacing: -.01em;
}
.gpc-card--best .gpc-eff { color: var(--gpc-accent); }
.gpc-eff--link { font-size: 1rem; color: #232f3e; font-weight: 800; }
.gpc-eff-label {
	display: inline-block;
	font-size: .62rem; font-weight: 800; color: var(--gpc-sub);
	background: var(--gpc-soft); border-radius: 4px; padding: .05em .4em;
	margin-top: .15rem; align-self: flex-end;
}
.gpc-plusship { font-size: .68rem; color: #dc2626; font-weight: 700; }
.gpc-raw { font-size: .72rem; color: var(--gpc-sub); margin-top: .35rem; }
.gpc-point { color: var(--gpc-accent); font-weight: 800; }

/* ===== ページャー（3件表示＋次へ） ===== */
.gpc-pager {
	display: flex; align-items: center; justify-content: center;
	gap: 1rem; margin-top: 1rem;
}
.gpc-pager-btn {
	padding: .6em 1.3em;
	border: none;
	border-radius: 999px;
	background: var(--gpc-grad);
	color: #fff;
	font-weight: 800; font-size: .92rem; cursor: pointer;
	box-shadow: 0 5px 14px rgba(16, 185, 129, .3);
	transition: transform .15s, filter .15s, box-shadow .15s;
}
.gpc-pager-btn:hover:not(:disabled) { transform: translateY(-1px); filter: brightness(1.05); }
.gpc-pager-btn:disabled {
	background: var(--gpc-soft); color: #b6c0cc; box-shadow: none; cursor: default;
}
.gpc-pager-info { font-size: .9rem; color: var(--gpc-ink); font-weight: 800; min-width: 7em; text-align: center; }

/* ===== Amazon 検索窓 ===== */
.gpc-amazon-box, .gpc-used-box {
	margin-top: .8rem;
	padding: 1rem 1.05rem;
	border: 1px solid var(--gpc-line);
	border-radius: 16px;
	background: #fff;
	box-shadow: var(--gpc-shadow);
}
.gpc-amazon-head, .gpc-used-head {
	font-size: .85rem; font-weight: 800; color: var(--gpc-ink);
	margin-bottom: .6rem; display: flex; align-items: center; gap: .4rem;
}
.gpc-amazon-form, .gpc-used-search { display: flex; gap: .55rem; flex-wrap: wrap; align-items: stretch; }
.gpc-amazon-input, .gpc-used-input {
	flex: 1 1 100%;
	padding: .7em .9em;
	border: 1.5px solid var(--gpc-line);
	border-radius: 11px;
	font-size: .98rem;
	background: var(--gpc-soft);
}
.gpc-amazon-input:focus, .gpc-used-input:focus { outline: none; border-color: var(--gpc-accent); background: #fff; }
.gpc-amazon-btn {
	flex: 0 0 auto;
	padding: .7em 1.4em;
	border: none; border-radius: 11px;
	background: linear-gradient(135deg, #ff9900, #ff7a00); color: #232f3e;
	font-weight: 800; font-size: .92rem; cursor: pointer; white-space: nowrap;
	box-shadow: 0 5px 14px rgba(255, 153, 0, .35);
	transition: transform .15s, filter .15s;
}
.gpc-amazon-btn:hover { transform: translateY(-1px); filter: brightness(1.04); }
.gpc-amazon-note { font-size: .73rem; color: var(--gpc-sub); margin: .55rem 0 0; line-height: 1.55; }

/* ===== 中古検索（メルカリ・ヤフオク） ===== */
.gpc-used-btn {
	flex: 1 1 0; min-width: 9.5em;
	text-align: center;
	padding: .7em .9em;
	border: none; border-radius: 11px;
	font-weight: 800; font-size: .9rem;
	color: #fff; cursor: pointer; text-decoration: none;
	transition: transform .15s, filter .15s;
}
.gpc-used-btn:hover { transform: translateY(-1px); filter: brightness(1.06); }
.gpc-used-btn--mercari { background: linear-gradient(135deg, #ff2d2d, #ff0211); box-shadow: 0 5px 14px rgba(255, 2, 17, .3); }
.gpc-used-btn--yahuoku { background: linear-gradient(135deg, #ff3366, #ff0033); box-shadow: 0 5px 14px rgba(255, 0, 51, .3); }

/* ===== お得カレンダー ===== */
.gpc-deals {
	max-width: 780px;
	margin: 1.4em auto;
	border-radius: 20px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 8px 28px rgba(15, 23, 42, .1);
	border: 1px solid var(--gpc-line);
	font-family: -apple-system, "Hiragino Sans", "Noto Sans JP", system-ui, sans-serif;
	color: var(--gpc-ink);
}
.gpc-deals-head {
	background: linear-gradient(135deg, #10b981, #0ea5a4 70%, #0d9488);
	color: #fff; font-weight: 800; font-size: 1.05rem;
	padding: .85em 1.1em;
	letter-spacing: .01em;
}
.gpc-deals-today {
	background: linear-gradient(135deg, #fff7ed, #ffedd5);
	color: #9a3412; font-weight: 800; font-size: .92rem;
	padding: .7em 1.1em; border-bottom: 1px solid #fde8d0;
}
.gpc-deals-list { list-style: none; margin: 0; padding: .5em 1.1em; }
.gpc-deals-list li {
	display: flex; align-items: center; gap: .9em;
	padding: .6em 0; font-size: .95rem; font-weight: 600;
	border-bottom: 1px solid var(--gpc-line);
}
.gpc-deals-list li:last-child { border-bottom: none; }
.gpc-deals-when {
	flex: 0 0 auto; min-width: 9.5em;
	display: inline-flex; align-items: baseline; gap: .3em;
	font-weight: 800; color: var(--gpc-ink);
	background: var(--gpc-soft); border-radius: 10px;
	padding: .35em .7em;
}
.gpc-deals-when b { color: var(--gpc-accent); font-weight: 900; font-size: 1.02em; }
.gpc-deals-big .gpc-deals-when {
	background: linear-gradient(135deg, #fff1f2, #ffe4e6);
}
.gpc-deals-big .gpc-deals-when b { color: #e11d48; }
.gpc-deals-big { font-weight: 800; }
.gpc-deals-guide {
	font-size: .76rem; color: var(--gpc-sub);
	padding: .8em 1.1em; background: var(--gpc-soft); line-height: 1.65;
}

/* ===== 共通 ===== */
.gpc-amazon-wrap { margin-top: .55rem; }
.gpc-disclaimer, .gpc-errnote, .gpc-empty {
	font-size: .76rem; color: var(--gpc-sub);
	margin-top: 1rem; line-height: 1.6;
}
.gpc-errnote { color: #b45309; }
.gpc-empty { text-align: center; padding: 1.5em; font-weight: 600; }
.gpc-prompt {
	text-align: center;
	color: var(--gpc-sub);
	font-size: .9rem;
	padding: 1.3em 1em;
	background: var(--gpc-soft);
	border-radius: 14px;
	margin-top: .8rem;
	line-height: 1.6;
}

/* ===== レスポンシブ ===== */
@media (max-width: 560px) {
	.gpc-title { font-size: 1.2rem; }
	.gpc-controls { flex-wrap: wrap; }
	.gpc-search-btn { flex: 1 1 100%; }
	.gpc-thumb { width: 64px; height: 64px; }
	.gpc-card { gap: .7rem; padding: .8rem; flex-wrap: wrap; }
	.gpc-card-main { flex: 1 1 0; }
	.gpc-card-price {
		flex: 1 1 100%;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: baseline;
		text-align: left;
		min-width: 0;
		margin-top: .6rem;
		padding-top: .6rem;
		border-top: 1px dashed var(--gpc-line);
		gap: .15rem .5rem;
	}
	.gpc-eff { font-size: 1.45rem; order: 1; }
	.gpc-eff-label { order: 2; align-self: center; }
	.gpc-raw { order: 3; margin-top: 0; margin-left: auto; text-align: right; }
	.gpc-name { font-size: .92rem; }
	.gpc-amazon-btn { flex: 1 1 100%; }
	.gpc-used-btn { flex: 1 1 100%; }
	.gpc-deals-list li { flex-wrap: wrap; gap: .3em .9em; }
	.gpc-deals-when { min-width: 8em; }
}
