/* Shared mascot behaviour: motion never controls layout or blocks a field. */
img.gr-mascot { object-fit: contain; object-position: center bottom; animation: none !important; transform-origin: 50% 90%; }
.gr-guide-button { display: grid; place-items: center; flex: 0 0 auto; width: 72px; height: 78px; padding: 3px !important; background: transparent; border: 0; border-radius: 14px; cursor: pointer; }
.gr-guide-button:focus-visible { outline: 2px solid #226397; outline-offset: 1px; }
.gqe-mascot-guide { flex: 0 0 76px; justify-content: flex-end; }
.gqe-mascot-guide .gr-guide-button img { width: 64px; height: 70px; max-width: 100%; }
.gqe-remake-title:has(.gr-guide-tip:not([hidden])) { flex-wrap: wrap; }
.gqe-mascot-guide:has(.gr-guide-tip:not([hidden])) { flex-basis: 100%; order: 2; justify-content: flex-start; align-items: center; }
.gqe-mascot-guide .gr-guide-tip:not([hidden]) { display: block; margin: 0; padding: 10px 12px; border-radius: 12px; background: #fff2e9; color: #333e45; font-size: 13px; line-height: 1.4; }
.gr-mascot-feedback { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.gr-page-guide { display: flex; align-items: center; gap: 20px; max-width: 900px; margin: 32px auto; padding: 22px; background: #f7f7f4; border: 1px solid #e4e6e2; border-radius: 18px; }
.gr-page-guide img { flex: 0 0 84px; width: 84px; height: 96px; }
.gr-page-guide strong { font-size: 18px; color: #192027; }
.gr-page-guide p { margin: 6px 0 10px; line-height: 1.5; }
.gr-page-guide a { color: #ae3b15; font-weight: 700; }
/* Existing service art used negative offsets and was cut off at the feet. */
.mascot-service-card > img.gr-mascot { position: static; align-self: end; justify-self: center; width: min(180px,100%); height: 210px; margin: 0; }
@media(max-width:820px) {
 .mascot-service-card { padding-bottom: 18px; }
 .mascot-service-points { padding-right: 0; }
 .gr-page-guide { margin: 24px 16px; gap: 14px; padding: 16px; }
}
@media(max-width:600px) {
 .gqe-section:not(.is-keyboard) .gqe-mascot-guide { display: flex; flex-basis: 54px; }
 .gqe-mascot-guide .gr-guide-button { width: 52px; height: 56px; }
 .gqe-mascot-guide .gr-guide-button img { width: 46px; height: 50px; }
 .gqe-mascot-guide:has(.gr-guide-tip:not([hidden])) { flex-basis: 100% !important; }
 .gqe-remake-title { gap: 8px; }
}
.gqe-section.is-keyboard .gqe-mascot-guide { display: none !important; }
@media(max-height:480px) { .gqe-section .gqe-mascot-guide { display: none !important; } }
@media print { .gr-page-guide, .gr-guide-button, .gr-guide-tip { display: none !important; } }
/* v168: the companion has a real reserved slot, including desktop and compact views. */
.gqe-section .gqe-mascot-guide { display: flex; flex-basis: 124px; align-self: center; }
.gqe-section .gqe-mascot-guide .gr-guide-button { width: 120px; height: 132px; position: relative; padding: 8px 5px 18px !important; }
.gqe-section .gqe-mascot-guide .gr-guide-button img { width: 106px; height: 110px; }
.gr-guide-label { position: absolute; bottom: 0; left: 0; right: 0; text-align: center; font-size: 11px; font-weight: 650; color: #9a3b1a; white-space: nowrap; }
.gr-guide-button[data-reaction="added"] .gr-guide-label { color: #24624c; }
.gqe-section .gqe-mascot-guide:has(.gr-guide-tip:not([hidden])) { flex-basis: 100%; }
.gr-compact-bear { display: none; }
.gqe-result-brand .gr-result-bear { width: 88px; height: 98px; }
.gr-phone-dialog-icon svg { display: none; }
.gr-phone-dialog .gr-phone-dialog-icon { width: 70px; height: 78px; background: transparent; border: 0; margin-bottom: 6px; }
.gr-phone-bear { width: 70px; height: 78px; object-fit: contain; }
@media(max-width:600px) {
 .gqe-section:not(.is-keyboard) .gqe-mascot-guide { flex-basis: 82px; }
 .gqe-section .gqe-mascot-guide .gr-guide-button { width: 78px; height: 90px; padding: 5px 3px 15px !important; }
 .gqe-section .gqe-mascot-guide .gr-guide-button img { width: 70px; height: 72px; }
 .gr-guide-label { font-size: 9px; }
 .gqe-result-brand .gr-result-bear { width: 64px; height: 72px; }
 .gqe-result-topline h2 { font-size: 19px; }
 .gqe-remake-title h2 { font-size: 28px; }
}
@media(max-height:480px) {
 .gqe-section:not(.is-keyboard) .gqe-mascot-guide { display: flex !important; flex-basis: 60px; }
 .gqe-section .gqe-mascot-guide .gr-guide-button { width: 58px; height: 55px; padding: 0 !important; }
 .gqe-section .gqe-mascot-guide .gr-guide-button img { width: 48px; height: 50px; }
 .gqe-section .gr-guide-label { display: none; }
}
.gqe-section.is-keyboard .gqe-mascot-guide { display: none !important; }
.gqe-section.is-keyboard .gqe-remake-head { grid-template-columns: 66px 34px minmax(0,1fr) 40px; }
.gqe-section.is-keyboard .gr-compact-bear { display: block; grid-column: 2; grid-row: 1; width: 32px; height: 38px; }
.gqe-section.is-keyboard .gqe-brand-mini { grid-column: 3; }
.gqe-section.is-keyboard #machineClose { grid-column: 4; }
.gr-phone-dialog.is-compact .gr-phone-dialog-icon { display: block; width: 38px; height: 42px; margin: 0 10px 3px 0; float: left; }
.gr-phone-dialog.is-compact .gr-phone-bear { width: 38px; height: 42px; }
.gr-phone-dialog.is-compact .gr-phone-dialog-copy { clear: both; }
@media print { .gr-result-bear,.gr-compact-bear,.gr-guide-label { display: none !important; } }