/* XVS: video lists (cards, grids, categories). Sibsoft UI tokens only, so the accent follows data-product. */
.xv-page{width:100%;box-sizing:border-box;display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px;max-width:1320px;margin:0 auto;padding:24px calc(var(--gut,24px) + 24px) 48px}
.xv-page.xv-wide{grid-template-columns:minmax(0,1fr)}
.xv-box{background:var(--surface-panel);border:1px solid var(--border);border-radius:var(--radius-lg,12px);padding:14px 16px}
.xv-box h6{margin:0 0 8px;font:var(--text-label);letter-spacing:.04em;text-transform:uppercase;color:var(--text-3)}
.xv-box nav{display:flex;flex-direction:column}
.xv-box nav a{display:flex;justify-content:space-between;padding:6px 8px;border-radius:8px;color:var(--text-1);text-decoration:none}
.xv-box nav a:hover{background:var(--accent-soft);color:var(--accent-text)}
.xv-box nav small{color:var(--text-3)}
.xv-tags{display:flex;flex-wrap:wrap;gap:6px}
.xv-tags a{padding:3px 10px;border-radius:999px;background:var(--accent-soft);color:var(--accent-text);font-size:13px;text-decoration:none}
.xv-tags a small{opacity:.7}
.xv-main{min-width:0}
.xv-h1{font:var(--text-h1,700 26px/1.2 var(--font-sans));margin:0 0 16px;color:var(--text-1)}
.xv-sec{margin-bottom:28px}
.xv-sec h2{margin:0 0 12px;font-size:20px;color:var(--text-1)}
.xv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px 14px}
.xv-card{min-width:0}
.xv-cover{position:relative;display:block;aspect-ratio:16/9;border-radius:var(--radius-md,10px);overflow:hidden;background:var(--gray-200)}
.xv-cat{margin-left:auto;color:var(--accent-text);text-decoration:none}
.xv-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-bottom:28px}
.xv-cat-card{display:grid;gap:6px;padding:10px;background:var(--surface-panel);border:1px solid var(--border);border-radius:12px;text-decoration:none;color:var(--text-1)}
.xv-cat-card:hover{border-color:var(--accent-line)}
.xv-cat-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px}
.xv-cat-card small{color:var(--text-3)}
.xv-empty{color:var(--text-3);padding:32px 0}
@media (max-width:900px){.xv-page{grid-template-columns:minmax(0,1fr)}}

/* watch page (claude-design ui_kits/public WatchPage): player, title, owner row with actions,
   description panel, comments; the rail: the playlist being played, Up next */
.xv-watch{width:100%;box-sizing:border-box;max-width:1360px;margin:0 auto;padding:24px 24px 48px}
/* while the next page loads, the frozen copy of this one shows the poster, not a lifeless copy of the player */
.sb-view-stale .xv-player *{visibility:hidden!important}
.xv-watch-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px}
.xv-watch-main{display:flex;flex-direction:column;gap:14px;min-width:0}
.xv-player{position:relative;width:100%;background:#0b0e14 center/cover no-repeat;border-radius:var(--radius-lg,12px);overflow:hidden}
.xv-player>*{max-width:100%}
.xv-wait img{width:100%;display:block;opacity:.5}
.xv-wait-msg{position:absolute;inset:0;display:grid;place-items:center;color:#fff;text-align:center;padding:16px}
.xv-box{background:var(--surface-panel);border:1px solid var(--border);border-radius:12px;padding:14px 16px}
.xv-form{display:grid;gap:10px}
.xv-form h3{margin:0;font-size:16px}
.xv-form select,.xv-form input,.xv-form textarea,.xv-embed{border:1px solid var(--border);border-radius:8px;padding:8px;background:var(--surface-panel);color:var(--text-1);width:100%;box-sizing:border-box}
.xv-descr{margin:0 0 8px;color:var(--text-1)}
.xv-tabs{display:flex;gap:6px;margin-bottom:10px}
.xv-tabs button{border:0;background:none;padding:6px 12px;border-radius:8px;color:var(--text-2);cursor:pointer}
.xv-tabs button.on{background:var(--accent-soft);color:var(--accent-text);font-weight:600}
.sb-root .xv-wtitle{margin:0;font:var(--fw-bold) 22px/1.25 var(--font-sans);letter-spacing:-.01em;color:var(--text-1);overflow-wrap:anywhere}
.xv-edit{margin-left:8px;color:var(--text-3);font-size:16px;vertical-align:middle}
.xv-wbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.sb-root .xv-wown{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;min-width:0}
.xv-wown img.sb-avatar{object-fit:cover}
.xv-wown>span:last-child{display:flex;flex-direction:column;min-width:0}
.xv-wown b{color:var(--text-1)}
.xv-wown .sb-muted{font-size:12px}
.xv-wsp{flex:1}
.xv-wviews{font-size:13px}
.xv-wacts{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.xv-wvote{display:inline-flex}
.xv-wvote .sb-btn:first-child{border-radius:var(--radius-md) 0 0 var(--radius-md)}
.xv-wvote .sb-btn:last-child{border-radius:0 var(--radius-md) var(--radius-md) 0;margin-left:-1px}
.sb-root .xv-wacts .sb-btn.on{color:var(--accent-text);border-color:var(--accent-line);background:var(--accent-soft)}
.sb-root .xv-wic{width:var(--control-h,36px);padding:0;justify-content:center}
.xv-wpanel{padding:14px 16px;display:flex;flex-direction:column;gap:12px}
.xv-wform{align-items:flex-start}.xv-wform .sb-field{width:100%;max-width:420px}
.xv-wpanel .sb-input .sb-btn{margin-right:2px}
.xv-wpanel .sb-input input{font-family:var(--font-mono,monospace);font-size:12px}
.xv-embed{font-family:var(--font-mono,monospace);font-size:12px}
.xv-wver{display:flex;align-items:center;gap:12px}
.xv-wver .sb-btn{margin-left:auto}
.xv-wdesc{padding:12px 16px;border-radius:var(--radius-lg,12px);background:var(--surface-sunken)}
.xv-wbadges{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.sb-root .xv-wbadges a.sb-badge{text-decoration:none}
.xv-wdesc .xv-descr{margin:0;color:var(--text-2);line-height:1.55}
.xv-wextra{margin:6px 0 0;font-size:13px;color:var(--text-2)}
.xv-watch-side{display:flex;flex-direction:column;gap:16px;min-width:0}
.xv-next{display:flex;flex-direction:column;gap:12px}
.xv-next h2,.xv-ch{margin:0;font:var(--text-h2)}
.sb-root .xv-next-row,.sb-root .xv-wpl-row{display:flex;gap:10px;color:inherit;text-decoration:none;min-width:0}
.xv-next-th{position:relative;flex:none;width:150px;height:84px;border-radius:var(--radius-md);background:var(--surface-sunken) center/cover no-repeat;overflow:hidden}
.xv-next-th .yt-time{right:4px;bottom:4px;padding:2px 4px;font-size:11px}
.xv-next-th .yt-play,.xv-pld-th .yt-play{width:32px;height:32px;font-size:15px}
.xv-next-th .yt-prev,.xv-pld-th .yt-prev{left:6px;bottom:8px;padding:2px 5px;font-size:10px}
.xv-next-tx{min-width:0;display:flex;flex-direction:column;gap:4px}
.xv-next-tx b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-weight:600;line-height:1.3;color:var(--text-1)}
.xv-next-tx .sb-muted{font-size:12px}
.xv-next-row:hover b{color:var(--accent-text)}
.xv-wpl{border:1px solid var(--border);border-radius:var(--radius-lg,12px);overflow:hidden;background:var(--surface-panel)}
.xv-wpl header{display:flex;flex-direction:column;gap:2px;padding:12px 14px;background:var(--surface-sunken);position:relative}
.sb-root .xv-wpl header a{color:var(--text-1);text-decoration:none}
.xv-wpl header .sb-muted{font-size:12px}
.xv-wpl-nav{position:absolute;right:8px;top:10px;display:flex;gap:2px}
.xv-wpl-list{max-height:420px;overflow-y:auto;padding:6px}
.sb-root .xv-wpl-row{align-items:center;padding:6px;border-radius:var(--radius-md)}
.xv-wpl-row:hover{background:var(--surface-sunken)}
.xv-wpl-row.on{background:var(--accent-soft)}
.xv-wpl-n{flex:none;width:18px;text-align:center;font-size:12px;color:var(--text-3)}
.xv-wpl-row.on .xv-wpl-n{color:var(--accent-text)}
.xv-wpl-row .xv-next-th{width:100px;height:56px}
@media (max-width:1100px){.xv-watch-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:640px){.xv-watch{padding-left:12px;padding-right:12px}.xv-wsp{display:none}.xv-wviews{width:100%;order:3}.xv-next-th{width:140px;height:78px}}

/* my files */
.xv-toolbar{display:flex;gap:8px;margin:0 0 14px;align-items:center}
.xv-toolbar input[type=search]{height:36px;min-width:240px;border:1px solid var(--border);border-radius:8px;padding:0 10px;background:var(--surface-panel);color:var(--text-1)}
.xv-toolbar .end{margin-left:auto}
.xv-crumbs{display:flex;gap:6px;margin-bottom:10px;color:var(--text-3)}
.xv-folders{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.xv-folders a{display:inline-flex;gap:6px;align-items:center;padding:6px 12px;border-radius:10px;background:var(--accent-soft);color:var(--accent-text);text-decoration:none}
.xv-mini{width:72px;height:40px;object-fit:cover;border-radius:6px;display:block}
.xv-bulk{position:sticky;bottom:12px;display:flex;gap:10px;align-items:center;margin-top:12px;padding:10px 14px;background:var(--surface-panel);border:1px solid var(--accent-line);border-radius:12px;box-shadow:0 8px 24px -10px rgba(20,16,36,.3)}

/* user pages */
.xv-card-form{display:grid;gap:14px;max-width:460px;background:var(--surface-panel);border:1px solid var(--border);border-radius:12px;padding:20px}
.xv-bars{display:flex;align-items:flex-end;gap:4px;height:120px;margin:0 0 16px;padding:8px;background:var(--surface-panel);border:1px solid var(--border);border-radius:12px}
.xv-bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;text-decoration:none;color:var(--text-3)}
.xv-bar i{display:block;width:100%;background:var(--accent);border-radius:4px 4px 0 0;min-height:2px}
.xv-bar small{font-size:10px}
.xv-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-bottom:18px}
.xv-stat{background:var(--surface-panel);border:1px solid var(--border);border-radius:12px;padding:14px 16px}
.xv-stat small{display:block;color:var(--text-3);margin-bottom:4px}
.xv-stat b{font-size:22px;color:var(--text-1)}
.xv-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-top:16px}
.xv-wide-form{max-width:720px}
.xv-checklist{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px 14px;max-height:180px;overflow-y:auto;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-panel)}
.xv-checklist .sb-check-l{align-items:center;min-width:0}
.xv-checklist .sb-check-l span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.xv-thread{display:grid;gap:10px;max-width:720px;margin-bottom:14px}
.xv-msg{background:var(--surface-panel);border:1px solid var(--border);border-radius:12px;padding:10px 14px}
.xv-msg.mine{background:var(--accent-soft);border-color:var(--accent-line)}
.xv-msg small{color:var(--text-3)}
.sb-input textarea{width:100%;box-sizing:border-box;border:0;background:transparent;color:var(--text-1);padding:8px 10px;font:inherit;resize:vertical;outline:none}
.xv-toolbar input[type=text],.xv-toolbar input[type=date],.xv-toolbar input[type=number],.xv-toolbar select{height:36px;border:1px solid var(--border);border-radius:8px;padding:0 10px;background:var(--surface-panel);color:var(--text-1)}

