body:has(#cat-guide-layer[open]){overflow:hidden}
#cat-guide-layer{position:fixed;inset:0;margin:0;padding:0;border:0;width:100%;height:100dvh;max-width:none;max-height:none;background:transparent;overflow:hidden;color:#193d57}

#cat-guide{box-sizing:border-box;position:absolute;right:24px;bottom:24px;margin:0;padding:8px;width:min(756px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto;display:grid;grid-template-columns:minmax(0,1fr) 264px;gap:20px;align-items:end}
#cat-guide-layer[open] #cat-guide{animation:cat-arrive 220ms ease-out}
#cat-guide-layer::backdrop{background:#102c48b8;backdrop-filter:blur(3px)}
#cat-guide>div{position:relative;background:#fffbea;border:3px solid #193d57;padding:24px;box-shadow:5px 5px #236b8b}
#cat-guide>div:after{content:'';position:absolute;right:-15px;bottom:36px;width:22px;height:22px;background:#fffbea;border-top:3px solid #193d57;border-right:3px solid #193d57;transform:rotate(45deg)}
#cat-guide strong{font-size:18px}
#cat-guide small{display:block;margin-top:10px;color:#456272}
#cat-guide p{font-size:16px;line-height:1.9;margin:18px 0;min-height:6em;overflow-wrap:anywhere}
#cat-guide img{width:264px;height:180px;object-fit:contain;image-rendering:auto;filter:drop-shadow(5px 6px 0 #102c4870)}
#cat-guide button{min-height:44px;padding:10px 16px;font-size:14px;background:#54cc52;color:#193d57}
@keyframes cat-arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){#cat-guide{right:8px;bottom:12px;width:calc(100% - 16px);grid-template-columns:minmax(0,1fr) 100px;gap:14px}#cat-guide img{width:100px;height:auto}#cat-guide>div{padding:16px}#cat-guide strong{font-size:16px}#cat-guide p{font-size:14px}#cat-guide button{font-size:12px;width:100%}}

@media(prefers-reduced-motion:reduce){#cat-guide-layer[open] #cat-guide{animation:none}}
@media(max-width:420px),(max-height:500px){
 #cat-guide{display:block;right:8px;bottom:max(8px,env(safe-area-inset-bottom));width:calc(100% - 16px);max-height:calc(100dvh - 16px);padding:4px}
 #cat-guide>div{padding:16px}
 #cat-guide>div:after{display:none}
 #cat-guide img{display:none}
 #cat-guide p{min-height:0;font-size:14px;line-height:1.8;margin:12px 0}
 #cat-guide button{min-height:48px;width:100%}
}