@charset "UTF-8";
/* CSS Document */

	
/* MIRAI — Media/Blog grid update (V26) */
#media-blog .mirai-blog-cover {
    overflow: hidden
}
#media-blog .mirai-blog-cover img {
    width: 100%;
    display: block;
    object-fit: cover
}
#media-blog .mirai-blog-title {
    margin: 0 0 .5rem 0
}
#media-blog .mirai-blog-actions {
    margin: .75rem 0 0;
    display: flex;
    flex-direction: column;
    gap: .35rem
}
#media-blog .mirai-blog-actions a {
    display: inline-flex;
    align-items: center;
    gap: .35rem
}
#media-blog .mirai-blog-preview {
    font-weight: 600;
    opacity: .86;
    text-decoration: none
}
#media-blog .mirai-blog-preview:hover {
    opacity: 1;
    text-decoration: underline
}
#media-blog .mirai-blog-author .author-name {
    font-weight: 600
}
#media-blog .mirai-blog-card {
    transition: transform .25s ease, box-shadow .25s ease
}
#media-blog .mirai-blog-card:hover {
    transform: translateY(-4px)
}
#media-blog .mirai-blog-chip {
    display: inline-flex;
    align-items: center;
    padding: .15rem .55rem;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,.12);
    font-size: .75rem;
    line-height: 1.4;
    opacity: .85
}
#media-blog .mirai-blog-metaRow {
    display: flex;
    gap: .5rem;
    align-items: center;
    flex-wrap: wrap;
    margin: .35rem 0 .75rem
}
/* Reader modal: when used as preview (no new-tab) */
#miraiBlogReaderModal.is-preview #miraiBlogReaderOpenNewTab {
    display: none!important
}
/* UX refinements */
#media-blog .mirai-blog-preview::after {
    content: "→";
    margin-left: .35rem
}
#media-blog .mirai-blog-coverLink {
    display: block;
    position: relative;
    cursor: zoom-in
}
#media-blog .mirai-blog-coverLink::after {
    content: "\f00e"; /* fa-magnifying-glass-plus */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    right: 12px;
    bottom: 12px;
    width: 36px;
    height: 36px;
    border-radius: 14px;
    background: rgba(0,0,0,.45);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transform: translateY(6px);
    transition: opacity .2s ease, transform .2s ease;
    backdrop-filter: blur(10px)
}
#media-blog .mirai-blog-card:hover .mirai-blog-coverLink::after {
    opacity: 1;
    transform: translateY(0)
}
#media-blog .mirai-blog-cover img {
    transition: transform .35s ease
}
#media-blog .mirai-blog-card:hover .mirai-blog-cover img {
    transform: scale(1.04)
}
#media-blog .mirai-blog-chip i {
    margin-right: .35rem;
    opacity: .8
}
#media-blog .mirai-blog-chip .k {
    font-weight: 600;
    margin-right: .25rem
}
#media-blog .mirai-blog-chip.is-tags {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}
#media-blog .mirai-blog-filterBar {
    display: flex;
    gap: .5rem;
    align-items: center;
    flex-wrap: nowrap;
    overflow: auto;
    padding: .25rem 0 .75rem;
    margin: 0 0 .5rem;
    scrollbar-width: none
}
#media-blog .mirai-blog-filterBar::-webkit-scrollbar {
display:none
}
#media-blog .mirai-blog-filterBtn {
    border: 1px solid rgba(0,0,0,.12);
    background: rgba(0,0,0,.03);
    border-radius: 999px;
    padding: .35rem .75rem;
    font-size: .8rem;
    white-space: nowrap;
    transition: transform .15s ease, background .15s ease, border-color .15s ease
}
#media-blog .mirai-blog-filterBtn:hover {
    transform: translateY(-1px)
}
#media-blog .mirai-blog-filterBtn[aria-pressed="true"] {
    background: rgba(0,0,0,.08);
    border-color: rgba(0,0,0,.25)
}
#media-blog .mirai-blog-card.is-filtered-out {
    opacity: .15;
    transform: scale(.985);
    pointer-events: none
}