/* Hide upstream account navigation without touching player controls. */
.sidebar,
[data-testid="app-fab-btn"],
.XSaveIcon,
button:has([data-beeg-guest-action]),
a:has([data-beeg-guest-action]),
[role="button"]:has([data-beeg-guest-action]),
button:has([data-testid="user-icon"]),
button:has([data-testid="user-avatar"]),
[data-beeg-member-hidden] {
    display: none !important;
}
.tubiao { width: 100%; box-sizing: border-box; }
.tubiao .ribbon-slot {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
    max-width: 1320px;
    margin: 12px auto;
}
.tubiao .ribbon-link { display: block; min-width: 0; overflow: hidden; border-radius: 6px; line-height: 0; }
.tubiao .ribbon-link img { display: block; width: 100%; height: auto; }
.tubiao #tile-deck:empty, .tubiao .ribbon-slot:empty,
.tubiao #tile-deck[hidden], .tubiao .ribbon-slot[hidden] { display: none !important; }
.tubiao #tile-deck .container-outer.mobile-only { display: block !important; }
.tubiao #tile-deck .container-inner { width: 100%; max-width: none; padding: 0; }
.tubiao .tile-picture { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 12px; }
.tubiao .tile-contact { display: block; margin-top: 14px; text-align: center; color: #c2d6e5; font-size: 12px; }
@media (max-width: 768px) {
    .tubiao .ribbon-slot { grid-template-columns: minmax(0, 1fr); gap: 6px; }
}
.tubiao[data-beeg-positioned] { margin: 12px 0 16px; }
.tubiao .container-outer {
    margin: 0 auto;
    padding: 16px 12px 12px;
    max-width: 1320px;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 18px;
    background: linear-gradient(145deg, #1b2026, #11151a 70%);
}
.tubiao .tile-grid,
.tubiao .tile-remainder {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px 10px;
    padding: 0;
    max-width: none;
}
.tubiao .tile-remainder { grid-column: 1 / -1; }
.tubiao .tile-entry {
    width: auto;
    height: auto;
    min-width: 0;
    gap: 7px;
}
.tubiao .tile-frame {
    width: 100%;
    max-width: 68px;
    border-radius: 15px;
    background: #232a32;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .22), 0 0 0 1px rgba(255, 255, 255, .1);
    transition: transform .18s ease, box-shadow .18s ease;
}
.tubiao .tile-frame a { display: block; width: 100%; height: 100%; }
.tubiao .tile-caption {
    width: 100%;
    max-width: 100%;
    margin: 0;
    color: #dfe5eb;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: .02em;
}
.tubiao .tile-frame:focus-within {
    outline: 2px solid #a9c9df;
    outline-offset: 4px;
}
@media (hover: hover) {
    .tubiao .tile-entry:hover .tile-frame {
        transform: translateY(-3px);
        box-shadow: 0 7px 16px rgba(0, 0, 0, .3), 0 0 0 1px rgba(255, 255, 255, .22);
    }
    .tubiao .tile-entry:hover .tile-caption { color: #fff; }
}
@media (min-width: 769px) {
    .tubiao .tile-grid, .tubiao .tile-remainder { grid-template-columns: repeat(10, minmax(0, 1fr)); }
    .tubiao .container-outer { padding: 20px; }
}
@media (max-width: 380px) {
    .tubiao .container-outer { padding: 12px 8px; border-radius: 14px; }
    .tubiao .tile-grid, .tubiao .tile-remainder { gap: 12px 8px; }
    .tubiao .tile-frame { border-radius: 12px; }
    .tubiao .tile-caption { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
    .tubiao .tile-frame { transition: none; }
    .tubiao .tile-entry:hover .tile-frame { transform: none; }
}
@media (min-width: 1280px) {
    [class~="lg:tw-ml-[72px]"] { margin-left: 0 !important; }
    [class~="lg:[--sidebar-width:72px]"] { --sidebar-width: 0px !important; }
    [class~="lg:tw-pl-24"] { padding-left: 24px !important; }
}
