/* Tomiko – Opiniones de Google. Usa la tipografía del tema. */
.tgr {
	--tgr-accent: #222;
	--tgr-star: #fbbc04;
	--tgr-star-off: #dadce0;
	--tgr-muted: #6b6b6b;
	--tgr-border: #e6e6e6;
	--tgr-card: #fff;
	margin: 2.5em 0;
	color: inherit;
}
.tgr *, .tgr *::before { box-sizing: border-box; }

.tgr-head { text-align: center; margin-bottom: 1.5em; }
.tgr-title { margin: 0 0 .4em; }
.tgr-summary { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .5em; }
.tgr-score { font-size: 1.6em; font-weight: 700; line-height: 1; }
.tgr-summary .tgr-stars { font-size: 1.25em; }
.tgr-count { color: var(--tgr-muted); text-decoration: underline; text-underline-offset: 2px; }

/* Estrellas parciales sin imágenes: --tgr-r = 0..5 */
.tgr-stars {
	--p: calc(var(--tgr-r, 0) / 5 * 100%);
	display: inline-block;
	line-height: 1;
	letter-spacing: 1px;
	background: linear-gradient(90deg, var(--tgr-star) var(--p), var(--tgr-star-off) var(--p));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.tgr-stars::before { content: "★★★★★"; }

.tgr-list { display: grid; gap: 16px; }
.tgr-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.tgr-carousel {
	grid-auto-flow: column;
	grid-auto-columns: minmax(260px, calc((100% - 32px) / 3));
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	padding-bottom: 8px;
	scrollbar-width: thin;
}
.tgr-carousel > .tgr-card { scroll-snap-align: start; }
@media (max-width: 720px) {
	.tgr-carousel { grid-auto-columns: 85%; }
}

.tgr-card {
	display: flex;
	flex-direction: column;
	gap: .6em;
	padding: 20px;
	background: var(--tgr-card);
	border: 1px solid var(--tgr-border);
	border-radius: 12px;
	text-align: left;
}
.tgr-author { display: flex; align-items: center; gap: 10px; }
.tgr-avatar { width: 40px; height: 40px; border-radius: 50%; flex: none; object-fit: cover; }
.tgr-initial {
	display: grid; place-items: center;
	background: var(--tgr-accent); color: #fff; font-weight: 700;
}
.tgr-name { display: block; font-weight: 600; color: inherit; text-decoration: none; }
a.tgr-name:hover { text-decoration: underline; }
.tgr-when { display: block; font-size: .85em; color: var(--tgr-muted); }
.tgr-text { margin: 0; line-height: 1.5; }
.tgr-more { font-size: .9em; color: var(--tgr-accent); margin-top: auto; }

.tgr-foot {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
	gap: 12px 20px; margin-top: 1.5em;
}
.tgr-btn {
	display: inline-block; padding: .7em 1.4em; border-radius: 999px;
	background: var(--tgr-accent); color: #fff !important; text-decoration: none !important; font-weight: 600;
}
.tgr-btn:hover { opacity: .88; }
.tgr-all { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.tgr-attr { font-size: .8em; color: var(--tgr-muted); }

.tgr-admin-notice { padding: 10px 14px; border-left: 4px solid #d63638; background: #fcf0f1; }