.vg-trigger { position: fixed; z-index: 50; right: max(.7rem, env(safe-area-inset-right)); bottom: max(.7rem, env(safe-area-inset-bottom)); display: flex; align-items: center; gap: .35rem; padding: .2rem .7rem .2rem .15rem; border: 1px solid #bd8798; border-radius: 999px; background: #fffaf7; color: #173d32; box-shadow: 0 8px 28px #173d3233; font: 700 .8rem/1.2 system-ui, sans-serif; cursor: pointer; }
.vg-trigger img { width: 42px; height: 48px; object-fit: contain; }
.vg-panel[hidden] { display: none; }
.vg-panel { position: fixed; z-index: 51; right: max(.7rem, env(safe-area-inset-right)); bottom: calc(max(.7rem, env(safe-area-inset-bottom)) + 3.8rem); width: min(350px, calc(100vw - 1.4rem)); max-height: min(75dvh, 540px); overflow-y: auto; padding: 1.2rem; border: 1px solid #bd8798; border-top: 4px solid #bd8798; background: #fffaf7; color: #2e3230; box-shadow: 0 16px 45px #173d3240; font: 400 1rem/1.5 system-ui, sans-serif; }
.vg-panel h2 { margin: 0 2rem .65rem 0; color: #173d32; font: 700 1.35rem/1.2 system-ui, sans-serif; }
.vg-panel p { margin: .5rem 0 1rem; color: #2e3230; }
.vg-panel .vg-kind { margin: 0 0 .25rem; color: #356b5a; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.vg-panel button { padding: .55rem .8rem; border: 1px solid #356b5a; background: #f7f4ec; color: #173d32; font: 700 .85rem system-ui, sans-serif; cursor: pointer; }
.vg-close { position: absolute; top: .5rem; right: .6rem; border: 0 !important; background: transparent !important; font-size: 1.5rem !important; }
.vg-answer[hidden] { display: none; }
.vg-answer { padding-top: .7rem; border-top: 1px solid #b6d3dc; }
.vg-panel :focus-visible, .vg-trigger:focus-visible { outline: 3px solid #5cadd0; outline-offset: 2px; }
@media print { .vg-trigger, .vg-panel { display: none !important; } }

.vg-inline { display:inline-flex; align-items:center; gap:.5rem; margin:1rem 0; padding:.3rem .9rem .3rem .25rem; border:1px solid #bd8798; border-radius:999px; background:#fffaf7; color:#173d32; font:700 .9rem/1.3 system-ui,sans-serif; cursor:pointer; }
.vg-inline img { width:40px; height:46px; object-fit:contain; }
.vg-panel { z-index:9999; } .vg-trigger { z-index:9998; }
@media (max-width:760px) { .vg-panel { right:1rem; bottom:max(5rem,env(safe-area-inset-bottom)); width:calc(100vw - 2rem); } }
.experience-page .vg-panel{display:grid;grid-template-columns:92px minmax(0,1fr);gap:.4rem;width:min(440px,calc(100vw - 1.4rem));border-top:3px solid #85b7c5;border-bottom:3px solid #c78e9d;border-radius:14px;padding:1.1rem;background:#fffdf9}.experience-page .vg-panel[hidden]{display:none}.experience-page .vg-character{width:100px;max-width:100%;height:auto;align-self:end;object-fit:contain;filter:drop-shadow(0 7px 9px #173d3222)}.experience-page .vg-bubble{min-width:0}.experience-page .vg-question{padding:.55rem .7rem;border:1px solid #c9dce0;background:#f7faf9;border-radius:.5rem}.experience-page .vg-trigger{border-top-color:#85b7c5;border-bottom-color:#c78e9d}@media(max-width:520px){.experience-page .vg-panel{grid-template-columns:62px minmax(0,1fr)}.experience-page .vg-character{width:68px}}