.card{cursor:pointer}
.card .visual-open{position:absolute;inset:0;width:100%;height:100%;display:grid;place-items:center;background:transparent;border:0;padding:0;color:inherit;border-radius:0}
.card .visual-open:focus-visible{outline:3px solid #de642e;outline-offset:-5px}
.card .heart{z-index:1}
.filament-detail{padding:0 24px 24px;touch-action:pan-y}
.filament-detail .detail-toolbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:8px;background:#fff;margin:0 -24px;padding:8px 16px;border-bottom:1px solid var(--line)}
.detail-toolbar .detail-step{min-height:44px;padding:8px 12px;border:1px solid #bbc5b7;border-radius:8px;background:white;font-size:12px;display:flex;align-items:center;gap:6px}
.detail-toolbar .detail-step:disabled{opacity:.4;cursor:default}
.detail-toolbar #detailPosition{font-size:12px;text-align:center;white-space:nowrap;min-width:45px}
.filament-detail .detail-toolbar #close{position:static;float:none;flex-shrink:0;margin-left:auto;width:44px;height:44px;min-height:44px;font-size:26px}
.detail-gesture-hint{margin:12px 0 0;font-size:11px;line-height:1.5;color:#53644f}
.filament-detail #filamentTitle:focus{outline:none}
@media(max-width:700px){
 .filament-detail{padding:0 18px 18px}
 .filament-detail .detail-toolbar{margin:0 -18px;padding:7px 10px;gap:5px}
 .detail-toolbar .detail-step{padding:8px;font-size:11px;gap:4px}
 .detail-toolbar #detailPosition{min-width:38px;font-size:11px}
 .detail-toolbar .detail-arrow{font-size:17px}
}
@media(max-width:360px){
 .detail-toolbar .detail-step{padding:8px 5px;font-size:10px}
 .detail-toolbar .detail-arrow{display:none}
 .filament-detail .detail-toolbar{gap:4px;padding:7px 8px}
}