/* Original character cutout uses real alpha transparency and remains uncropped. */
.mascot-guide{--mascot-height:240px;--mascot-width:160px;display:grid;grid-template-columns:var(--mascot-width) minmax(0,1fr);align-items:center;gap:22px;min-width:0;background:var(--cream);color:var(--ink);border-top:1px solid var(--line);padding:18px 24px 18px 16px;isolation:isolate}
.mascot-guide__art{min-width:0}
.mascot-guide__art img{display:block;width:100%;height:var(--mascot-height);max-width:100%;object-fit:contain;object-position:center;transform-origin:50% 88%}
.mascot-guide__copy{min-width:0}
.mascot-guide .mascot-guide__text{margin:0;max-width:30ch;color:var(--ink);font-size:.9375rem;font-weight:500;line-height:1.75;letter-spacing:0;overflow-wrap:break-word}
.mascot-guide .mascot-guide__link{min-height:44px;max-width:100%;margin-top:13px;gap:12px;font-size:.75rem;line-height:1.6;white-space:normal;text-align:start}
.mascot-guide__link>span{flex-shrink:0}
.mascot-guide--welcome{max-width:480px;margin-top:32px}
@media(min-width:681px) and (max-width:980px){.mascot-guide--welcome{--mascot-height:198px;--mascot-width:132px;gap:16px;padding-inline:12px 16px}}
.mascot-guide--branches{--mascot-height:156px;--mascot-width:104px;max-width:720px;margin-bottom:32px;padding-block:10px;gap:26px}
.mascot-guide--branches .mascot-guide__text{font-size:1rem;max-width:38ch}
.mascot-guide--menu{--mascot-height:96px;--mascot-width:64px;gap:18px;padding:10px 16px;margin-block:18px 4px;border-top:0}
.mascot-guide--menu .mascot-guide__text{font-size:.8125rem;font-weight:400;line-height:1.7;max-width:32ch}
.mascot-error{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(220px,.9fr);align-items:center;gap:clamp(30px,6vw,80px);max-width:1100px;margin-inline:auto;padding-block:70px}
.mascot-error__copy{min-width:0}
.mascot-error__copy h1{font-size:clamp(2rem,3.8vw,3.5rem);line-height:1.2;max-width:17ch}
.mascot-error__copy>p{margin-top:22px;max-width:44ch}
.mascot-error__actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin-top:28px}.mascot-error__actions a{min-width:0;max-width:100%;margin-block:0;white-space:normal;overflow-wrap:anywhere}
.mascot-error__art{min-width:0;background:var(--paper);isolation:isolate}
.mascot-error__art img{width:100%;height:420px;max-width:280px;margin-inline:auto;object-fit:contain}
@media(max-width:680px){.mascot-error__actions{justify-content:center}}
@media(max-width:680px){.mascot-guide--welcome{--mascot-height:210px;--mascot-width:140px;max-width:480px;margin-top:27px;gap:20px;padding-inline:12px 20px}.mascot-guide--branches{gap:20px;padding-inline:10px 18px}.mascot-error{grid-template-columns:1fr;gap:26px;padding-block:44px;text-align:center}.mascot-error__copy h1,.mascot-error__copy>p{margin-inline:auto}.mascot-error__art{grid-row:1}.mascot-error__art img{height:240px;max-width:160px}}
@media(max-width:380px){.mascot-guide--welcome{--mascot-height:180px;--mascot-width:112px;gap:14px;padding-inline:10px 14px}.mascot-guide--branches{--mascot-height:132px;--mascot-width:80px;gap:15px}.mascot-guide .mascot-guide__text{font-size:.8125rem}.mascot-guide--menu{gap:12px;padding-inline:10px}.mascot-guide--menu .mascot-guide__text{font-size:.75rem}}
@media(prefers-reduced-motion:no-preference){.mascot-guide__art img{animation:mascot-arrive .7s ease-out backwards;transition:transform .25s ease-out}.mascot-guide:focus-within .mascot-guide__art img{transform:translateY(-3px) rotate(-1.5deg)}}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.mascot-guide:hover .mascot-guide__art img{transform:translateY(-3px) rotate(-1.5deg)}}
@keyframes mascot-arrive{from{opacity:0;transform:translateY(7px) rotate(-1.5deg)}to{opacity:1;transform:translateY(0) rotate(0)}}
@media(prefers-reduced-motion:reduce){.mascot-guide__art img{animation:none;transition:none;transform:none}}