.xgr-widget {
    --xgr-columns: 3;
    --xgr-gap: 22px;
    color: #172033;
    font: 400 15px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    max-width: 100%;
}

.xgr-widget *, .xgr-widget *::before, .xgr-widget *::after { box-sizing: border-box; }
.xgr-widget [hidden] { display: none !important; }

.xgr-widget-editor-notice {
    align-items: flex-start;
    background: #f5f9ff;
    border: 1px solid #cfe1ff;
    border-left: 4px solid #1769e0;
    border-radius: 10px;
    color: #344054;
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 14px 16px;
}

.xgr-widget-editor-notice strong { color: #0b55bd; }

.xgr-widget-summary {
    align-items: center;
    background: linear-gradient(135deg, #fff 0%, #f7faff 100%);
    border: 1px solid #e2e9f3;
    border-radius: 16px;
    box-shadow: 0 8px 30px rgba(34, 70, 120, .08);
    color: #1155c4;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 26px;
    padding: 20px;
}

.xgr-widget-summary-icon {
    align-items: center;
    background: #fff;
    border-radius: 13px;
    box-shadow: 0 5px 16px rgba(23, 105, 224, .16);
    color: #1769e0;
    display: flex;
    flex: 0 0 auto;
    height: 58px;
    justify-content: center;
    width: 58px;
}

.xgr-widget-summary-icon svg { height: 42px; width: 42px; }
.xgr-widget-summary strong { display: block; font-size: 17px; line-height: 1.35; }
.xgr-widget-summary small { color: #667085; display: block; margin-top: 2px; }
.xgr-widget-rating-number { color: #f47a1f; font-size: 17px; font-weight: 750; }

.xgr-widget-stars {
    color: #ff7a1a;
    font-size: 20px;
    letter-spacing: 1px;
    line-height: 1;
    white-space: nowrap;
}

.xgr-widget-buttons { display: flex; flex-wrap: wrap; gap: 10px; margin-left: auto; }

.xgr-widget-button {
    align-items: center;
    background: #0867e8;
    border: 1px solid #0867e8;
    border-radius: 9px;
    box-shadow: 0 4px 10px rgba(8, 103, 232, .22);
    color: #fff !important;
    display: inline-flex;
    font-weight: 650;
    gap: 7px;
    justify-content: center;
    min-height: 40px;
    padding: 8px 15px;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}

.xgr-widget-button:hover { box-shadow: 0 7px 16px rgba(8, 103, 232, .28); opacity: .96; transform: translateY(-1px); }
.xgr-google-icon { display: inline-block; height: 18px; width: 18px; }
.xgr-widget-button .xgr-google-icon { background: #fff; border-radius: 50%; padding: 2px; }
.xgr-widget-slider { position: relative; }
.xgr-widget-viewport { overflow: hidden; padding: 3px; width: 100%; }

.xgr-widget-track {
    display: flex;
    gap: var(--xgr-gap);
    transition: transform .45s cubic-bezier(.22, .61, .36, 1);
    will-change: transform;
}

.xgr-widget-review {
    background: linear-gradient(145deg, #fff 0%, #f8fafc 100%);
    border: 1px solid #e5eaf1;
    border-radius: 16px;
    box-shadow: 0 7px 22px rgba(32, 55, 86, .08);
    flex: 0 0 calc((100% - (var(--xgr-columns) - 1) * var(--xgr-gap)) / var(--xgr-columns));
    min-height: 240px;
    min-width: 0;
    overflow: hidden;
    padding: 20px;
    position: relative;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.xgr-widget-review::before {
    background: linear-gradient(90deg, #4285f4, #34a853, #fbbc05, #ea4335);
    content: "";
    height: 3px;
    left: 0;
    opacity: .9;
    position: absolute;
    right: 0;
    top: 0;
}

.xgr-widget-review:hover { border-color: #d4dfef; box-shadow: 0 12px 30px rgba(32, 55, 86, .12); transform: translateY(-2px); }
.xgr-widget[data-layout="grid"] .xgr-widget-viewport { overflow: visible; }
.xgr-widget[data-layout="grid"] .xgr-widget-track { display: grid; grid-template-columns: repeat(var(--xgr-columns), minmax(0, 1fr)); transform: none !important; }
.xgr-widget-review-header { align-items: flex-start; display: flex; gap: 12px; }

.xgr-widget-avatar {
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 2px 7px rgba(16, 24, 40, .15);
    flex: 0 0 auto;
    height: 50px;
    object-fit: cover;
    width: 50px;
}

.xgr-widget-avatar-placeholder { align-items: center; background: linear-gradient(145deg, #075a48, #02866d); color: #fff; display: flex; font-size: 21px; font-weight: 650; justify-content: center; }
.xgr-widget-author { flex: 1; min-width: 0; }
.xgr-widget-author-name, .xgr-widget-date { display: block; }
.xgr-widget-author-name { color: #1056c7; font-size: 16px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.xgr-widget-date { color: #667085; font-size: 13px; margin: 1px 0 7px; }
.xgr-widget-google { display: flex; flex: 0 0 auto; margin-left: auto; }
.xgr-widget-google .xgr-google-icon { height: 17px; width: 17px; }
.xgr-widget-text { color: #344054; font-size: 15px; line-height: 1.65; margin-top: 17px; overflow-wrap: anywhere; }
.xgr-widget button.xgr-widget-read-more {
    appearance: none !important;
    -webkit-appearance: none !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: #0867e8;
    cursor: pointer;
    display: inline !important;
    font: inherit;
    font-weight: 650;
    height: auto !important;
    line-height: inherit;
    margin: 0 0 0 4px !important;
    min-height: 0 !important;
    min-width: 0 !important;
    outline-offset: 3px;
    padding: 0 !important;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-transform: none;
    width: auto !important;
}
.xgr-widget button.xgr-widget-read-more:hover,
.xgr-widget button.xgr-widget-read-more:focus { background: transparent !important; border: 0 !important; box-shadow: none !important; color: #064fae; transform: none !important; }

.xgr-widget-arrow {
    appearance: none !important;
    -webkit-appearance: none !important;
    align-items: center;
    aspect-ratio: 1 / 1;
    background: rgba(255, 255, 255, .96) !important;
    border: 0 !important;
    border-radius: 50% !important;
    box-shadow: 0 5px 18px rgba(24, 45, 76, .18) !important;
    color: #506078;
    cursor: pointer;
    display: flex;
    height: 42px;
    justify-content: center;
    line-height: 0 !important;
    margin: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    min-width: 0 !important;
    outline-offset: 3px;
    padding: 0 !important;
    position: absolute;
    text-decoration: none !important;
    top: 50%;
    transform: translateY(-50%);
    transition: color .2s ease, box-shadow .2s ease, transform .2s ease;
    width: 42px;
    z-index: 2;
}

.xgr-widget-arrow svg { display: block; fill: none; height: 19px; pointer-events: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; width: 19px; }
.xgr-widget button.xgr-widget-arrow:hover,
.xgr-widget button.xgr-widget-arrow:focus { background: #fff !important; border: 0 !important; box-shadow: 0 8px 24px rgba(24, 45, 76, .24) !important; color: #0867e8; transform: translateY(-50%) scale(1.06); }
.xgr-widget-prev { left: -21px; }
.xgr-widget-next { right: -21px; }
.xgr-widget-dots { display: flex; gap: 8px; justify-content: center; margin-top: 18px; }
.xgr-widget-dots button { background: #d4dae3; border: 0; border-radius: 50%; cursor: pointer; height: 8px; padding: 0; transition: background .2s ease, transform .2s ease; width: 8px; }
.xgr-widget-dots button.is-active { background: #ff8126; transform: scale(1.2); }
.xgr-widget-empty { background: #f8fafc; border: 1px dashed #cfd8e6; border-radius: 12px; color: #667085; padding: 20px; text-align: center; }

@media (max-width: 767px) {
    .xgr-widget-summary { align-items: flex-start; padding: 17px; }
    .xgr-widget-buttons { margin-left: 0; width: 100%; }
    .xgr-widget-button { flex: 1 1 auto; }
    .xgr-widget-review { min-height: 220px; }
    .xgr-widget-prev { left: -10px; }
    .xgr-widget-next { right: -10px; }
}

@media (prefers-reduced-motion: reduce) {
    .xgr-widget-track, .xgr-widget-review, .xgr-widget-button, .xgr-widget-arrow { transition: none; }
}