/* Services directory and Redline TV. Uses the shared theme tokens only, so light and dark follow the site. */

/* ---------- Services ---------- */
.svpage{gap:20px}
.sv-tools{display:grid;gap:12px;padding:14px}
.sv-search{position:relative;display:block}
.sv-search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--dim);pointer-events:none}
.sv-search input{width:100%;min-height:46px;border-radius:999px;border:1px solid var(--line);background:var(--pit2);padding:10px 16px 10px 40px;font-size:16px}
.sv-search input:focus{outline:none;border-color:var(--brass);background:var(--pit)}
.sv-ccs,.sv-cats{flex-wrap:wrap}
.sv-ccs .chip,.sv-cats .chip{min-height:38px}
.sv-ccs .chip .mono,.sv-cats .chip .mono{font-size:.72rem;color:var(--dim)}
.sv-ccs .chip.on .mono,.sv-cats .chip.on .mono{color:inherit;opacity:.75}
.sv-cats .chip svg{color:var(--brass)}
.sv-cats .chip.on svg{color:inherit}
.sv-note{margin-top:-8px}
.sv-res{display:grid;gap:30px}
.sv-sec{display:grid;gap:14px;scroll-margin-top:96px}
.sv-sec-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center}
.sv-sec-head h2{font-size:clamp(1.3rem,3vw,1.75rem)}
.sv-sec-head .chip{min-height:38px}
.sv-count{display:grid;gap:4px}
.sv-cc{font-family:var(--body);font-size:.95rem;font-weight:700;letter-spacing:0;margin-top:6px}
.sv-empty{display:grid;gap:8px;justify-items:start}
.sv-how{display:grid;gap:6px}
.pgrid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.pcard{gap:10px;transition:border-color .15s}
.pcard:hover{border-color:var(--brass-deep)}
.pc-head b{line-height:1.3}
.pc-why{border-left:2px solid var(--line);padding-left:10px}
.pc-foot{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:auto;padding-top:2px}
.pc-host{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.svform-wrap{padding:0}
.svform-wrap>summary{display:grid;gap:2px;padding:14px 16px;cursor:pointer;list-style:none;min-height:48px}
.svform-wrap>summary::-webkit-details-marker{display:none}
.svform-wrap>summary b::after{content:" +";color:var(--brass)}
.svform-wrap[open]>summary b::after{content:" ×"}
.svform{display:grid;gap:12px;padding:0 16px 16px}
.svform input,.svform select{min-height:44px;border-radius:10px;border:1px solid var(--line);background:var(--pit2);padding:8px 12px;font-size:16px;width:100%}
.sv-skel{min-height:170px}
.sv-skel i{display:block;height:12px;border-radius:6px;background:var(--pit3);animation:svpulse 1.2s ease-in-out infinite alternate}
.sv-skel i:nth-child(1){width:55%;height:16px}.sv-skel i:nth-child(2){width:90%}.sv-skel i:nth-child(3){width:70%}
@keyframes svpulse{from{opacity:.45}to{opacity:1}}

@media (max-width:640px){
 .sv-tools{padding:12px;gap:10px;margin-inline:-4px}
 .sv-ccs,.sv-cats{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-12px;padding:0 12px 2px;scroll-padding-inline:12px}
 .sv-ccs::-webkit-scrollbar,.sv-cats::-webkit-scrollbar{display:none}
 .sv-sec-head{grid-template-columns:auto minmax(0,1fr)}
 .sv-sec-head .chip{grid-column:1/-1;justify-self:start}
 .sv-sec-head p{display:none}
 .pgrid{grid-template-columns:1fr}
 .pc-foot .btn{flex:1 1 auto}
}

/* ---------- Redline TV ---------- */
.tvmain{gap:22px}
.tvsec{display:grid;gap:12px;min-width:0}
.tvsec .sec-head{margin:0}
.tvrow{grid-auto-columns:minmax(230px,260px);gap:14px}
.tvrow .vcard{scroll-snap-align:start}
.vcard.mini{gap:8px;padding:10px}
.vcard.mini b{font-size:.95rem!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vcard b{overflow-wrap:anywhere}
.vmeta{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:.74rem;color:var(--dim)}
.vthumb .vdur{position:absolute;right:8px;bottom:8px;background:rgba(13,16,15,.82);color:#fff;font-size:.7rem;font-weight:600;padding:2px 6px;border-radius:4px;font-variant-numeric:tabular-nums}
.tvmore{display:grid;gap:6px;justify-items:center}
.tvgenres{display:grid;gap:6px}
.tvlead{display:flex;gap:8px;flex-wrap:wrap}
.tvlead .chip{min-height:38px}
.tvlead .chip .mono{font-size:.72rem;color:var(--dim)}
.tvlead .chip.on .mono{color:inherit}
@media (max-width:900px){
 .tvlead{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-16px;padding:0 16px 2px}
 .tvlead::-webkit-scrollbar{display:none}
 .tvlead .chip{flex:none}
}
@media (max-width:640px){
 .tvgrid{grid-template-columns:1fr}
 .tvrow{grid-auto-columns:minmax(220px,74vw)}
}
.sv-cats .chip[hidden]{display:none}
@media (max-width:900px){.tvside.panel{padding:0}.tvside>summary{min-height:48px}}

/* ---------- Redline TV: this week overview ---------- */
.tvo{display:grid;gap:12px;min-width:0;border-top:1px solid var(--chalk);padding-top:12px}
.tvo-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.tvo-head h2{font-size:clamp(1.15rem,2.2vw,1.4rem)}
.tvo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.tvo-t{display:grid;align-content:start;gap:10px;min-width:0;padding:14px 16px;border:1px solid var(--line);border-radius:10px;background:var(--pit)}
.tvo-h{font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brass)}
.tvo-t ol,.tvo-t ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.tvo-t button{all:unset;box-sizing:border-box;cursor:pointer;display:grid;align-items:center;width:100%;min-height:30px;border-radius:6px;font-size:.84rem;color:var(--chalk)}
.tvo-t button:focus-visible,.tvo-t a:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.tvo-t button:hover .tvo-l,.tvo-list button:hover span:first-child,.tvo-leg button:hover{text-decoration:underline;text-underline-offset:3px}
.tvo-n{font-size:.72rem;color:var(--dim);font-variant-numeric:tabular-nums;white-space:nowrap}
.tvo-bars{gap:6px!important}
.tvo-bars button{grid-template-columns:minmax(0,1fr) auto;gap:3px 10px;min-height:0;padding:2px 0}
.tvo-bars .tvo-bar{grid-column:1/-1;grid-row:2}
.tvo-l{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tvo-bar{height:5px;border-radius:3px;background:var(--pit3);overflow:hidden}
.tvo-bar i{display:block;height:100%;border-radius:3px;background:var(--brass)}
.tvo-hot{gap:10px!important}
.tvo-hot a{display:grid;gap:2px;text-decoration:none;color:inherit}
.tvo-vt{font-size:.84rem;font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tvo-hot a:hover .tvo-vt{text-decoration:underline;text-underline-offset:3px}
.tvo-vm{font-size:.72rem;color:var(--dim)}
.tvo-list button{grid-template-columns:minmax(0,1fr) auto;gap:10px;border-bottom:1px solid var(--line);padding:3px 0}
.tvo-list li:last-child button{border-bottom:0}
.tvo-list button span:first-child{font-weight:600;line-height:1.3;overflow-wrap:anywhere}
.tvo-mix{display:flex;height:10px;border-radius:5px;overflow:hidden;gap:2px}
.tvo-mix i{display:block;min-width:4px}
.tvo-leg{gap:0!important}
.tvo-gl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tvo-leg button{grid-template-columns:auto minmax(0,1fr) auto;gap:8px;font-size:.8rem;min-height:26px}
.tvo-sw{width:9px;height:9px;border-radius:2px}
.tvo-top{margin:0;font-size:.76rem;color:var(--dim);line-height:1.5}
.tvo-top button{all:unset;cursor:pointer;color:var(--smoke);font-weight:600;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.tvo-top button:hover{color:var(--chalk)}
@media (max-width:640px){
 .tvo-grid{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:minmax(250px,82vw);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:-16px;padding:0 16px 4px}
 .tvo-grid::-webkit-scrollbar{display:none}
 .tvo-t{scroll-snap-align:start}
 .tvo-t button{min-height:36px}
}
