.tmk-now{width:100%;max-width:560px;margin:.75rem auto 1.5rem;color:#2e2930;text-align:center}
.tmk-now__stage{position:relative;width:100%;aspect-ratio:9/16;overflow:hidden;border-radius:20px;background:#f3eef2;box-shadow:0 12px 36px rgba(35,24,32,.12)}
.tmk-now__media{display:block;width:100%;height:100%;object-fit:cover;background:#eee}
.tmk-now__image{user-select:none;-webkit-user-drag:none}
.tmk-now__rare{position:absolute;z-index:3;top:14px;left:14px;padding:5px 10px;border:1px solid #ffffffaa;border-radius:999px;background:#332a31cc;color:#fff;font-size:11px;font-weight:800;letter-spacing:.12em;line-height:1;pointer-events:none}
.tmk-now__loading,.tmk-now__empty{display:grid;place-items:center;width:100%;height:100%;padding:2rem;box-sizing:border-box;color:#746b72}
.tmk-now__play,.tmk-now__link{position:absolute;left:50%;transform:translateX(-50%);min-height:48px;border:0;border-radius:999px;padding:12px 22px;font:inherit;font-weight:700;box-sizing:border-box}
.tmk-now__play{top:50%;transform:translate(-50%,-50%);background:rgba(255,255,255,.92);color:#332a31}
.tmk-now__link{z-index:2;bottom:18px;background:#fff;color:#332a31;text-decoration:none;box-shadow:0 4px 18px rgba(0,0,0,.18)}
.tmk-now__status{min-height:1.5em;margin:.75rem 0 0;color:#756d73;font-size:.9rem}
/* Cocoon adds article-oriented UI around a fixed page. On the dedicated
   Tomoka Now page, keep the experience focused on the character and video. */
body.tmk-now-page .sns-share,
body.tmk-now-page .sns-follow,
body.tmk-now-page .date-tags,
body.tmk-now-page .post-date,
body.tmk-now-page .author-box,
body.tmk-now-page .footer-meta,
body.tmk-now-page .author-info,
body.tmk-now-page .post-author,
body.tmk-now-page .post-navi,
body.tmk-now-page .related-entry-heading,
body.tmk-now-page .related-list,
body.tmk-now-page .breadcrumb{
    display:none!important;
}
body.tmk-now-page .entry-title{
    margin-bottom:.35em;
    font-size:clamp(1.45rem,7vw,2rem);
    line-height:1.35;
}
body.tmk-now-page .entry-content{
    margin-top:0;
}
@media(max-width:600px){
    .tmk-now{max-width:min(100%,420px);margin:.5rem auto 1.25rem}
    .tmk-now__stage{border-radius:14px}
    body.tmk-now-page .article{padding-top:1rem}
}
/* Small site-wide companion, clear of the mobile navigation and safe area. */
.tmk-float[hidden]{display:none!important}
.tmk-now.tmk-float{position:fixed;z-index:990;right:12px;bottom:calc(94px + env(safe-area-inset-bottom,0px));width:112px;max-width:28vw;margin:0}
.tmk-float .tmk-now__stage{border-radius:14px;box-shadow:0 5px 22px #302a3033}
.tmk-float .tmk-now__status{display:none}
.tmk-float__close{position:absolute;z-index:4;right:-6px;top:-28px;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:#302a30;color:white;font:24px/44px sans-serif;cursor:pointer}
.tmk-float .tmk-now__link{inset:0;transform:none;border-radius:14px;padding:0;background:transparent;color:transparent;font-size:0;box-shadow:none}
.tmk-float .tmk-now__link:focus-visible{outline:3px solid #80658b;outline-offset:-3px}
.tmk-float .tmk-now__play{z-index:2;width:100%;padding:8px 2px;font-size:12px}
.tmk-float .tmk-now__rare{top:6px;left:6px;padding:4px 6px;font-size:8px}
@media(min-width:768px){.tmk-now.tmk-float{width:140px;bottom:24px;right:24px}}
@media(max-height:450px){.tmk-now.tmk-float{width:76px;bottom:80px}}
