.recent-shell{border:2px solid var(--pink,#ff2bd6);border-radius:4px 20px 4px 20px;background:linear-gradient(120deg,rgba(255,43,214,.07),rgba(0,245,255,.035)),rgba(10,7,14,.9);box-shadow:0 0 25px rgba(255,43,214,.15);padding:0 16px 20px;margin-bottom:28px}
.recent-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin:0 -16px 12px;padding:14px 16px;border-bottom:2px solid rgba(255,255,255,.12);background:linear-gradient(90deg,rgba(255,43,214,.12),rgba(0,245,255,.07));border-radius:2px 18px 0 0}
.recent-filter{background:#0c0c11;color:#b0b0bc;border:2px solid #656573;padding:7px 12px;font:900 11px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.035em;text-transform:uppercase;cursor:pointer;box-shadow:3px 3px 0 rgba(139,92,246,.45);transition:color .15s,border-color .15s,box-shadow .15s}
.recent-filter:hover{color:#fff;border-color:var(--cyan,#00f5ff)}
.recent-filter[aria-pressed=true]{background:var(--yellow,#ffe600);border-color:var(--yellow,#ffe600);color:#09090d;box-shadow:3px 3px 0 var(--pink,#ff2bd6)}
select.recent-filter{max-width:100%;color:var(--cyan,#00f5ff);border-color:rgba(0,245,255,.5)}
.recent-filter:focus-visible,.recent-card:focus-visible{outline:3px solid var(--yellow,#ffe600);outline-offset:4px}
.recent-meta{font:10px ui-monospace,SFMono-Regular,Menlo,monospace;color:#9a9aaa;line-height:1.6}
.recent-status{margin-bottom:15px;display:flex;gap:14px;flex-wrap:wrap}
.recent-status span{display:inline-flex;align-items:center;gap:6px;font:900 10px ui-monospace,SFMono-Regular,Menlo,monospace;color:#9a9aaa;letter-spacing:.04em;text-transform:uppercase}
.recent-status span::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}
.recent-status [data-state=online]{color:var(--lime,#7cff00)}.recent-status [data-state=online]::before{box-shadow:0 0 8px var(--lime,#7cff00)}.recent-status [data-state=offline]{color:var(--orange,#ff7a00)}
.recent-grid{--recent-card-min:155px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,var(--recent-card-min)),1fr));gap:16px}
.recent-card{position:relative;display:block;min-width:0;color:#fff;text-decoration:none;background:#0c0c11;border:2px solid rgba(255,255,255,.8);box-shadow:4px 4px 0 var(--purple,#8b5cf6);transition:transform .16s,box-shadow .16s,border-color .16s}
.recent-card:nth-child(3n+2){box-shadow:4px 4px 0 var(--pink,#ff2bd6)}.recent-card:nth-child(3n){box-shadow:4px 4px 0 var(--cyan,#00f5ff)}
.recent-card:hover{transform:translate(2px,2px);border-color:var(--cyan,#00f5ff);box-shadow:2px 2px 0 var(--cyan,#00f5ff)}
.recent-poster{position:relative;aspect-ratio:2/3;background:linear-gradient(145deg,#123039,#25122e);display:grid;place-items:center;overflow:hidden;border-bottom:2px solid rgba(255,255,255,.18)}
.recent-poster img{position:absolute;width:100%;height:100%;object-fit:cover}.recent-placeholder{font:900 40px ui-monospace,monospace;color:#72727d}
.recent-poster::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 65%,rgba(5,5,10,.4))}
.recent-badge{position:absolute;z-index:1;bottom:10px;right:-7px;max-width:calc(100% - 8px);transform:rotate(-5deg);background:var(--yellow,#ffe600);color:#09090d;padding:4px 12px;font:1000 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;box-shadow:2px 2px 0 var(--pink,#ff2bd6)}
.recent-info{padding:12px;background:repeating-linear-gradient(0deg,transparent 0 8px,rgba(255,255,255,.018) 8px 9px)}
.recent-title{font-size:13px;font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-weight:1000;text-transform:uppercase;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:2.6em}
.recent-subtitle{font:10px ui-monospace,SFMono-Regular,Menlo,monospace;color:#b0b0bc;min-height:1.6em;margin:7px 0 9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.recent-info .recent-meta{border-top:1px dashed rgba(255,255,255,.18);padding-top:8px;color:#9a9aaa}
.recent-empty{padding:28px 0;color:#b0b0bc;font:12px ui-monospace,monospace}.recent-more{margin-left:auto;font-size:10px}
@media(max-width:500px){.recent-shell{padding:0 12px 16px}.recent-toolbar{margin:0 -12px 12px;padding:12px;gap:8px}.recent-grid{--recent-card-min:130px;gap:12px}.recent-filter{padding:7px 9px;font-size:10px}.recent-info{padding:10px}.recent-more{flex-basis:100%;margin-left:0}}
@media(prefers-reduced-motion:reduce){.recent-card,.recent-filter{transition:none}.recent-card:hover{transform:none}}

/* Live service dashboard */
.svc{min-height:250px}
.svc-sticker{font-size:.5rem;max-width:75%;white-space:nowrap}
.svc-title{padding-top:8px}
.svc-status{margin-top:14px;gap:6px;flex-wrap:wrap}
.svc-latency{margin-left:auto;font-size:.58rem;color:#8b8b99;font-weight:600}
.svc-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px;margin-top:14px;padding:12px 0;border-top:1px solid rgba(255,255,255,.14);border-bottom:1px dashed rgba(255,255,255,.16)}
.svc-metrics:empty{display:none}
.svc-metric{min-width:0;display:flex;flex-direction:column;gap:4px}
.svc-metric span{font:600 .58rem ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.035em;color:#9a9aaa}
.svc-metric strong{font:900 1.1rem ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--cyan,#00f5ff);overflow-wrap:anywhere}
.svc[data-service=radarr] .svc-metric strong{color:var(--orange,#ff7a00)}
.svc[data-service=sonarr] .svc-metric strong{color:var(--lime,#7cff00)}
.svc[data-service=prowlarr] .svc-metric strong{color:var(--pink,#ff2bd6)}
.svc .svc-joke{font-size:.6rem;line-height:1.5;margin-top:10px;min-height:3em}
.svc[data-service=sabnzbd] .svc-metric strong{color:var(--yellow,#ffe600)}