.xv-chg td{background:var(--accent-soft)}
.xv-setting{width:100%;box-sizing:border-box;height:32px;border:1px solid var(--border);border-radius:8px;padding:0 10px;background:var(--surface-panel);color:var(--text-1);font:13px var(--font-mono,monospace)}

/* comments widget (Templates/public/_comments.html): claude-design WatchPage */
.xv-comments{display:flex;flex-direction:column;gap:14px;margin-top:8px}
.xv-cm-form,.xv-cm{display:flex;gap:10px;align-items:flex-start}
.xv-cm-fields{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px}
.xv-cm-fields .sb-textarea{min-height:44px;width:100%;box-sizing:border-box}
.xv-cm-b{min-width:0;flex:1}
.xv-cm-h{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap;font-size:13px}
.sb-root .xv-cm-h a{color:var(--text-1);text-decoration:none}
.xv-cm-x{margin-left:auto;color:var(--danger-text,#c43a3a)!important}
.xv-cm-t{white-space:pre-line;margin-top:2px;overflow-wrap:anywhere;color:var(--text-1)}
.xv-cm-who{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (max-width:600px){.xv-cm-who{grid-template-columns:1fr}}
.xv-news{max-width:900px;margin:0 auto;padding:16px}
.xv-news h1{margin:0 0 4px;font-size:24px}

/* admin: trends, queue chips, horizontal bars */
.xv-up{color:var(--ok-text)}
.xv-down{color:var(--danger-text)}
.xv-chip{display:inline-block;margin:0 4px 2px 0;padding:1px 8px;border-radius:999px;font-size:12px;background:var(--accent-soft);color:var(--text-2)}
.xv-chip.error,.xv-chip.stuck{background:var(--danger-bg);color:var(--danger-text)}
.xv-chip.encoding,.xv-chip.moving{background:var(--ok-bg);color:var(--ok-text)}
.xv-hbars{display:grid;gap:4px;margin-bottom:12px}
.xv-hbar{display:grid;grid-template-columns:90px 1fr auto;align-items:center;gap:8px;color:var(--text-2);text-decoration:none;font-size:13px}
.xv-hbar i{display:block;height:10px;border-radius:5px;background:var(--accent)}

/* premium page (Templates/public/payments.*) */
.xv-pay{max-width:900px;margin:0 auto;padding:16px;display:grid;gap:18px}
.xv-pay h1,.xv-pay h2{text-align:center;margin:0}
.xv-cmp-r{display:grid;grid-template-columns:2fr 1fr 1fr;gap:8px;padding:9px 4px;border-bottom:1px solid var(--border);align-items:center;text-align:center}
.xv-cmp-r:last-child{border-bottom:0}
.xv-cmp-r>span:first-child{text-align:end}
.xv-cmp-h{font-weight:700}
.xv-cmp-r .prem{color:var(--accent-text)}
.xv-yes{color:var(--success,#1e9754);font-size:22px}.xv-no{color:var(--danger,#d12222);font-size:22px}
.xv-pay-exp{display:flex;gap:8px;align-items:center}
.xv-plans{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px}
.xv-plan{text-align:center;display:grid;gap:8px}
.xv-plan.on{border-color:var(--accent)}
.xv-plan-d{color:var(--accent-text);font-weight:600}
.xv-plan-p{font-size:26px;font-weight:700}
.xv-gws h3{margin:0 0 10px;font-size:16px}
.xv-gw-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.xv-gw{display:block;background:#fff;border:1px solid var(--border);border-radius:10px;padding:8px}
.xv-gw:hover{border-color:var(--accent)}
.xv-gw img{width:100%;display:block}
.xv-pay .xv-tabs{justify-content:center}
@media (max-width:600px){.xv-cmp-r{grid-template-columns:1.4fr 1fr 1fr;font-size:13px}}
.xv-bulk,.xv-filters,.xv-toolbar{flex-wrap:wrap}
.xv-bulk input[type=text],.xv-bulk select{height:36px;border:1px solid var(--border);border-radius:8px;padding:0 10px;background:var(--surface-panel);color:var(--text-1)}
a.xv-stat{display:block;text-decoration:none;color:inherit}
a.xv-stat:hover{border-color:var(--accent-line)}
a.xv-stat small:last-child{margin:4px 0 0}

/* upload pages */
.xv-up{max-width:820px}
.xv-upres{margin-bottom:12px}
.xv-upres.bad{border-color:var(--danger-text)}
.xv-upres-err{color:var(--danger-text)}
.xv-upres-head{display:flex;gap:12px;align-items:center;margin-bottom:10px}
.xv-upres-head img{border-radius:6px;object-fit:cover}
.xv-upres-title{font-weight:600}
.xv-upcode{display:flex;gap:8px;align-items:flex-start}
.xv-upcode textarea{flex:1;border:1px solid var(--border);border-radius:8px;padding:8px;background:var(--surface-panel);color:var(--text-1);font:inherit;resize:vertical}
.xv-srt{padding:12px}
.xv-srt-file{cursor:pointer}
.xv-stream{aspect-ratio:16/9;width:min(900px,100vw)}
.xv-stream iframe{width:100%;height:100%;border:0;display:block}
.xv-news{width:min(900px,100%)}
.xv-opts{display:flex;gap:14px;margin:8px 0;font-size:13px}.xv-opts label{margin-right:12px}

/* download_orig / download_versions pages */
.xv-dlorig{max-width:560px}
.xv-dlorig .sb-authf{display:flex;flex-direction:column;gap:14px}
.xv-dlorig-btn{display:flex;align-items:center;gap:14px;justify-content:flex-start;padding:16px 20px;height:auto;text-align:left}
.xv-dlorig-btn span{display:flex;flex-direction:column;gap:2px}
.xv-dlorig-btn small{font-size:12px;opacity:.85;word-break:break-all}
.xv-dlorig-btn small.muted{opacity:.6}
.xv-dlorig-tbl{border-collapse:collapse;margin:8px 0;font-size:14px}
.xv-dlorig-tbl th{font-weight:500;color:var(--sb-muted,#6b7280);text-align:left;padding:4px 16px 4px 0}
.xv-versions{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.xv-versions li{display:flex;justify-content:space-between;gap:12px;padding:10px 14px;border:1px solid var(--sb-border,#e5e7eb);border-radius:10px;background:var(--sb-surface,#fff)}
.xv-versions .muted{color:var(--sb-muted,#6b7280);font-size:13px}

/* Home page (claude-design ui_kits/public/Home.jsx): plain header with a pill search, category chips, card grid, slim footer */
.hw-yt .hw-band{background:var(--surface-raised);--topline-fg:var(--text-1);position:sticky;top:0;z-index:20}
.hw-yt{--hw-hh:60px;background:var(--surface-raised)}
.hw-yt .hw-main{background:var(--surface-raised)}
.hw-yt{--hw-px:16px}
.hw-yt .hw-hdr,.hw-yt .hw-hdr.home{gap:16px;color:var(--text-1)}
.sb-root .hw-yt .hw-hdr a,.hw-yt .hw-hdr button{color:var(--text-1)}
.hw-yt .hw-hdr .hw-lg img{height:22px}
.hw-yt .hw-hdr .hw-lgs{display:inline-flex}
.hw-yt .hw-lg .d,:root[data-theme="dark"] .hw-yt .hw-lg .l{display:none}
:root[data-theme="dark"] .hw-yt .hw-lg .d{display:inline}
.hw-yt .hw-hdr .hw-nv{font-weight:600;color:var(--text-2)}
.hw-yt .hw-hdr .hw-nv:hover{color:var(--text-1)}
.hw-yt .hw-hdr .hw-lang{color:var(--text-2)}
.hw-yt .hw-hdr .yt-ic{display:inline-block}
.hw-hdr .yt-ic{display:none}
.hw-yt .hw-hdr .hw-av{background:var(--accent);color:var(--on-accent)}
.yt-search{flex:0 1 620px;min-width:0;margin:0 auto;display:flex;align-items:center;height:40px;border:1px solid var(--border-control);border-radius:999px;background:var(--surface-panel);overflow:hidden}
.yt-search:focus-within{box-shadow:var(--focus-ring)}
.yt-search>i{padding:0 10px 0 16px;color:var(--text-3)}
.yt-search input{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;font:var(--fw-medium) 14px/1 var(--font-sans);color:var(--text-1)}
.yt-search button{height:100%;padding:0 20px;border:0;border-left:1px solid var(--border-control);background:var(--surface-sunken);font:var(--fw-semibold) 13px/1 var(--font-sans);cursor:pointer}
.yt-page{width:100%;box-sizing:border-box;max-width:1800px;margin:0 auto;padding:0 24px 48px}
.yt-filters{position:sticky;top:var(--hw-hh);z-index:10;display:flex;flex-wrap:wrap;gap:8px;padding:8px 0 12px;background:var(--surface-raised)}
/* the watch page's own top padding is for the player: the dropdowns sit as close under the header as on the home page */
.xv-watch .yt-filters{margin-top:-24px}
.yt-filters .sb-dd{position:relative}
.yt-filters .sb-dd>.sb-menu{position:absolute;left:0;top:calc(100% + 6px);z-index:var(--z-dropdown)}
.yt-filters .sb-menu{max-height:min(60vh,420px);overflow-y:auto;min-width:200px}
.sb-root .yt-filters .sb-menu-item.on{background:var(--surface-sunken);font-weight:600}
.yt-grid{margin-top:12px;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:32px 16px}
.sb-root .yt-card{position:relative;display:flex;flex-direction:column;gap:10px;min-width:0;color:inherit}
.yt-cover{position:relative;display:block;aspect-ratio:16/9;border-radius:var(--radius-lg);overflow:hidden;background:var(--surface-sunken)}
.yt-thumb{position:absolute;inset:0;background-size:cover;background-position:center}
.yt-time{position:absolute;right:8px;bottom:8px;padding:3px 5px;border-radius:4px;background:rgba(13,17,24,.82);color:#fff;font:var(--fw-semibold) 12px/1 var(--font-sans)}
.yt-row{display:flex;gap:10px;align-items:flex-start}
.yt-av{flex:none;width:34px;height:34px;font-size:11px}
.yt-txt{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px}
.yt-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font:var(--fw-semibold) 15px/1.35 var(--font-sans);color:var(--text-1)}
.yt-card:hover .yt-title{color:var(--accent-text)}
.yt-own{font-size:13px;color:var(--text-2)}
.yt-meta{display:flex;flex-wrap:wrap;gap:0 8px;font-size:13px;color:var(--text-3)}
.yt-meta>span+span::before{content:"·";margin-right:8px}
.yt-more{display:flex;justify-content:center;margin-top:28px}
.yt-more .sb-btn{font-weight:700;border-radius:999px;padding:0 22px}
.sb-root .yt-h1{margin:4px 0 0;font:var(--fw-bold,700) 20px/1.3 var(--font-sans);color:var(--text-1);overflow-wrap:anywhere}
.yt-none{margin:0;padding:48px 0;text-align:center;color:var(--text-3)}
.yt-foot{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;padding:18px 24px;border-top:1px solid var(--border);font-size:13px;font-weight:600;background:var(--surface-raised)}
.sb-root .yt-foot a{color:var(--text-3)}
.sb-root .yt-foot a:hover{color:var(--text-1)}
.yt-foot>span{margin-left:auto;color:var(--text-3);font-weight:500}
/* Home without videos (claude-design Home.jsx EmptyHome) */
.hw-main:has(.yt-empty),.yt-page:has(>.yt-empty){display:flex;flex-direction:column}
.yt-page:has(>.yt-empty){flex:1;padding-bottom:0}
.yt-empty{position:relative;flex:1;min-height:440px;display:grid;place-items:center;padding:24px 0;overflow:hidden}
.yt-ghost{position:absolute;inset:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:32px 16px;align-content:start;overflow:hidden;opacity:.9;-webkit-mask-image:radial-gradient(ellipse 70% 75% at 50% 45%,rgba(0,0,0,.2),#000 85%);mask-image:radial-gradient(ellipse 70% 75% at 50% 45%,rgba(0,0,0,.2),#000 85%)}
.yt-ghost>div{display:flex;flex-direction:column;gap:10px}
.yt-ghost .th{aspect-ratio:16/9;border-radius:var(--radius-lg);background:var(--surface-sunken)}
.yt-ghost .ln{display:flex;gap:10px}
.yt-ghost .ln i{flex:none;width:34px;height:34px;border-radius:50%;background:var(--surface-sunken)}
.yt-ghost .ln span{flex:1;display:flex;flex-direction:column;gap:7px;padding-top:3px}
.yt-ghost .ln b{height:11px;width:85%;border-radius:4px;background:var(--surface-sunken)}
.yt-ghost .ln b+b{height:9px;width:50%}
.yt-empty-card{position:relative;box-sizing:border-box;max-width:440px;display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;padding:36px 32px;border-radius:var(--radius-xl);background:var(--surface-raised);box-shadow:0 0 0 1px var(--border),0 18px 48px rgba(16,24,40,.10)}
.yt-empty-card .ic{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font-size:28px}
.hw .yt-empty-card h2{margin:4px 0 0;font:var(--fw-bold) 22px/1.25 var(--font-sans);letter-spacing:var(--tracking-tight);color:var(--text-1)}
.yt-empty-card p{margin:0;font-size:15px;line-height:1.5;color:var(--text-2);text-wrap:pretty}
.yt-empty-card .acts{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:6px}
.sb-root .hw .yt-empty-card .sb-btn{height:40px;padding:0 18px;border-radius:999px;gap:8px;font-size:14px;font-weight:600;color:var(--text-1)}
.sb-root .hw .yt-empty-card .sb-btn.primary{padding:0 20px;font-weight:700;color:var(--on-accent)}
.yt-empty-card .sb-btn i{font-size:16px}
.yt-empty-card small{font-size:13px;color:var(--text-3)}
@media (max-width:900px){.yt-search button{display:none}.hw-yt .hw-hdr .hw-nv{display:none}}
@media (max-width:640px){.hw-yt{--hw-hh:56px}.yt-page{padding:0 12px 32px}.yt-grid{grid-template-columns:minmax(0,1fr);gap:24px}.hw-yt .hw-hdr .hw-lang{display:none}}

.hw-yt .hw-hdr>span[style]{display:none}
.hw-yt .hw-hdr .hw-nv:not([href="/upload/"]){display:none}
.sb-root .hw-yt .hw-hdr .sb-btn.primary{color:var(--on-accent)}
.sb-root .hw-yt .hw-hdr .sb-btn{font-weight:600;color:var(--text-1)}
.sb-root .hw-yt .hw-hdr .sb-btn.primary{color:var(--on-accent)}
.sb-root .hw-yt .hw-hdr .hw-reg,.sb-root .hw-yt .hw-hdr.home .hw-reg{background:var(--accent);color:var(--on-accent);border-radius:var(--radius-md,10px);padding:0 14px}

.yt-bg{position:absolute;inset:-8px -8px -10px;border-radius:var(--radius-xl);background:var(--surface-sunken);opacity:0;transform:scale(.96);transition:opacity .2s,transform .2s;pointer-events:none}
.yt-card.hov .yt-bg,.yt-card:hover .yt-bg{opacity:1;transform:scale(1)}
.yt-cover,.yt-row{position:relative}
.yt-ov{position:absolute;inset:0;pointer-events:none}
.yt-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:rgba(13,17,24,.6);color:#fff;font-size:22px;transition:opacity .3s}
.yt-prev{position:absolute;left:10px;bottom:12px;padding:3px 6px;border-radius:4px;background:rgba(13,17,24,.82);color:#fff;font:var(--fw-semibold) 11px/1 var(--font-sans)}
.yt-prog{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.35)}
.yt-prog i{display:block;height:100%;background:var(--accent)}
.yt-acts{position:absolute;right:8px;top:8px;display:none;flex-direction:column;gap:4px}
.yt-card.hov .yt-acts,.yt-card:hover .yt-acts,.yt-card:focus-within .yt-acts{display:flex}
.yt-acts button{width:30px;height:30px;display:grid;place-items:center;padding:0;border:0;border-radius:6px;background:rgba(13,17,24,.82);color:#fff;font-size:15px;cursor:pointer}
.yt-acts button:hover{background:rgba(13,17,24,.95)}
.yt-more-btn{flex:none;width:28px;height:28px;margin-right:-6px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:transparent;color:var(--text-2);font-size:18px;cursor:pointer;opacity:0;transition:opacity .15s}
.yt-card.hov .yt-more-btn,.yt-card:hover .yt-more-btn,.yt-card:focus-within .yt-more-btn{opacity:1}
.yt-more-btn:hover{background:var(--surface-raised)}
@media (hover:none){.yt-acts{display:flex}.yt-more-btn{opacity:1}}

/* my videos (the hybrid file manager of XFS): the video tiles of the grid are the home page's cards
   (yt-*: hover panel, 16:9 cover, time-slide preview with a progress bar, quick actions on the cover) */
.xv-mft{position:relative;display:inline-block;flex:none;width:56px;height:32px;margin-right:8px;vertical-align:middle;overflow:hidden;border-radius:5px;background:var(--surface-sunken);box-shadow:inset 0 0 0 1px var(--hy-bd)}
.xv-mf-tbl:not(.hy-grid) .xv-mft .yt-time{right:2px;bottom:2px;padding:1px 3px;border-radius:3px;font-size:9.5px}
.xv-mfm,.xv-gq{display:none}
.xv-mf-tbl:not(.hy-grid) tbody tr[data-t=vid] td:nth-child(2) a{display:inline-flex;align-items:center;max-width:100%;vertical-align:middle}
.xv-mf-tbl:not(.hy-grid) tbody tr[data-t=vid] .hy-fn{overflow:hidden;text-overflow:ellipsis}
.xv-mfs{display:inline-flex;flex-wrap:wrap;gap:4px;margin-left:8px;vertical-align:middle}
.xv-enc{padding:1px 7px;border-radius:999px;background:var(--hy-acb);color:var(--hy-act);font:600 11px/1.5 var(--font-sans);font-variant-numeric:tabular-nums}
.xv-enc.warn{background:color-mix(in srgb,#f5b41e 18%,transparent);color:#a46a00}
.xv-enc.dg{background:color-mix(in srgb,#c43a3a 14%,transparent);color:#c43a3a}
.xv-mf-tbl.hy-grid tbody{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px 14px;padding:14px}
.hy-grid tbody tr[data-t=vid]{isolation:isolate;align-items:stretch;padding:0 0 4px;border-radius:0}
.hy-grid tbody tr[data-t=vid]:hover{background:none}
.hy-grid tbody tr[data-t=vid]::before{content:"";position:absolute;inset:-8px -8px -6px;z-index:-1;border-radius:var(--radius-xl);background:var(--surface-sunken);opacity:0;transform:scale(.96);transition:opacity .2s,transform .2s;pointer-events:none}
.hy-grid tbody tr[data-t=vid].hov::before,.hy-grid tbody tr[data-t=vid]:hover::before{opacity:1;transform:scale(1)}
.hy-grid tbody tr[data-t=vid].sel{background:none;outline:0}
.hy-grid tbody tr[data-t=vid].sel::before{opacity:1;transform:scale(1);background:var(--hy-acb);box-shadow:0 0 0 1px color-mix(in srgb,var(--hy-ac) 35%,transparent)}
.hy-grid tbody tr[data-t=vid] td:nth-child(2) a{align-items:stretch;gap:4px;text-align:left}
.hy-grid tbody tr[data-t=vid] td:nth-child(2) a::before,.hy-grid tbody tr[data-t=vid] td:nth-child(2) a::after{display:none}
.hy-grid tbody tr[data-t=vid] td:nth-child(3){display:none!important}
.hy-grid .xv-mft{display:block;width:100%;height:auto;aspect-ratio:16/9;margin:0 0 6px;border-radius:var(--radius-lg);box-shadow:none}
.hy-grid tbody tr[data-t=vid] .hy-fn{text-align:left;font:var(--fw-semibold) 14px/1.35 var(--font-sans);color:var(--text-1)}
.hy-grid tbody tr[data-t=vid]:hover .hy-fn{color:var(--accent-text)}
.hy-grid .xv-mfm{display:flex;font-size:12.5px;font-weight:400;color:var(--text-3)}
.hy-grid .xv-mfs{display:flex;margin:4px 0 0}
/* the action cell covers the tile: quick actions on the cover, "more" beside the title (cqw: the tile's width) */
.hy-grid tbody tr[data-t=vid]{container-type:inline-size}
.hy-grid tbody tr[data-t=vid] .hy-fn{padding-right:26px}
.hy-grid tbody tr[data-t=vid] td.hy-act{display:block;inset:0;pointer-events:none}
.hy-grid tbody tr[data-t=vid] td.hy-act .hy-dots{position:absolute;pointer-events:auto;width:30px;height:30px;display:grid;place-items:center;border-radius:6px;background:rgba(13,17,24,.82);color:#fff;font-size:15px}
.hy-grid tbody tr[data-t=vid] td.hy-act .hy-dots:hover{background:rgba(13,17,24,.95)}
.hy-grid tbody tr[data-t=vid] td.hy-act .xv-gq{top:8px;right:8px}
.hy-grid tbody tr[data-t=vid] td.hy-act .xv-gc{top:42px;right:8px}
.hy-grid tbody tr[data-t=vid] td.hy-act .hy-dots[data-sb-menu]{top:calc(100cqw * 9 / 16 + 4px);right:-6px;width:28px;height:28px;border-radius:50%;background:transparent;color:var(--text-2);font-size:18px}
.hy-grid tbody tr[data-t=vid] td.hy-act .hy-dots[data-sb-menu]:hover{background:var(--surface-raised)}
.hy-grid tbody tr[data-t=vid] td.hy-act .hy-dots[data-sb-menu] i{transform:rotate(90deg)}
.hy-grid .xv-gq{display:grid}
@media (hover:none){.hy-grid tbody tr[data-t=vid] td.hy-act{opacity:1}}
/* thumbnails switched off (admin Videos): the list gets a video icon, the grid the file manager's tile in the video tone */
.xv-nothumb tbody tr{--tc:#D9485F}
.xv-mf-tbl.xv-nothumb:not(.hy-grid) tbody td:nth-child(2) a > i{margin-right:6px;color:var(--tc);font-size:16px;vertical-align:-2px}
.xv-mf-tbl.hy-grid.xv-nothumb tbody{grid-template-columns:repeat(auto-fill,minmax(116px,1fr));gap:4px;padding:10px}
.hy-grid.xv-nothumb .xv-mfm{display:none}
/* the grid/list switch sits right beside the thumbnails one (only the bar's gap between, as before the jump button) */
.hy-vw ~ .xv-vw2{margin-left:0}
.xv-mf-tool label{display:block;margin:0 0 10px;font-size:13px;color:var(--hy-t2)}
.xv-mf-tool label .form-control,.xv-mf-tool label .form-select{margin-top:4px}
.xv-mf-tool-2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.xv-mf-tool .sb-check-l{display:flex;gap:9px;margin:0}
.xv-mf-mode{display:flex;gap:18px;margin-bottom:12px}
.xv-mf-lbl{display:block;margin:0 0 4px;font-size:13px;color:var(--hy-t2)}
.xv-mf-tool .xv-checklist{margin-bottom:10px}
@media (max-width:720px){
  .xv-mf-tbl .xv-opt,.xv-mf-tbl thead th:nth-child(3),.xv-mf-tbl tbody td:nth-child(3){display:none}
  .hy-tbl.xv-mf-tbl{min-width:0}
  .xv-mf-tbl:not(.hy-grid) tbody tr[data-t=vid] td:nth-child(2) a{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:8px;align-items:center;width:100%}
  .xv-mf-tbl:not(.hy-grid) .xv-mft{grid-row:1/3;margin:0}
  .xv-mf-tbl:not(.hy-grid) .xv-mfm{display:flex;font-size:11.5px;color:var(--hy-t3);overflow:hidden;white-space:nowrap}
}

/* playlists (claude-design ui_kits/user/Playlists.jsx): cards with the stacked cover, the playlist page */
.xv-pls-sort{width:160px;height:32px}
.xv-pl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:28px 16px;padding:4px 0 24px}
.sb-root .xv-pl-card{display:flex;flex-direction:column;gap:10px;min-width:0;color:inherit;text-decoration:none}
.xv-pl-stack{position:relative;display:block;padding-top:8px}
.xv-pl-stack::before,.xv-pl-stack::after{content:"";position:absolute;height:4px;border-radius:6px 6px 0 0}
.xv-pl-stack::before{left:16px;right:16px;top:0;background:var(--border-strong,#c9d0dc)}
.xv-pl-stack::after{left:8px;right:8px;top:4px;background:var(--text-3);opacity:.55}
.xv-pl-cover{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:var(--radius-lg);background:var(--surface-sunken) center/cover no-repeat}
.xv-pl-cover.empty{display:grid;place-items:center;color:var(--text-3);font-size:13px;font-weight:600}
.xv-pl-count{position:absolute;right:8px;bottom:8px;display:flex;align-items:center;gap:5px;padding:3px 6px;border-radius:4px;background:rgba(13,17,24,.82);color:#fff;font:var(--fw-semibold) 12px/1 var(--font-sans)}
.xv-pl-play{position:absolute;inset:0;display:grid;place-items:center;background:rgba(13,17,24,.55);color:#fff;font:var(--fw-bold) 13px/1 var(--font-sans);letter-spacing:var(--tracking-caps,.06em);text-transform:uppercase;opacity:0;transition:opacity .15s;cursor:pointer}
.xv-pl-play>span{display:flex;align-items:center;gap:8px}
.xv-pl-card:hover .xv-pl-play,.xv-pl-card:focus-visible .xv-pl-play{opacity:1}
.xv-pl-txt{display:flex;flex-direction:column;gap:4px;min-width:0}
.xv-pl-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font:var(--fw-semibold) 14px/1.35 var(--font-sans);color:var(--text-1)}
.xv-pl-meta{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--text-3)}
.xv-pl-open{font-size:12px;font-weight:600;color:var(--text-link,var(--accent-text));opacity:.85}
.xv-pl-card:hover .xv-pl-open{opacity:1}
.xv-pl-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:48px 16px;border:1px dashed var(--hy-bd);border-radius:var(--radius-lg)}

.xv-pld-t{display:flex;align-items:center;gap:8px;min-width:0}
.xv-pld-t>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sb-root .xv-pld-back{width:30px;padding:0;justify-content:center}
.xv-pld-grid{display:grid;grid-template-columns:340px minmax(0,1fr);gap:20px;align-items:start;padding-bottom:20px}
.xv-pld-side{position:sticky;top:calc(var(--top-h,56px) + 12px);padding:14px;display:flex;flex-direction:column;gap:12px}
.xv-pld-cover{position:relative;display:grid;place-items:center;aspect-ratio:16/9;border-radius:var(--radius-lg);background:var(--surface-sunken) center/cover no-repeat}
.xv-pld-cover>span{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:rgba(13,17,24,.6);color:#fff;font-size:20px}
.xv-pld-cover.empty{color:var(--text-3);font-size:13px}
.xv-pld-grid>.sb-section{margin:0}
.sb-root .xv-pld-side textarea.sb-textarea{box-sizing:border-box;width:100%;resize:vertical;font:var(--fw-medium) var(--fs-13)/1.45 var(--font-sans)}
.xv-pld-link{display:flex;gap:8px}
.xv-pld-link .sb-input{flex:1;min-width:0}
.xv-pld-link input{font-family:var(--font-mono,monospace);font-size:12px}
.xv-pld-del{display:flex;justify-content:flex-end}
.xv-pld-list{overflow:hidden}
.xv-pld-empty{display:flex;flex-direction:column;align-items:center;gap:10px;padding:36px 16px;color:var(--text-3)}
.xv-pld-row{display:grid;grid-template-columns:20px 24px 136px minmax(0,1fr) auto;gap:12px;align-items:center;padding:8px 14px 8px 8px;border-top:1px solid var(--border)}
.xv-pld-list>header+.xv-pld-row{border-top:0}
.xv-pld-row:hover{background:var(--surface-sunken)}
.xv-pld-row.drag{opacity:.4}
.xv-pld-row.over{box-shadow:inset 0 2px 0 var(--accent)}
.xv-pld-grip{display:grid;place-items:center;color:var(--text-3);cursor:grab;opacity:.4}
.xv-pld-row:hover .xv-pld-grip{opacity:1}
.sb-root .xv-pld-n{display:grid;place-items:center;font-size:13px;color:var(--text-3);font-variant-numeric:tabular-nums;text-decoration:none}
.xv-pld-n>b{font-weight:500}.xv-pld-n>i{display:none;font-size:13px}
.xv-pld-row:hover .xv-pld-n>b{display:none}.xv-pld-row:hover .xv-pld-n>i{display:block}
.xv-pld-th{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:var(--radius-md);background:var(--surface-sunken) center/cover no-repeat}
.xv-pld-th .yt-time{right:6px;bottom:6px;padding:2px 4px;font-size:11px}
.xv-pld-tx{min-width:0;display:flex;flex-direction:column;gap:3px}
.sb-root .xv-pld-tx a{color:inherit;text-decoration:none}
.xv-pld-tx b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font:var(--fw-semibold) 14px/1.35 var(--font-sans);color:var(--text-1)}
.xv-pld-tx>span{font-size:12px;color:var(--text-3)}
.xv-pld-acts{display:flex;gap:2px;opacity:0;transition:opacity .12s}
.xv-pld-row:hover .xv-pld-acts,.xv-pld-row:focus-within .xv-pld-acts{opacity:1}
.sb-root .xv-pld-acts .sb-btn{width:30px;padding:0;justify-content:center}
.sb-root .xv-pld-acts .sb-btn.dg{color:var(--danger-text,var(--text-2))}
.xv-pld-add{width:560px}
.xv-pld-add-hd{display:flex;flex-direction:column;gap:10px;padding:16px 18px 10px}
.xv-pld-add-hd h3{margin:0}
.xv-pld-add-ic{padding-left:10px;color:var(--text-3)}
.xv-pld-add-list{max-height:360px;overflow-y:auto;padding:0 10px 8px}
.xv-pld-add-row{display:grid;grid-template-columns:auto 96px minmax(0,1fr);gap:12px;align-items:center;padding:8px;border-radius:var(--radius-md);cursor:pointer}
.xv-pld-add-row:hover{background:var(--surface-sunken)}
.xv-pld-add-row.on{background:var(--accent-soft,var(--hy-acb))}
.xv-pld-add-row .xv-pld-tx b{-webkit-line-clamp:1;font-size:13px}
.xv-pld-add-none{margin:0;padding:24px 8px;text-align:center;color:var(--text-3)}
@media (hover:none){.xv-pld-acts{opacity:1}}
@media (max-width:900px){.xv-pld-grid{grid-template-columns:minmax(0,1fr)}.xv-pld-side{position:static}}
@media (max-width:640px){.xv-pld-row{grid-template-columns:24px 104px minmax(0,1fr) auto;gap:10px}.xv-pld-grip{display:none}}
.xv-pld .hy-btn:disabled{opacity:.5;cursor:default;pointer-events:none}

/* the page of a playlist (/playlist/<code>): the summary of the playlist page beside its videos */
.xv-plv{max-width:1320px;padding-top:24px}
.xv-plv-grid{display:grid;grid-template-columns:360px minmax(0,1fr);gap:24px;align-items:start}
.xv-plv-side{position:sticky;top:calc(var(--hw-hh,64px) + 16px);padding:14px;display:flex;flex-direction:column;gap:10px}
.sb-root .xv-plv-t{margin:4px 0 0;font:var(--fw-bold) 22px/1.25 var(--font-sans);color:var(--text-1);overflow-wrap:anywhere}
.sb-root .xv-plv-own{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--text-1);text-decoration:none}
.xv-plv-own .sb-avatar{width:28px;height:28px;font-size:10px}
.xv-plv-meta{display:flex;flex-wrap:wrap;align-items:center;gap:5px;font-size:13px;color:var(--text-3)}
.xv-plv-descr{margin:0;font-size:13.5px;line-height:1.5;color:var(--text-2);white-space:pre-line}
.xv-plv-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.xv-plv-btns .sb-btn.off{opacity:.5;pointer-events:none}
.xv-plv-list{min-width:0;display:flex;flex-direction:column}
.sb-root .xv-plv-list .xv-pld-row{grid-template-columns:24px 168px minmax(0,1fr);padding:8px;border:0;border-radius:var(--radius-lg);color:inherit;text-decoration:none}
@media (max-width:900px){.xv-plv-grid{grid-template-columns:minmax(0,1fr)}.xv-plv-side{position:static}}
@media (max-width:640px){.sb-root .xv-plv-list .xv-pld-row{grid-template-columns:20px 128px minmax(0,1fr);gap:10px}.xv-plv{padding:16px 12px 32px}}
@media (max-width:640px){.hw-yt{--hw-px:12px}.hw-yt .hw-hdr,.hw-yt .hw-hdr.home{gap:8px}.hw-yt .yt-search{display:none}.sb-root .hw-yt .hw-hdr .sb-btn{padding:0 10px}}

/* My domains (claude-design Domains.jsx) */
.xv-dom .sb-section+.sb-section{margin-top:16px}
.xv-dom-list{margin:-14px -16px 0;border-top:1px solid var(--border)}
.xv-dom-item{border-bottom:1px solid var(--border)}
.xv-dom-item.open{background:var(--surface-sunken)}
.xv-dom-row{display:grid;grid-template-columns:24px minmax(0,1fr) 150px 120px auto;gap:12px;align-items:center;padding:10px 16px}
.xv-dom-ic{color:var(--text-3)}
.xv-dom-name{min-width:0;display:flex;align-items:center;gap:8px}
.xv-dom-name b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.xv-dom-added{font-size:12px}
.xv-dom-acts{display:flex;gap:2px;justify-content:flex-end}
.sb-root .xv-dom-act{width:30px;padding:0;justify-content:center;color:var(--text-2)}
.sb-root .xv-dom-del{color:var(--danger-text)}
.xv-dom-dns{padding:4px 16px 16px 52px;display:flex;flex-direction:column;gap:10px;font-size:13px;color:var(--text-2)}
.xv-dom-rec{display:grid;grid-template-columns:90px 1fr 2fr 80px;border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;background:var(--surface-raised);color:var(--text-1)}
.xv-dom-rec>*{padding:8px 12px;border-top:1px solid var(--border);font-size:13px;min-width:0;overflow-wrap:anywhere}
.xv-dom-rec>.h{padding:7px 12px;border-top:0;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--text-3);background:var(--surface-sunken)}
.xv-dom-rec>b{font-weight:700}
.xv-dom-rec>code{font-family:var(--font-mono);font-size:12px;background:none;color:inherit}
.xv-dom-add{display:flex;gap:8px;align-items:flex-start;margin-top:14px}
.xv-dom-add .sb-field{flex:1;max-width:420px}
.xv-dom-def{display:flex;gap:8px;align-items:center;max-width:560px}
.xv-dom-def .sb-input{flex:1}
.xv-dom-note{margin:8px 0 0;font-size:12px}
@media (max-width:640px){.xv-dom-row{grid-template-columns:20px minmax(0,1fr) auto;row-gap:6px}.xv-dom-row>span:nth-child(3){grid-column:2}.xv-dom-added{display:none}.xv-dom-acts{grid-column:3;grid-row:1 / span 2}.xv-dom-dns{padding-left:16px}.xv-dom-rec{grid-template-columns:64px 1fr 2fr 48px}.xv-dom-rec>*{padding:8px}.xv-dom-add{flex-wrap:wrap}}

/* My ads (claude-design Ads.jsx) */
.xv-ads{max-width:980px}
.xv-ads-stats{display:flex;flex-wrap:wrap;gap:12px 32px;padding:2px 0 0;line-height:1.35}
.xv-ads-stats span{display:block;font-size:12px;font-weight:600;color:var(--text-3);white-space:nowrap}
.xv-ads-stats b{font:var(--fw-bold) 20px/1.3 var(--font-sans)}
.xv-ads-list{margin:0 -16px;overflow-x:auto}
.xv-ads-list table{width:100%;border-collapse:collapse}
.xv-ads-list th{padding:8px 10px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--text-3);text-align:left;white-space:nowrap}
.xv-ads-list td{padding:10px;border-top:1px solid var(--border);font-size:13px;vertical-align:middle}
.xv-ads-list .on{width:56px;padding-left:16px}
.xv-ads-list .r{text-align:right;font-variant-numeric:tabular-nums}
.xv-ads-list .b{font-weight:600}
.xv-ads-list .sh{color:var(--text-2);max-width:180px}
.xv-ads-list .sh .sb-badge{margin-left:6px}
.xv-ads-list .act{width:80px;padding-right:16px;text-align:right;white-space:nowrap}
.xv-ads-list tr.off td:not(.on):not(.act){opacity:.62}
.xv-ads-name{display:flex;align-items:center;gap:10px;line-height:1.35}
.xv-ads-name a{display:block;font-weight:600;color:var(--text-1);text-decoration:none}
.xv-ads-name small{display:block;font-size:12px;color:var(--text-3)}
.xv-ads-ic{width:32px;height:32px;flex:none;display:grid;place-items:center;border-radius:8px;background:var(--surface-sunken);color:var(--text-2)}
.sb-root .xv-ads-act{width:30px;padding:0;justify-content:center;color:var(--text-2)}
.sb-root .xv-ads-del{color:var(--danger-text)}
.xv-ads-empty{padding:32px 0;display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--text-3)}
.xv-ad{max-width:940px}
.xv-ad-grid{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start}
.xv-ad-main{flex:999 1 520px;display:flex;flex-direction:column;gap:16px;min-width:0}
.xv-ad-main .sb-section{margin:0}
.xv-ad-side{flex:1 1 280px;max-width:380px;min-width:0;position:sticky;top:0}
.xv-ad-types{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.xv-ad-type{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:12px;text-align:left;font:var(--fw-medium) 13px/1.35 var(--font-sans);cursor:pointer;border-radius:var(--radius-md);border:1px solid var(--border-control);background:var(--surface-raised);color:var(--text-1)}
.xv-ad-type .sb-ic{width:18px;height:18px;color:var(--text-2)}
.xv-ad-type b{font-size:13px;white-space:nowrap}
.xv-ad-type span{font-size:12px;color:var(--text-3)}
.xv-ad-type.on{border:1.5px solid var(--accent);padding:11.5px;background:var(--accent-soft)}
.xv-ad-type.on .sb-ic{color:var(--accent-text)}
.xv-ad-fields{display:flex;flex-direction:column;gap:14px}
.xv-ad-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:14px}
.xv-ad-two:last-of-type{margin-bottom:14px}
.xv-ad-cats{display:flex;flex-direction:column;gap:6px;max-height:200px;overflow:auto;padding:10px 12px;margin-bottom:14px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface-sunken)}
.xv-ad-skip{width:160px}
.xv-ad-skip input{flex:1;min-width:0}
.xv-ad .sb-input .suf{align-self:stretch;display:flex;align-items:center;padding:0 9px;border-left:1px solid var(--border);background:var(--surface-sunken);color:var(--text-3);font:var(--fw-semibold) var(--fs-12)/1 var(--font-sans);white-space:nowrap}
.xv-ad .sb-input.mono input{font-family:var(--font-mono);font-size:12px}
.xv-ad .sb-field{gap:5px}
.xv-ad .sb-field small{display:block;margin:0;font:var(--fw-medium) var(--fs-12)/1.35 var(--font-sans)}
.xv-ad-pv{position:relative;aspect-ratio:16/9;border-radius:var(--radius-lg);overflow:hidden;background:linear-gradient(135deg,#2c303c,#171a24);color:#fff}
.xv-ad-pv>*{position:absolute}
.xv-ad-pv .yv{left:10px;top:10px;font:var(--fw-semibold) 11px/1 var(--font-mono);opacity:.6}
.xv-ad-pv-roll{inset:0}
.xv-ad-pv-roll>*{position:absolute}
.xv-ad-pv-roll .cr{inset:0;display:grid;place-items:center;background:rgba(0,0,0,.35);font:var(--fw-bold) 15px/1 var(--font-sans)}
.xv-ad-pv-roll .chip{left:10px;bottom:12px;padding:3px 6px;border-radius:4px;background:#f5c518;color:#151a24;font:var(--fw-bold) 11px/1 var(--font-sans);white-space:nowrap}
.xv-ad-pv-roll .skip{right:0;bottom:12px;padding:7px 12px;background:rgba(13,17,24,.8);font:var(--fw-semibold) 12px/1 var(--font-sans)}
.xv-ad-pv-ban{left:50%;bottom:30px;transform:translateX(-50%);width:64%;height:44px;display:grid;place-items:center;border-radius:4px;background:rgba(255,255,255,.92);color:#151a24;font:var(--fw-bold) 12px/1 var(--font-sans)}
.xv-ad-pv-ban .sb-ic{position:absolute;right:4px;top:3px;width:12px;height:12px}
.xv-ad-pv-link{inset:0;display:grid;place-items:center;padding:20px;text-align:center;font:var(--fw-semibold) 13px/1.4 var(--font-sans)}
.xv-ad-pv .bar{left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.25)}
.xv-ad-pv .bar i{display:block;width:18%;height:100%;background:var(--accent)}
.xv-ad-pv.t-preroll .bar i,.xv-ad-pv.t-vast .bar i{background:#f5c518}
.xv-ad-pv-cap{margin:10px 0 0;font-size:12px;line-height:1.4}
.xv-ad-bar{flex:1 0 100%;position:sticky;bottom:0;margin-top:0;padding:12px 0;display:flex;gap:8px;justify-content:flex-end;background:var(--surface-panel);border-top:1px solid var(--border)}
@media (max-width:900px){.xv-ad-side{position:static;max-width:none;flex-basis:100%}}
@media (max-width:640px){.xv-ads-list .sh{display:none}.xv-ads-list th:nth-child(3){display:none}}

/* Top users (claude-design TopUsers.jsx) */
.xv-tu-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:0 0 12px;font-size:13px}
.xv-tu-bar .sp{flex:1}
.xv-tu-bar b{color:var(--text-1)}
.xv-tu-podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 12px}
.xv-tu-card{display:flex;flex-direction:column;gap:12px;min-width:0;padding:16px;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-lg)}
.xv-tu-card.lead{border-color:color-mix(in srgb,var(--accent) 40%,var(--border))}
.xv-tu-card.empty{align-items:center;justify-content:center;border-style:dashed;color:var(--text-3);font-size:13px}
.xv-tu-card .top{display:flex;align-items:center;gap:10px;min-width:0}
.xv-tu-card .top .sp{flex:1}
.xv-tu-card .no{width:24px;height:24px;border-radius:6px;display:grid;place-items:center;font-size:12px;font-weight:800;background:var(--surface-sunken);color:var(--text-2)}
.xv-tu-card.lead .no{background:var(--accent);color:#fff}
.xv-tu-card .who{display:flex;align-items:center;gap:8px;min-width:0;color:var(--text-1);font-weight:700;text-decoration:none}
.xv-tu-card .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.xv-tu-card .val{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.xv-tu-card .val b{font-size:26px;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--text-1)}
.xv-tu-card .val span{font-size:13px;white-space:nowrap}
.xv-tu-card .oth{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px}
.xv-tu-card .oth b{font-weight:600;color:var(--text-2)}
.xv-tu-av{width:28px;height:28px;flex:none;border-radius:50%;display:inline-grid;place-items:center;font-size:11px;font-weight:700;background:oklch(.92 .05 var(--h));color:oklch(.42 .12 var(--h))}
.xv-tu-user{display:inline-flex;align-items:center;gap:10px;min-width:0;color:var(--text-1);font-weight:600;text-decoration:none}
.xv-tu-user .nm{overflow:hidden;text-overflow:ellipsis}
.xv-tu-mv{display:inline-flex;align-items:center;gap:2px;font-size:12px;font-weight:600;white-space:nowrap}
.xv-tu-mv.up{color:var(--ok-text,#1a9e5c)}
.xv-tu-mv.dn{color:var(--danger-text,#d14343)}
.xv-tu-mv.nw{font-size:11px;font-weight:700;color:var(--accent-text)}
.xv-tu-rk{font-variant-numeric:tabular-nums;font-weight:500;color:var(--text-3)}
.xv-tu-rk.top{font-weight:700;color:var(--text-1)}
.xv-tu-n{font-variant-numeric:tabular-nums;color:var(--text-2)}
.xv-tu-n.on{font-weight:700;color:var(--text-1)}
.xv-tu-th{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.xv-tu-th.on{color:var(--text-1)}
.xv-tu-share{display:flex;align-items:center;gap:10px}
.xv-tu-share .bar{flex:1;height:6px;border-radius:3px;background:var(--surface-sunken);overflow:hidden}
.xv-tu-share .bar i{display:block;height:100%;background:var(--accent);border-radius:3px}
.xv-tu-share .pc{width:36px;text-align:right;font-size:12px;color:var(--text-3);font-variant-numeric:tabular-nums}
@media (max-width:900px){.xv-tu-podium{grid-template-columns:minmax(0,1fr)}}

/* Top IPs (claude-design TopIps.jsx) */
.xv-ti-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:0 0 12px}
.xv-ti-bar .sp{flex:1}
.xv-ti-bar .both{display:inline-flex;align-items:center;gap:6px;font-size:13px}
.xv-ti-bar .both i,.xv-ti-row .both{width:6px;height:6px;border-radius:50%;background:var(--accent);flex:none;display:inline-block}
.xv-ti-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));gap:12px;align-items:start}
.xv-ti-panel{min-width:0;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-lg);display:flex;flex-direction:column}
.xv-ti-panel>header{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border)}
.xv-ti-panel>header .sb-ic{color:var(--text-3)}
.xv-ti-panel>header h3{margin:0;font-size:15px;font-weight:600;color:var(--text-1)}
.xv-ti-panel>header .sp{flex:1}
.xv-ti-panel>header span:last-child{font-size:13px;white-space:nowrap}
.xv-ti-panel>header b{color:var(--text-1);font-variant-numeric:tabular-nums}
.xv-ti-row{display:grid;grid-template-columns:28px minmax(170px,auto) minmax(40px,1fr) 92px 32px;align-items:center;column-gap:12px;padding:0 16px;height:44px;border-bottom:1px solid var(--border);transition:background .12s}
.xv-ti-row:last-child{border-bottom:0}
.xv-ti-row.hd{height:auto;padding:6px 16px;font-size:12px;font-weight:600;color:var(--text-3)}
.xv-ti-row.hov{background:color-mix(in srgb,var(--accent) 7%,transparent)}
.xv-ti-row .r{text-align:right}
.xv-ti-row .rk{font-variant-numeric:tabular-nums;font-weight:500;color:var(--text-3)}
.xv-ti-row .rk.top{font-weight:700;color:var(--text-1)}
.xv-ti-row .ip{display:inline-flex;align-items:center;gap:8px;min-width:0;white-space:nowrap}
.xv-ti-row .addr{font-family:var(--font-mono);font-size:12.5px}
.xv-ti-row .bar{height:6px;border-radius:3px;background:var(--surface-sunken);overflow:hidden}
.xv-ti-row .bar i{display:block;height:100%;background:var(--accent);border-radius:3px}
.xv-ti-row .val{line-height:1.2}
.xv-ti-row .val b{display:block;font-variant-numeric:tabular-nums;font-weight:600;color:var(--text-1)}
.xv-ti-row .val small{font-size:11px;white-space:nowrap}
.xv-ti-empty{padding:24px 16px;text-align:center;font-size:13px}
@media (max-width:640px){.xv-ti-row{grid-template-columns:24px minmax(0,1fr) 92px 32px}.xv-ti-row .bar,.xv-ti-row.hd span:nth-child(3){display:none}}

/* Users monitor (claude-design UsersMonitor.jsx) */
.xv-um-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:0 0 12px}
.xv-um-sec{display:flex;align-items:baseline;flex-wrap:wrap;gap:10px;padding:8px 0 10px}
.xv-um-sec h3{margin:0;font-size:15px;font-weight:600;color:var(--text-1);white-space:nowrap}
.xv-um-sec span{font-size:13px;white-space:nowrap}
.xv-um-warn{display:flex;align-items:center;gap:6px;margin:-4px 0 10px;font-size:13px;color:var(--danger-text,#d14343)}
.xv-um .sb-twrap{margin-bottom:20px}
.xv-um-site{display:inline-flex;align-items:center;gap:6px;font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap;color:var(--ok-text,#1a9e5c)}
.xv-um-site.loss{color:var(--danger-text,#d14343)}

/* SQL stats (claude-design SqlStats.jsx) */
.xv-sq-sum{margin:0 0 12px;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-lg);display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.xv-sq-sum>div{min-width:0;padding:14px 20px;border-left:1px solid var(--border);display:flex;flex-direction:column;gap:4px}
.xv-sq-sum>div:first-child{border-left:0}
.xv-sq-sum .l{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--text-3);white-space:nowrap}
.xv-sq-sum b{font-size:24px;line-height:1.15;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--text-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xv-sq-sum .s{font-size:12px;color:var(--text-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.xv-sq-name{font-weight:600;color:var(--text-1)}
.sb-root .xv-sq-empty{width:30px;padding:0;justify-content:center}
.sb-root .xv-sq-empty.armed{background:var(--danger-bg);border-color:var(--danger-text);color:var(--danger-text)}

/* Categories (claude-design Categories.jsx) */
.xv-cat-name{display:inline-flex;align-items:center;gap:8px;min-width:0}
.xv-cat-name .sb-ic{flex:none;color:var(--text-3)}
.xv-cat-descr{color:var(--text-2)}
.xv-cat-order{display:inline-flex;align-items:center;gap:2px}
.xv-cat-order .n{width:24px;font-variant-numeric:tabular-nums;color:var(--text-2)}
.xv-cat-order .sb-rowbtn:disabled{opacity:.3;cursor:default}
.xv-cat-back{width:30px;padding:0;margin-right:8px;justify-content:center;vertical-align:middle}
.xv-cat-form{max-width:720px}
.xv-cat-fields{display:flex;flex-direction:column;gap:14px}
.xv-cat-bar{position:sticky;bottom:0;margin-top:16px;padding:12px 0;display:flex;gap:8px;justify-content:flex-end;background:var(--surface-panel);border-top:1px solid var(--border)}
.xv-cat-fields .sb-input:has(textarea){height:auto;align-items:stretch}
.xv-cat-fields textarea{min-height:84px}
.sb-root a.xv-cat-link{color:var(--text-1);text-decoration:none;font-weight:var(--fw-regular,400)}
.sb-root a.xv-cat-link:hover{text-decoration:underline}

/* Sections: the entries of a list (the description under the name) and the lists themselves */
.sb-table td .xv-cat-descr{display:block;margin-top:2px;font-size:12px;overflow-wrap:anywhere}
.xv-adm-lead{margin:-4px 0 14px;max-width:720px}
.xv-section-key{font-size:12px;color:var(--text-2);white-space:nowrap}
.xv-section-flags{display:inline-flex;flex-wrap:wrap;gap:4px}

/* Names in tables are regular weight; bold is kept for marking what is unread (xfs.css: tr.sb-unread) */
.sb-root a.sb-strong-link,.sb-table td .sb-cell-name a,.sb-files .fld-name a,.sb-files .file-name a,.sb-srv td.sb-srv-name b{font-weight:400}

/* Tags, News, Comments (the design of Categories) */
.sb-root a.xv-adm-link{color:var(--text-1);text-decoration:none;font-weight:400}
.sb-root a.xv-adm-link:hover{text-decoration:underline}
.xv-cmt-text{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--text-2);overflow-wrap:anywhere}
.xv-cmt-mail{overflow-wrap:anywhere}
.xv-adm-back{width:30px;padding:0;margin-right:8px;justify-content:center;vertical-align:middle}
.xv-adm-form{max-width:720px}
.xv-adm-fields{display:flex;flex-direction:column;gap:14px}
.xv-adm-fields .sb-input:has(textarea){height:auto;align-items:stretch}
.xv-adm-fields textarea{min-height:84px}
.xv-adm-bar{position:sticky;bottom:0;margin-top:16px;padding:12px 0;display:flex;gap:8px;justify-content:flex-end;background:var(--surface-panel);border-top:1px solid var(--border)}

/* No bold in tables: names, ids and amounts are regular (or medium for the one that is sorted or ranked);
   bold stays for total rows and unread rows, and for the chips, buttons and headings of empty states */
table tr:not(.sb-total):not(.sb-unread) td b,table tr:not(.sb-total):not(.sb-unread) td strong{font-weight:400}
.xv-sq-name,.xv-ads-name a,.xv-ads-list .b{font-weight:400}
.sb-root .hy-grid .hy-fn,.sb-root .hy-grid tbody tr[data-t] .hy-fn{font-weight:500}
.xv-tu-rk.top,.xv-tu-n.on,.xv-um-site{font-weight:500}

/* Languages, Domains, Translations, Misc (the design of Categories) */
.xv-dom-err{color:var(--danger,#d14343)}
.xv-tr-bar .xv-tr-sel{width:200px}
.xv-tr-bar .xv-tr-sel select{width:100%;border:0;background:transparent;color:var(--text-1);font:inherit;padding:0 10px;height:100%;outline:none}
.xv-tr-cap{margin-left:auto;font-size:12px}
.xv-tr-key{font:var(--fw-medium) 12px/1.3 var(--font-mono);color:var(--text-2);background:none;padding:0;overflow-wrap:anywhere}
.xv-tr-chg td{background:var(--accent-soft)}
.xv-tr-save{align-items:center}
.xv-tr-save .xv-tr-count{color:var(--text-2)}
.xv-tr-save .end{margin-left:auto;display:flex;gap:8px}
.xv-misc{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:14px;align-items:start}
.xv-misc-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.xv-misc-row .sb-input{flex:1 1 160px}
.xv-misc-result{margin-top:14px}
.xv-misc-out{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font:var(--fw-medium) 13px/1.5 var(--font-mono);color:var(--text-1)}
.xv-misc>.sb-section,.xv-misc-result{margin:0}
.xv-misc-result{margin-top:14px}

/* Decode hash (the design of Categories) */
.xv-hash{display:flex;flex-direction:column;gap:14px;max-width:720px}
.xv-hash-form{display:flex;flex-direction:column;gap:14px}
.xv-hash-flag{margin-right:6px}
.xv-lh-agent{overflow-wrap:anywhere}

/* High bandwidth, URL uploads, Featured, Deleted files (the design of Categories) */
.xv-fcell{display:inline-flex;align-items:center;gap:8px;min-width:0;max-width:100%}
.xv-fcell .sb-ic{flex:none;color:var(--text-3)}
.xv-fcell>a,.xv-fcell>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.xv-fcell small{flex:none;font-size:12px}
.xv-bw{display:flex;align-items:center;gap:10px}
.xv-bw-bar{flex:1;height:6px;border-radius:3px;background:var(--surface-sunken,var(--border));overflow:hidden;display:block}
.xv-bw-bar>i{display:block;height:100%;background:var(--accent);border-radius:3px}
.xv-bw .n{min-width:64px;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.xv-url{display:block;max-width:520px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.xv-url-err{font-size:12px;max-width:520px;overflow-wrap:anywhere}
.xv-acts-group{display:inline-flex;gap:4px}
.xv-fres{margin-bottom:12px}


/* Mini player (js/miniplayer.js, index.html): the video the user left keeps playing in the
   bottom right corner, with YouTube-like controls shown over it on hover (or while paused). */
.mp-mini{position:fixed;right:20px;bottom:calc(20px + var(--up-mini-h,0px));z-index:34;width:min(400px,calc(100vw - 24px));aspect-ratio:16/9;background:#000;border-radius:12px;overflow:hidden;box-shadow:0 14px 36px rgba(15,23,42,.35);color:#fff;font-family:var(--hy-font,Manrope,system-ui,sans-serif);line-height:1.3}
.mp-media{position:absolute;inset:0;background:#000}
.mp-media .xv-player{position:absolute;inset:0;width:100%!important;height:100%!important;aspect-ratio:auto!important;border-radius:0!important;background-size:contain;overflow:hidden}
.mp-media video{display:block;width:100%!important;height:100%!important;max-width:none;object-fit:contain!important;background:#000}
.mp-ui{position:absolute;inset:0;opacity:0;transition:opacity .15s ease;pointer-events:none}
.mp-mini:hover .mp-ui,.mp-mini:focus-within .mp-ui{opacity:1}
.mp-grad{position:absolute;left:0;right:0;pointer-events:none}
.mp-grad.top{top:0;height:64px;background:linear-gradient(rgba(0,0,0,.72),transparent)}
.mp-grad.bottom{bottom:0;height:76px;background:linear-gradient(transparent,rgba(0,0,0,.72))}
.mp-top{position:absolute;top:0;left:0;right:0;display:flex;align-items:flex-start;gap:8px;padding:8px 6px 0 12px;pointer-events:auto}
.mp-title{flex:1;min-width:0;color:#fff;font-size:13px;font-weight:600;text-decoration:none;text-shadow:0 1px 2px rgba(0,0,0,.65);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mp-title:hover{text-decoration:underline}
.mp-close{flex:none;width:28px;height:28px;padding:0;border:0;border-radius:50%;background:transparent;color:#fff;font-size:16px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.mp-close:hover{background:rgba(255,255,255,.18)}
.mp-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:46px;height:46px;padding:0;border:0;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:20px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;pointer-events:auto}
.mp-play:hover{background:rgba(0,0,0,.78)}
.mp-bottom{position:absolute;left:0;right:0;bottom:16px;display:flex;align-items:center;gap:10px;padding:0 10px 0 12px;pointer-events:auto;font-size:11px;color:rgba(255,255,255,.9);text-shadow:0 1px 2px rgba(0,0,0,.6)}
.mp-time{white-space:nowrap;font-variant-numeric:tabular-nums}
.mp-open{margin-left:auto;flex:none;padding:2px;border-radius:4px;color:#fff;text-decoration:none;font-size:15px;line-height:1}
.mp-open:hover{background:rgba(255,255,255,.18)}
.mp-title:focus-visible,.mp-close:focus-visible,.mp-play:focus-visible,.mp-open:focus-visible,.mp-prog:focus-visible{outline:2px solid #fff;outline-offset:2px}
.mp-prog{position:absolute;left:0;right:0;bottom:0;z-index:2;display:block;width:100%;height:14px;padding:0;border:0;background:transparent;cursor:pointer;opacity:0;transition:opacity .15s ease}
.mp-mini:hover .mp-prog,.mp-mini:focus-within .mp-prog{opacity:1}
.mp-track{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.35);transition:height .1s ease}
.mp-track i{display:block;height:100%;background:var(--accent);transition:width .1s linear}
.mp-prog:hover .mp-track{height:5px}
body:has(.mp-mini) .sb-toasts{bottom:calc(20px + var(--up-mini-h,0px) + var(--mp-mini-h,0px) + 12px)}
@media (hover:none){.mp-ui,.mp-prog{opacity:1}}
@media (max-width:640px){
  .mp-mini{left:12px;right:12px;bottom:calc(12px + var(--up-mini-h,0px));width:auto}
  body:has(.mp-mini) .sb-toasts{bottom:calc(12px + var(--up-mini-h,0px) + var(--mp-mini-h,0px) + 12px)}
}

/* Encoding queue, transfers (claude-design Encoding.jsx, Transfers.jsx) */
.xv-q-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;padding:0 0 12px}
.sb-root a.xv-q-tile{min-width:0;display:flex;flex-direction:column;gap:6px;padding:12px 14px;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-lg);color:inherit;text-decoration:none}
.sb-root a.xv-q-tile:hover{border-color:var(--border-strong)}
.sb-root a.xv-q-tile.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.xv-q-tile .top{display:flex;align-items:center;gap:8px;min-height:26px}
.xv-q-tile .sp{flex:1}
.xv-q-tile .acts{display:inline-flex;gap:2px}
.xv-q-tile .sb-rowbtn:disabled,.xv-q-prio .sb-rowbtn:disabled{opacity:.35;cursor:default;background:none}
.xv-q-tile .cnt{display:flex;align-items:baseline;gap:8px;min-width:0}
.xv-q-tile .cnt .sb-muted{font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}
.xv-q-tile b{font-size:26px;line-height:1.1;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--text-1)}
.xv-q-tile b.zero{color:var(--text-3)}
.xv-q-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:12px;align-items:start;padding:0 0 12px}
.xv-q-panel{min-width:0;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-lg);display:flex;flex-direction:column}
.xv-q-panel>header{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--border)}
.xv-q-panel>header .sb-ic{color:var(--text-3)}
.xv-q-panel>header h3{margin:0;font-size:15px;font-weight:600;color:var(--text-1);white-space:nowrap}
.xv-q-panel>header .sp{flex:1}
.xv-q-panel>header .sb-muted{font-size:13px;white-space:nowrap}
.xv-q-panel .mono,.xv-q-tbl .mono{font-family:var(--font-mono);font-size:12.5px;white-space:nowrap}
.xv-q-panel .r{text-align:right}
.xv-q-panel .n,.xv-q-n{font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}
.sb-root a.xv-q-host,.sb-root a.xv-q-srv{display:grid;align-items:center;column-gap:12px;padding:0 16px;height:46px;border-bottom:1px solid var(--border);color:var(--text-1);text-decoration:none}
.sb-root a.xv-q-host{grid-template-columns:minmax(0,1fr) 120px 48px 64px}
.sb-root a.xv-q-srv{grid-template-columns:minmax(56px,auto) minmax(40px,1fr) 64px 76px 84px;height:44px}
.sb-root a.xv-q-host:hover,.sb-root a.xv-q-srv:hover{background:var(--surface-hover)}
.sb-root a.xv-q-host.on,.sb-root a.xv-q-srv.on{background:color-mix(in srgb,var(--accent) 8%,transparent)}
.xv-q-panel>a:last-of-type{border-bottom:0}
.xv-q-host .nm{display:flex;align-items:center;gap:8px;min-width:0}
.xv-q-host .nm .mono{overflow:hidden;text-overflow:ellipsis}
.xv-q-host .dot{width:7px;height:7px;border-radius:50%;flex:none;background:var(--text-3)}
.xv-q-host .dot.busy{background:var(--ok-solid)}
.xv-q-host .slots{display:flex;gap:3px}
.xv-q-host .slots i{flex:1;height:6px;border-radius:3px;background:var(--surface-sunken)}
.xv-q-host .slots i.on{background:var(--accent)}
.xv-q-host .fps{font-size:12px}
.xv-q-srv .nm{font-weight:500;overflow:hidden;text-overflow:ellipsis}
.xv-q-srv .bar{height:6px;border-radius:3px;background:var(--surface-sunken);overflow:hidden}
.xv-q-srv .bar i{display:block;height:100%;background:var(--accent);border-radius:3px}
.xv-q-srv .bad{color:var(--danger-text)}
.xv-q-empty{padding:24px 16px;text-align:center;font-size:13px}
.xv-q-move{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 16px;border-top:1px solid var(--border);font-size:13px;color:var(--text-2)}
.xv-q-move.solo{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface-raised);margin:0 0 12px}
.xv-q-move .sb-input{height:30px;width:auto}
.xv-q-move .sb-input.num{width:72px}
.xv-q-move select{border:0;background:transparent;color:var(--text-1);font:inherit;height:100%;outline:none;max-width:220px}
.xv-q-move input{width:100%}
.xv-q-qual{padding:16px;display:flex;flex-direction:column;gap:14px}
.xv-q-qual .stack{display:flex;height:10px;border-radius:5px;overflow:hidden;gap:2px;background:var(--surface-sunken)}
.xv-q-qual .legend{display:grid;grid-template-columns:repeat(auto-fit,minmax(64px,1fr));gap:8px}
.xv-q-qual .legend>div{display:flex;flex-direction:column;gap:2px}
.xv-q-qual .l{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-2);white-space:nowrap}
.xv-q-qual .l i{width:8px;height:8px;border-radius:2px;flex:none}
.xv-q-qual b{font-size:18px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--text-1)}
.xv-q-qual b.zero{color:var(--text-3)}
.xv-q-qual .q0{background:var(--text-3)}
.xv-q-qual .q1{background:color-mix(in srgb,var(--accent) 50%,transparent)}
.xv-q-qual .q2{background:var(--accent)}
.xv-q-qual .q3{background:var(--text-1)}
.xv-q-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:0 0 10px}
.xv-q-bar .sb-chip{text-decoration:none}
.xv-q-tbl .sb-cell-name a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.xv-q-tbl .sb-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.xv-q-prog{display:flex;align-items:center;gap:8px}
.xv-q-prog .sb-meter{flex:1}
.xv-q-prog .xv-q-n{width:34px;text-align:right;color:var(--text-2)}
.xv-q-prio{display:inline-flex;align-items:center;gap:2px}
.xv-q-prio .n{width:22px;text-align:center;font-variant-numeric:tabular-nums;color:var(--text-3)}
.xv-q-prio .n.on{color:var(--text-1);font-weight:500}
.xv-q-err{display:block;max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:var(--danger-text)}
.xv-q-err.warn{color:var(--warn-text)}
.xv-q-route{display:inline-flex;align-items:center;gap:6px;color:var(--text-1)}
.xv-q-route .sb-ic{color:var(--text-3)}
.xv-q-acts{display:inline-flex;gap:2px;justify-content:flex-end}
@media (max-width:640px){.sb-root a.xv-q-srv{grid-template-columns:minmax(56px,1fr) 56px 76px 84px}.xv-q-srv .bar{display:none}}
.xv-q-bar .sb-seg{max-width:100%;overflow-x:auto;scrollbar-width:none}
.xv-q-bar .sb-seg a{flex:none}

/* Manage servers, host and disk forms (claude-design ServersXVS.jsx) */
.xv-sv-warn{margin:0 0 12px}
.xv-sv-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;padding:0 0 12px}
.xv-sv-stats>div{min-width:0;padding:12px 16px;display:flex;flex-direction:column;gap:4px;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-lg)}
.xv-sv-stats .l{font-size:12px;color:var(--text-3)}
.xv-sv-stats b{font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--text-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xv-sv-stats .bad{font-size:12px;color:var(--danger-text)}
.xv-sv-stats .sb-meter{margin-top:2px}
.xv-sv-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:0 0 12px}
.xv-sv-bar .sp{flex:1}
.xv-sv-q{flex:1 1 240px;max-width:320px;padding-left:10px;gap:6px}
.xv-sv-q .sb-ic{color:var(--text-3);flex:none}
.xv-sv-cmd{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.xv-sv-cmd .sb-muted{font-size:13px;white-space:nowrap}
.xv-sv-cmd .sb-input select,.xv-sv-st select{border:0;background:transparent;color:inherit;font:inherit;height:100%;padding:0 8px;outline:none}
.xv-sv-cmd .sb-input:first-of-type{width:130px}
.xv-sv-cmd .sb-input{width:200px}
.xv-sv-cmd .sb-input select{width:100%}
.xv-sv-hosts{display:flex;flex-direction:column;gap:12px;padding:0 0 20px}
.xv-sv-card{min-width:0;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}
.xv-sv-log{margin:0 0 12px}
.xv-sv-log>header{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid var(--border)}
.xv-sv-log>header .sb-ic{color:var(--text-3)}
.xv-sv-log>header h3{margin:0;font-size:15px;font-weight:600;color:var(--text-1)}
.xv-sv-log>header .sp{flex:1}
.xv-sv-log .bd{padding:12px 16px;font:var(--fw-medium) 12.5px/1.6 var(--font-mono);color:var(--text-2);max-height:260px;overflow:auto;overflow-wrap:anywhere}
.xv-sv-hh{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 16px}
.xv-sv-hh .ic{width:36px;height:36px;border-radius:var(--radius-md);display:grid;place-items:center;background:var(--surface-sunken);color:var(--text-2);flex:none}
.xv-sv-hh .who{display:flex;flex-direction:column;gap:3px;min-width:0}
.xv-sv-hh .t{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.xv-sv-hh .t b{font-size:16px;font-weight:700;color:var(--text-1)}
.xv-sv-hh .t .mono{font-family:var(--font-mono);font-size:13px;color:var(--text-2)}
.xv-sv-hh .s{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;font-variant-numeric:tabular-nums}
.xv-sv-hh .s>span{display:inline-flex;align-items:center;gap:3px;white-space:nowrap}
.xv-sv-hh .s .sb-ic{width:11px;height:11px}
.xv-sv-hh .s .bad{color:var(--warn-text)}
.xv-sv-hh .sp{flex:1}
.xv-sv-hh .acts{display:flex;gap:6px}
.sb-root .xv-sv-ib{width:32px;padding:0;justify-content:center}
.xv-sv-card>.sb-tscroll{border-top:1px solid var(--border)}
.xv-sv-tbl{min-width:860px}
.xv-sv-tbl td{height:52px}
.xv-sv-tbl .mono.nm{font-family:var(--font-mono);font-size:13px;font-weight:600;color:var(--text-1);white-space:nowrap}
.xv-sv-flt{margin-left:6px;vertical-align:-2px}
.xv-sv-n{font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}
.xv-sv-n b{font-weight:600;color:var(--text-1)}
td.xv-sv-n.warn{color:var(--warn-text)}
.xv-sv-st{height:28px;width:118px;font-size:13px;font-weight:500}
.xv-sv-st select{width:100%;padding:0 6px}
.xv-sv-st.on{color:var(--ok-text)}.xv-sv-st.readonly{color:var(--warn-text)}.xv-sv-st.off{color:var(--text-3)}
.xv-sv-space{display:flex;flex-direction:column;gap:4px;min-width:0}
.xv-sv-qs{display:flex;flex-wrap:wrap;gap:4px}
.xv-sv-qs a.sb-badge{text-decoration:none}
.xv-sv-acts{display:inline-flex;gap:2px;justify-content:flex-end}
.xv-sv-acts .sb-rowbtn:disabled{opacity:.35;cursor:default;background:none}
.xv-sv-acts a.sb-rowbtn{text-decoration:none}
.xv-sv-none td{height:64px;text-align:center}
.xv-sv-form{max-width:900px}
.xv-sv-fields{display:flex;flex-direction:column;gap:12px}
.xv-sv-fields .sb-section+.sb-section{margin-top:0}
.xv-sv-fields .bd{padding:16px}
.xv-sv-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:14px}
.xv-sv-grid.sm{grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr))}
.xv-sv-who{display:flex;flex-direction:column;gap:14px}
.xv-sv-who .tl{display:flex;flex-direction:column}
.xv-sv-who .tl .sb-muted{font-size:12px;font-weight:400}
.xv-cdn-test{grid-column:1/-1;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.xv-sv-tests{border-color:var(--danger-line,var(--danger-text))}
.xv-sv-tests ul{margin:0;list-style:none;display:flex;flex-direction:column;gap:6px;font-size:13px}
.xv-sv-tests li{display:flex;align-items:flex-start;gap:6px;overflow-wrap:anywhere}
.xv-sv-tests li.ok{color:var(--ok-text)}.xv-sv-tests li.err{color:var(--danger-text)}
.xv-sv-tests li .sb-ic{flex:none;margin-top:2px}
.xv-sv-hostmeta{display:inline-flex;align-items:center;gap:6px}
.xv-sv-hostmeta .mono{font-family:var(--font-mono);font-size:12px}
.xv-sv-form .xv-adm-bar .xv-sv-delh{margin-right:auto}
@media (max-width:640px){.xv-sv-cmd,.xv-sv-q{flex:1 1 100%;max-width:none}.xv-sv-cmd .sb-input{flex:1;width:auto}}

/* Payouts (the design of XFS admin_payments) */
.xv-pay-acc{overflow-wrap:anywhere;max-width:320px}

/* Latest views, referrer views (the design of XFS admin_downloads) */
.xv-vw-tbl .sb-cell-name{gap:6px}
.xv-vw-tbl .sb-cell-name>span:first-of-type{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.xv-vw-tbl .sb-cell-name .sb-badge{flex:none}
.xv-vw-w{display:flex;align-items:center;gap:8px}
.xv-vw-w .sb-meter{flex:1}
.xv-vw-w .n,.xv-rv-bar .n{width:38px;text-align:right;font-size:12.5px;font-variant-numeric:tabular-nums;color:var(--text-2)}
.xv-vw-ref{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.xv-vw-ref a{color:inherit}
.xv-vw-ip{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.xv-rv-rk{font-variant-numeric:tabular-nums;color:var(--text-3)}
.xv-rv-rk.top{color:var(--text-1);font-weight:500}
.xv-rv-name{font-family:var(--font-mono);font-size:12.5px;color:var(--text-1);overflow-wrap:anywhere}
.xv-rv-bar{display:flex;align-items:center;gap:8px}
.xv-rv-bar .sb-meter{flex:1}
.xv-rv-n{font-variant-numeric:tabular-nums}
.xv-rv-note{font-size:12.5px}

/* Misc: memcached (claude-design Diagnostics.jsx), IP lists, image proxy */
.xv-misc2{display:flex;flex-direction:column;gap:12px;padding-bottom:20px}
.xv-misc2>.sb-ph{margin-bottom:-12px}
.xv-misc2 .sb-section+.sb-section{margin-top:0}
.xv-misc2 .sb-section>header p.mono{font-family:var(--font-mono)}
.xv-misc2 .sb-section>.bd{padding:16px}
.xv-misc2 .sb-section>.bd.p0{padding:0}
.xv-mc-down{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--text-2)}
.xv-mc-bd{display:flex;flex-direction:column;gap:16px}
.xv-mc-rate{display:grid;grid-template-columns:auto minmax(0,1fr);gap:24px;align-items:center}
.xv-mc-rate .l{display:block;font-size:12px;color:var(--text-2)}
.xv-mc-rate b{font-size:36px;line-height:1.1;font-weight:700;font-variant-numeric:tabular-nums}
.xv-mc-rate b.ok{color:var(--ok-text)}.xv-mc-rate b.warn{color:var(--warn-text)}.xv-mc-rate b.bad{color:var(--danger-text)}
.xv-mc-rate .trk{display:flex;height:10px;border-radius:5px;overflow:hidden;background:var(--surface-sunken)}
.xv-mc-rate .hit{display:block;background:var(--ok-text)}
.xv-mc-rate .miss{display:block;flex:1;background:var(--danger-text);opacity:.55}
.xv-mc-rate .lg{display:flex;justify-content:space-between;margin-top:6px;font-size:12px;color:var(--text-2);font-variant-numeric:tabular-nums}
.xv-mc-groups{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:12px}
.xv-mc-g{border:1px solid var(--border);border-radius:var(--radius-lg);min-width:0}
.xv-mc-g h3{margin:0;padding:10px 16px;border-bottom:1px solid var(--border);font-size:13px;font-weight:700;color:var(--text-1)}
.xv-mc-g .st{display:grid}
.xv-mc-g .st.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.xv-mc-g .st.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.xv-mc-g .st>div{padding:12px 16px;min-width:0;display:flex;flex-direction:column;gap:2px}
.xv-mc-g .st .l{font-size:12px;color:var(--text-2)}
.xv-mc-g .st b{font-size:20px;line-height:1.3;font-weight:700;font-variant-numeric:tabular-nums;color:var(--text-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xv-mc-g .st .h{font-size:12px;color:var(--text-3)}
.xv-misc-note{margin:0}
.xv-misc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,480px),1fr));gap:12px;align-items:stretch}
.xv-misc-grid>.sb-section{display:flex;flex-direction:column;min-width:0}
.xv-misc-grid>.sb-section>.bd:last-child,.xv-misc-grid .xv-misc-ips{flex:1}
.xv-misc-check{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px}
.xv-misc2 .mono{font-family:var(--font-mono);font-size:12.5px}
.xv-misc-dbs td{height:40px}
.xv-misc-dbs td:first-child{padding-left:16px}
.xv-misc-dbs td:last-child{padding-right:16px;white-space:nowrap}
.xv-misc-dbs .sb-badge{margin-left:6px}
.xv-misc-n{font-variant-numeric:tabular-nums}
.xv-misc-list>.bd{padding-bottom:12px}
.xv-misc-ips{border-top:1px solid var(--border);max-height:280px;overflow:auto}
.xv-misc-ips .it{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 10px 0 16px;height:38px;border-bottom:1px solid var(--border-row)}
.xv-misc-ips .it:last-child{border-bottom:0}
.xv-misc-ips .none{padding:14px 16px;font-size:13px}
.xv-misc-proxy .xv-misc-out{max-height:220px;overflow:auto}
@media (max-width:767px){.xv-mc-groups{grid-template-columns:minmax(0,1fr)}.xv-mc-g .st.c4{grid-template-columns:repeat(2,minmax(0,1fr))}.xv-mc-rate{grid-template-columns:minmax(0,1fr);gap:10px}}
/* Blacklist | databases, then whitelist | check IP */
.xv-misc-grid>.xv-misc-black{order:1}.xv-misc-grid>.sb-section:not(.xv-misc-list):not(.xv-misc-chk){order:2}.xv-misc-grid>.xv-misc-white{order:3}.xv-misc-grid>.xv-misc-chk{order:4}