/*
Theme Name: REALITY Basketball
Theme URI: https://lucent-works.com
Author: LUCENT
Author URI: https://lucent-works.com
Description: REALITYバスケ部 メンバー募集サイト用オリジナルテーマ。画像・URLはカスタマイザー、メンバー／お知らせ／活動記録は管理画面から編集できます。
Version: 1.5.2
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: reality
*/

/* ---------- Theme base (single-page theme) ---------- */
body{margin:0;}
body.admin-bar #rbb-scope .nav{top:32px;}
@media (max-width:782px){ body.admin-bar #rbb-scope .nav{top:46px;} }
@media (max-width:600px){ body.admin-bar #rbb-scope .nav{top:0;} }

/* ---------- Original design (unchanged) ---------- */

  #rbb-scope{
    --navy:#12163A;
    --court-blue:#3E8EFF;
    --sky-blue:#6FC0FF;
    --violet:#9B6BE8;
    --hot-pink:#FF6FE0;
    --soft-pink:#FFB0EF;
    --pale-pink:#FDEBFC;
    --ink:#151726;
    --paper:#FBFAFE;
    --line: rgba(16,26,61,0.10);
  }
  #rbb-scope *{box-sizing:border-box; margin:0; padding:0;}
  /* WordPress "Custom HTML" block embedding: kill the stray
     margin-block-start the block editor injects on flow content. */
  :root :where(.is-layout-flow) > *{
    margin-block-start:0 !important;
  }
  #rbb-scope section[id]{ scroll-margin-top:80px; }
  html{scroll-behavior:smooth; overflow-x:clip;}
  #rbb-scope{
    font-family:'Noto Sans JP', sans-serif;
    color:var(--ink);
    background:var(--paper);
    line-height:1.8;
    -webkit-font-smoothing:antialiased;
    overflow-x:clip;
  }
  #rbb-scope h1,
  #rbb-scope h2,
  #rbb-scope h3,
  #rbb-scope .display{
    font-family:'Zen Kaku Gothic New', sans-serif;
    letter-spacing:0.01em;
  }
  #rbb-scope a{color:inherit;}
  #rbb-scope img{max-width:100%; display:block;}
  #rbb-scope .wrap{max-width:1040px; margin:0 auto; padding:0 24px;}

  /* ---------- NAV ---------- */
  #rbb-scope .nav{
    position:sticky; top:0; z-index:50;
    background:rgba(251,250,254,0.86);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  #rbb-scope .nav .wrap{
    display:flex; align-items:center; justify-content:space-between;
    height:68px;
    position:relative;
  }
  #rbb-scope .nav .logo{
    font-family:'Zen Kaku Gothic New', sans-serif;
    font-weight:900; font-size:1.15rem;
    display:flex; align-items:center; gap:8px;
    text-decoration:none;
    cursor:pointer;
    outline:none;
  }
  #rbb-scope .nav .logo .mark{
    height:44px; width:auto;
    display:block;
  }
  #rbb-scope .nav .cta{
    font-size:0.85rem; font-weight:700;
    background:var(--ink); color:#fff;
    padding:9px 18px; border-radius:100px;
    text-decoration:none;
    white-space:nowrap;
    outline:none;
  }
  #rbb-scope .nav-links{
    display:flex; align-items:center; gap:22px;
    overflow-x:auto;
    scrollbar-width:none;
    -ms-overflow-style:none;
    max-width:70%;
  }
  #rbb-scope .nav-links::-webkit-scrollbar{display:none;}
  #rbb-scope .nav-links a{
    font-size:0.88rem; font-weight:700;
    color:var(--ink);
    text-decoration:none;
    white-space:nowrap;
    position:relative;
    padding:4px 0;
    outline:none;
  }
  #rbb-scope .nav-links a::after{
    content:'';
    position:absolute; left:0; bottom:-2px;
    width:0; height:2px;
    background:linear-gradient(90deg, var(--court-blue), var(--hot-pink));
    transition:width 0.2s ease;
  }
  #rbb-scope .nav-links a:hover::after{ width:100%; }
  #rbb-scope .nav-burger{
    display:none;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:1px;
    width:48px; height:52px;
    border:none;
    outline:none;
    background:none;
    cursor:pointer;
    padding:0;
    -webkit-tap-highlight-color:transparent;
  }
  #rbb-scope .nav-burger::-moz-focus-inner{ border:0; }
  #rbb-scope .nav-burger img{
    width:26px; height:26px;
    display:block;
    transition:transform 0.3s ease;
  }
  #rbb-scope .nav-burger.open img{ transform:rotate(90deg); }
  #rbb-scope .nav-burger-label{
    font-size:0.6rem;
    font-weight:400;
    letter-spacing:0.05em;
    color:#E8720C;
  }

  /* ---------- HERO ---------- */
  #rbb-scope .hero{
    position:relative;
    overflow:hidden;
    width:100%;
    height:650px;
    background:#12163A;
    color:#fff;
  }
  #rbb-scope .hero .wrap{position:relative; z-index:2;}
  #rbb-scope .hero-slides{
    position:absolute; inset:0;
    z-index:0;
  }
  #rbb-scope .hero-slide{
    position:absolute; inset:0;
    background-size:cover;
    background-repeat:no-repeat;
    background-position:0% 25%;
    background-color:#12163A;
    opacity:0;
    transition:opacity 1.2s ease;
  }
  #rbb-scope .hero-slide.active{
    opacity:1;
    animation:hero-pan 22s ease-in-out infinite;
  }
  @keyframes hero-pan{
    0%{ background-position:0% 10%; }
    50%{ background-position:100% 40%; }
    100%{ background-position:0% 10%; }
  }
  @media (prefers-reduced-motion: reduce){
    #rbb-scope .hero-slide.active{ animation:none; }
  }
  #rbb-scope .visually-hidden{
    position:absolute !important;
    width:1px; height:1px;
    padding:0; margin:-1px;
    overflow:hidden;
    clip:rect(0,0,0,0);
    white-space:nowrap;
    border:0;
  }
  #rbb-scope .hero-copy{max-width:640px;}
  #rbb-scope .eyebrow-plain{
    font-size:0.95rem; font-weight:500; opacity:0.85; margin-bottom:18px;
  }
  #rbb-scope .hero h1{
    font-size:clamp(2.1rem, 3.6vw, 3.4rem);
    font-weight:900;
    line-height:1.3;
  }
  #rbb-scope .hero h1 .accent{
    background:linear-gradient(100deg, var(--sky-blue), var(--violet) 55%, var(--soft-pink));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  #rbb-scope .hero p.lead{
    margin-top:26px;
    font-size:1.08rem;
    max-width:42ch;
    opacity:0.92;
  }
  #rbb-scope .hero-tags{
    display:flex; flex-wrap:wrap; gap:10px;
    margin-top:34px;
  }
  #rbb-scope .tag{
    font-size:0.85rem; font-weight:500;
    padding:8px 16px;
    border:1px solid rgba(255,255,255,0.35);
    border-radius:100px;
    background:rgba(255,255,255,0.06);
  }
  #rbb-scope .hero-actions{
    margin-top:42px;
    display:flex; gap:14px; flex-wrap:wrap;
  }
  #rbb-scope .btn-primary{
    display:inline-block;
    background:linear-gradient(100deg, var(--violet), var(--hot-pink));
    color:#fff; font-weight:700;
    padding:15px 30px;
    border-radius:100px;
    text-decoration:none;
    box-shadow:0 14px 30px -10px rgba(255,111,224,0.5);
  }
  #rbb-scope .btn-large{
    padding:20px 44px;
    font-size:1.1rem;
  }

  /* ---------- SECTION HEADINGS ---------- */
  #rbb-scope section{padding:88px 0;}
  #rbb-scope .kicker{
    font-size:0.85rem; font-weight:700;
    color:var(--court-blue);
    margin-bottom:10px;
  }
  #rbb-scope .sec-title{
    font-size:clamp(0.8rem, 3.8vw, 2.2rem);
    font-weight:700;
    white-space:nowrap;
  }
  #rbb-scope .sec-sub{
    margin-top:14px;
    max-width:56ch;
    color:#4A4E62;
    font-size:0.98rem;
  }
  @media (min-width:761px){
    #rbb-scope .bibs-sub{ max-width:860px; }
  }

  /* ---------- ABOUT INTRO ---------- */
  #rbb-scope .about-intro{ background:#fff; }
  #rbb-scope .about-intro .kicker{ color:var(--court-blue); }
  #rbb-scope .about-intro h2{
    margin-top:14px;
    font-size:clamp(1.6rem, 4vw, 2.4rem);
    font-weight:700;
    line-height:1.4;
  }
  #rbb-scope .about-accent{
    background:linear-gradient(100deg, var(--sky-blue), var(--violet) 55%, var(--soft-pink));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  #rbb-scope .about-intro p{
    margin-top:20px;
    max-width:none;
    color:#4A4E62;
    font-size:0.98rem;
  }

  /* ---------- NEWS ---------- */
  #rbb-scope .news{background:#fff;}
  #rbb-scope .news-list{
    display:flex;
    flex-direction:column;
  }
  #rbb-scope .news-item{
    display:flex;
    align-items:baseline;
    gap:18px;
    padding:18px 4px;
    border-bottom:1px solid var(--line);
    flex-wrap:wrap;
  }
  #rbb-scope .news-item:first-child{border-top:1px solid var(--line);}
  #rbb-scope .news-date{
    font-size:0.85rem; font-weight:700;
    color:#8A8FA3;
    flex:0 0 90px;
    font-variant-numeric:tabular-nums;
  }
  #rbb-scope .news-tag{
    font-size:0.72rem; font-weight:700;
    color:var(--court-blue);
    border:1px solid var(--court-blue);
    border-radius:100px;
    padding:2px 10px;
    flex:0 0 96px;
    box-sizing:border-box;
    text-align:center;
    white-space:nowrap;
    line-height:1.6;
  }
  #rbb-scope .news-tag--member{
    color:#151726;
    border-color:transparent;
    background:linear-gradient(100deg, var(--sky-blue), var(--soft-pink));
  }
  #rbb-scope .news-tag--other{
    color:#6B7086;
    border-color:#C9CCD8;
  }
  /* News: scroll inside the list when there are more than the visible count */
  #rbb-scope .news-scroll{ margin-top:40px; }
  #rbb-scope .news-scroll.is-scroll{
    max-height:330px; /* refined by JS to exactly N items */
    overflow-y:auto;
    padding-right:12px;
    scrollbar-width:thin;
    scrollbar-color:rgba(155,107,232,0.6) transparent;
    overscroll-behavior:contain;
  }
  #rbb-scope .news-scroll.is-scroll::-webkit-scrollbar{ width:6px; }
  #rbb-scope .news-scroll.is-scroll::-webkit-scrollbar-track{ background:transparent; }
  #rbb-scope .news-scroll.is-scroll::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg, var(--court-blue), var(--violet), var(--hot-pink));
    border-radius:100px;
  }
  #rbb-scope .news-text{
    font-size:0.92rem;
    color:var(--ink);
    flex:1 1 260px;
  }

  /* ---------- ABOUT / STATS ---------- */
  #rbb-scope .about{background:#fff;}
  #rbb-scope .about-grid{
    margin-top:52px;
    display:grid;
    grid-template-columns:repeat(6, 1fr);
    gap:1px;
    background:var(--line);
    border:1px solid var(--line);
    border-radius:20px;
    overflow:hidden;
  }
  #rbb-scope .about-grid .stat:nth-child(1),
  #rbb-scope .about-grid .stat:nth-child(2){grid-column: span 3;}
  #rbb-scope .about-grid .stat:nth-child(3),
  #rbb-scope .about-grid .stat:nth-child(4),
  #rbb-scope .about-grid .stat:nth-child(5){grid-column: span 2;}
  #rbb-scope .who-label{
    margin-top:56px;
    font-size:clamp(1.3rem, 2.6vw, 1.7rem);
    font-weight:700;
    color:var(--ink);
  }
  #rbb-scope .stat{
    background:#fff;
    padding:36px 30px;
  }
  #rbb-scope .stat .num{
    font-family:'Zen Kaku Gothic New', sans-serif;
    font-size:2.4rem; font-weight:900;
    background:linear-gradient(100deg, var(--court-blue), var(--violet), var(--hot-pink));
    -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  #rbb-scope .stat .label{margin-top:6px; font-size:0.92rem; color:#4A4E62;}

  /* ---------- WHO / CARDS ---------- */
  #rbb-scope .who{
    background:linear-gradient(180deg, var(--pale-pink) 0%, #FFF 100%);
  }
  #rbb-scope .card-grid{
    margin-top:52px;
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:20px;
  }
  #rbb-scope .card{
    background:linear-gradient(150deg, #12163A 0%, #1B2A6B 55%, #3D2E7A 100%);
    border:1px solid rgba(255,255,255,0.08);
    border-radius:6px;
    padding:32px 28px;
    position:relative;
    overflow:hidden;
    clip-path:polygon(0 0, 100% 0, 100% calc(100% - 26px), calc(100% - 26px) 100%, 0 100%);
  }
  #rbb-scope .card::before{
    content:'';
    position:absolute; top:0; left:0;
    width:56px; height:4px;
    background:linear-gradient(90deg, var(--court-blue), var(--hot-pink));
  }
  #rbb-scope .card::after{
    content:'';
    position:absolute; bottom:0; right:0;
    width:26px; height:26px;
    background:linear-gradient(135deg, var(--violet), var(--hot-pink));
    clip-path:polygon(100% 0, 0 100%, 100% 100%);
  }
  #rbb-scope .card .icon{
    width:44px; height:44px;
    border-radius:8px;
    background:rgba(255,255,255,0.08);
    border:1px solid rgba(255,255,255,0.18);
    display:flex; align-items:center; justify-content:center;
    margin-bottom:18px;
  }
  #rbb-scope .card .icon svg{width:22px; height:22px; stroke:#fff;}
  #rbb-scope .card .icon .emoji{font-size:22px; line-height:1;}
  #rbb-scope .card h3{font-size:1.08rem; font-weight:700; color:#fff;}
  #rbb-scope .card p{margin-top:8px; font-size:0.95rem; color:rgba(255,255,255,0.72);}

  /* ---------- MEMBERS ---------- */
  #rbb-scope .members{background:linear-gradient(180deg, #fff 0%, #F3F1FC 100%);}
  #rbb-scope .team-photo-wrap{
    margin-top:40px;
    position:relative;
    border-radius:22px;
    padding:8px;
    background:linear-gradient(135deg, var(--court-blue), var(--violet), var(--hot-pink));
  }
  #rbb-scope .team-photo{
    width:100%; display:block;
    border-radius:16px;
    box-shadow:0 24px 50px -20px rgba(16,26,61,0.35);
  }
  #rbb-scope .member-marquee{
    margin-top:40px;
    width:100vw;
    position:relative;
    left:50%;
    right:50%;
    margin-left:-50vw;
    margin-right:-50vw;
    overflow:hidden;
    padding:4px 40px 10px;
    -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
    mask-image:linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
  }
  #rbb-scope .member-track{
    display:flex;
    gap:18px;
    width:max-content;
    cursor:grab;
    user-select:none;
    touch-action:pan-y;
    will-change:transform;
  }
  #rbb-scope .member-track.dragging{
    cursor:grabbing;
  }
  #rbb-scope .carousel-controls{
    display:flex; align-items:center; justify-content:center;
    gap:18px;
    margin-top:22px;
  }
  #rbb-scope .carousel-arrow{
    flex:0 0 auto;
    width:40px; height:40px;
    border-radius:50%;
    border:1px solid var(--line);
    background:#fff;
    display:flex; align-items:center; justify-content:center;
    font-size:1.3rem; line-height:1;
    color:var(--ink);
    cursor:pointer;
    transition:background 0.15s ease, transform 0.15s ease;
  }
  #rbb-scope .carousel-arrow:hover{background:var(--pale-pink); transform:scale(1.05);}
  #rbb-scope .carousel-dots{display:flex; align-items:center; gap:8px;}
  #rbb-scope .carousel-dots .dot{
    width:8px; height:8px; border-radius:50%;
    background:var(--line);
    cursor:pointer;
    transition:background 0.2s ease, transform 0.2s ease;
  }
  #rbb-scope .carousel-dots .dot.active{
    background:linear-gradient(135deg, var(--court-blue), var(--hot-pink));
    transform:scale(1.3);
  }
  #rbb-scope .member-card{
    flex:0 0 210px;
    height:280px;
    perspective:1200px;
    cursor:pointer;
  }
  #rbb-scope .member-card-inner{
    position:relative;
    width:100%; height:100%;
    transition:transform 0.6s cubic-bezier(0.4,0.2,0.2,1);
    transform-style:preserve-3d;
  }
  @media (hover:hover) and (pointer:fine){
    #rbb-scope .member-card:hover .member-card-inner{ transform:rotateY(180deg); }
  }
  @media (hover:none){
    @keyframes card-peek{
      0%, 74%, 100%{ transform:rotateY(0deg); }
      80%{ transform:rotateY(-22deg); }
      88%{ transform:rotateY(10deg); }
      94%{ transform:rotateY(-6deg); }
    }
    #rbb-scope .member-card-inner{
      animation:card-peek 5s ease-in-out infinite;
    }
    #rbb-scope .member-card:nth-child(3n+1) .member-card-inner{ animation-delay:0.6s; }
    #rbb-scope .member-card:nth-child(3n+2) .member-card-inner{ animation-delay:1.2s; }
  }
  #rbb-scope .member-card-front,
  #rbb-scope .member-card-back{
    position:absolute; inset:0;
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
    border:1px solid var(--line);
    border-radius:22px;
    padding:38px 18px 32px;
    text-align:center;
    overflow:hidden;
  }
  #rbb-scope .member-card-front{
    background:linear-gradient(180deg, #fff 0%, var(--pale-pink) 130%);
  }
  #rbb-scope .member-card:nth-child(even) .member-card-front{
    background:linear-gradient(180deg, #fff 0%, #E7F0FF 130%);
  }
  #rbb-scope .member-card-back{
    transform:rotateY(180deg);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0;
  }
  #rbb-scope .member-card-back-photo{
    position:absolute; inset:0;
    background-size:cover;
    background-position:center;
    filter:blur(6px) brightness(0.7);
    transform:scale(1.1);
  }
  #rbb-scope .member-card-back-scrim{
    position:absolute; inset:0;
    background:rgba(16,20,54,0.35);
  }
  #rbb-scope .member-card-back-label{
    position:relative;
    color:#fff;
    font-weight:700;
    font-size:1.05rem;
    letter-spacing:0.03em;
  }
  #rbb-scope .member-card:hover{
    box-shadow:0 16px 30px -14px rgba(16,26,61,0.25);
  }
  #rbb-scope .member-photo{
    width:130px; height:130px;
    margin:0 auto 18px;
    border-radius:50%;
    padding:4px;
    background:linear-gradient(135deg, var(--court-blue), var(--violet), var(--hot-pink));
  }
  #rbb-scope .member-photo img{
    width:100%; height:100%;
    border-radius:50%;
    object-fit:cover;
    display:block;
    border:3px solid #fff;
  }
  #rbb-scope .member-role{
    font-size:0.85rem; font-weight:700;
    color:var(--court-blue);
  }
  #rbb-scope .member-name{
    margin-top:6px;
    font-size:1.1rem; font-weight:700;
    color:var(--ink);
  }

  /* ---------- MEMBER MODAL ---------- */
  #rbb-scope .member-modal{
    position:fixed; inset:0; z-index:2000;
    display:flex; align-items:center; justify-content:center;
    padding:24px;
    opacity:0; visibility:hidden;
    transition:opacity 0.25s ease, visibility 0.25s ease;
  }
  #rbb-scope .member-modal.open{ opacity:1; visibility:visible; }
  #rbb-scope .member-modal-backdrop{
    position:absolute; inset:0;
    background:rgba(16,20,54,0.6);
    backdrop-filter:blur(3px);
  }
  #rbb-scope .member-modal-inner{
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:auto minmax(0, 620px) auto;
    gap:16px;
    align-items:center;
    justify-content:center;
    width:100%;
    pointer-events:none;
  }
  #rbb-scope .member-modal-inner > *{ pointer-events:auto; }
  #rbb-scope .member-modal-panel{
    position:relative;
    background:#fff;
    border-radius:24px;
    width:100%;
    min-width:0;
    height:700px;
    max-height:88vh;
    overflow-y:auto;
    padding:40px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    transform:translateY(16px) scale(0.98);
    transition:transform 0.25s ease;
    box-shadow:0 40px 80px -20px rgba(16,20,54,0.4);
  }
  #rbb-scope .member-modal.open .member-modal-panel{ transform:translateY(0) scale(1); }
  #rbb-scope .member-modal-close{
    position:absolute; top:18px; right:18px;
    width:36px; height:36px;
    border:none;
    background:transparent;
    font-size:1.6rem; line-height:1;
    color:var(--ink);
    cursor:pointer;
    display:flex; align-items:center; justify-content:center;
  }
  #rbb-scope .member-modal-nav{
    position:static;
    flex:0 0 auto;
    width:48px; height:48px;
    border-radius:50%;
    border:1px solid rgba(255,255,255,0.4);
    background:rgba(16,20,54,0.55);
    backdrop-filter:blur(4px);
    color:#fff;
    font-size:1.7rem; line-height:1;
    cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    z-index:2010;
    transition:background 0.15s ease;
  }
  #rbb-scope .member-modal-nav:hover{ background:rgba(16,20,54,0.8); }
  #rbb-scope .mm-position-item{ position:relative; gap:8px; }
  #rbb-scope .mm-tooltip-wrap{ position:relative; display:inline-flex; }
  #rbb-scope .mm-tooltip-btn{
    width:18px; height:18px;
    border-radius:50%;
    border:1px solid var(--court-blue);
    background:#fff;
    color:var(--court-blue);
    font-size:0.7rem; font-weight:700;
    line-height:1;
    cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    padding:0;
  }
  #rbb-scope .mm-tooltip-pop{
    display:none;
    position:absolute;
    top:calc(100% + 10px);
    left:50%;
    transform:translateX(-50%);
    width:200px;
    max-width:calc(100vw - 64px);
    background:var(--ink);
    color:#fff;
    font-size:0.76rem;
    line-height:1.7;
    text-align:left;
    padding:12px 14px;
    border-radius:10px;
    z-index:20;
    box-shadow:0 12px 24px -8px rgba(0,0,0,0.35);
  }
  #rbb-scope .mm-tooltip-pop::after{
    content:'';
    position:absolute; bottom:100%; left:50%;
    transform:translateX(-50%);
    border:6px solid transparent;
    border-bottom-color:var(--ink);
  }
  #rbb-scope .mm-tooltip-wrap.open .mm-tooltip-pop{ display:block; }
  @media (max-width:640px){
    #rbb-scope .member-modal-inner{ gap:6px; }
    #rbb-scope .member-modal-nav{ width:36px; height:36px; font-size:1.3rem; }
  }
  #rbb-scope .member-modal-top{
    display:flex;
    align-items:center;
    gap:24px;
  }
  #rbb-scope .member-modal-photo{
    flex:0 0 auto;
    width:120px; height:120px;
    border-radius:50%;
    padding:4px;
    background:linear-gradient(135deg, var(--court-blue), var(--violet), var(--hot-pink));
  }
  #rbb-scope .member-modal-photo img{
    width:100%; height:100%;
    border-radius:50%;
    object-fit:cover;
    display:block;
    border:3px solid #fff;
  }
  #rbb-scope .member-modal-info{ flex:1 1 auto; }
  #rbb-scope .member-modal-info h3{ font-size:1.4rem; font-weight:700; }
  #rbb-scope .member-modal-meta{
    margin-top:14px;
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }
  #rbb-scope .member-modal-meta-item{
    display:flex; align-items:baseline; gap:8px;
    padding:9px 16px;
    background:var(--pale-pink);
    border-radius:12px;
    font-size:0.92rem;
  }
  #rbb-scope .mm-label{ color:#8A8FA3; font-weight:700; }
  #rbb-scope .mm-value{ color:var(--ink); font-weight:700; }
  #rbb-scope .member-modal-chart-section{
    margin-top:32px;
    padding-top:28px;
    border-top:1px solid var(--line);
  }
  #rbb-scope .mm-chart-title{
    font-size:0.85rem; font-weight:700;
    color:var(--court-blue);
    margin-bottom:8px;
    text-align:center;
  }
  #rbb-scope .mm-chart-wrap{ position:relative; }
  #rbb-scope #mmChart{ display:flex; justify-content:center; transition:filter 0.2s ease; }
  #rbb-scope #mmChart.blurred{ filter:blur(5px); opacity:0.5; }
  #rbb-scope .mm-chart-note{
    display:none;
    position:absolute;
    inset:0;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:0 30px;
    font-size:0.95rem;
    font-weight:700;
    color:var(--ink);
  }
  #rbb-scope .mm-chart-note.show{ display:flex; }
  @media (max-width:640px){
    #rbb-scope .member-modal-top{ flex-direction:column; text-align:center; }
    #rbb-scope .member-modal-meta{ justify-content:center; }
    #rbb-scope .member-modal-panel{ padding:28px 22px; }
  }

  /* ---------- BIBS ---------- */
  #rbb-scope .bibs{background:#fff;}
  #rbb-scope .bibs-grid{
    margin-top:44px;
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:24px;
  }
  #rbb-scope .bibs-card:first-child{ order:2; }
  #rbb-scope .bibs-card:last-child{ order:1; }
  #rbb-scope .bibs-card{
    border:1px solid var(--line);
    border-radius:20px;
    padding:16px 16px 20px;
    text-align:center;
    background:linear-gradient(180deg, #fff 0%, var(--pale-pink) 160%);
  }
  #rbb-scope .bibs-card img{
    width:100%;
    border-radius:12px;
    display:block;
  }
  #rbb-scope .bibs-caption{
    margin-top:14px;
    font-size:0.95rem; font-weight:700;
    color:var(--ink);
  }

  /* ---------- SCHEDULE ---------- */
  #rbb-scope .schedule{background:#fff; padding-bottom:0;}
  #rbb-scope .schedule-media{
    position:relative;
    border-radius:28px;
    overflow:hidden;
    margin-top:52px;
    display:flex;
    align-items:center;
  }
  #rbb-scope .schedule-media > img{
    position:absolute; inset:0;
    width:100%; height:100%;
    object-fit:cover;
  }
  #rbb-scope .schedule-scrim{
    position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(15,19,54,0.75) 0%, rgba(15,19,54,0.55) 45%, rgba(15,19,54,0.75) 100%);
  }
  #rbb-scope .schedule-overlay{
    position:relative;
    z-index:1;
    width:100%;
    padding:56px;
    color:#fff;
  }
  #rbb-scope .schedule-overlay .kicker{color:var(--soft-pink);}
  #rbb-scope .sched-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    max-width:640px;
  }
  #rbb-scope .sched-day{
    border-radius:20px;
    padding:34px 30px;
    color:#fff;
    position:relative;
    overflow:hidden;
  }
  #rbb-scope .sched-day.sat{background:linear-gradient(150deg, var(--court-blue), #3A63E0);}
  #rbb-scope .sched-day.sun{background:linear-gradient(150deg, var(--hot-pink), #FF6FA8);}
  #rbb-scope .sched-day .day-jp{font-size:0.95rem; opacity:0.85;}
  #rbb-scope .sched-day .day-en{
    font-family:'Zen Kaku Gothic New', sans-serif;
    font-size:2.1rem; font-weight:900; margin-top:2px;
  }
  #rbb-scope .sched-day .time{margin-top:18px; font-size:1rem; font-weight:700;}
  #rbb-scope .sched-day .place{margin-top:4px; font-size:0.9rem; opacity:0.9;}

  #rbb-scope .note-box{
    margin-top:24px;
    max-width:640px;
    display:flex; align-items:center; gap:14px;
    padding:24px;
    border:1px solid rgba(255,255,255,0.25);
    border-radius:16px;
    background:rgba(255,255,255,0.08);
    backdrop-filter:blur(4px);
    font-size:0.92rem;
    color:rgba(255,255,255,0.85);
  }

  /* ---------- ACTIVITY LOG ---------- */
  #rbb-scope .activity-log{
    background:linear-gradient(135deg, #12163A 0%, #1B2A6B 55%, #3D2E7A 100%);
    padding:80px 0;
    position:relative;
    overflow:hidden;
  }
  #rbb-scope .activity-log::before{
    content:'';
    position:absolute; inset:0;
    background-image:radial-gradient(rgba(255,255,255,0.08) 1px, transparent 1px);
    background-size:22px 22px;
    opacity:0.5;
  }
  #rbb-scope .activity-log .wrap{ position:relative; z-index:1; }
  #rbb-scope .activity-kicker{ color:var(--soft-pink); }
  #rbb-scope .activity-title{ color:#fff; }
  #rbb-scope .activity-heading-row{
    display:flex;
    align-items:baseline;
    flex-wrap:wrap;
    column-gap:20px;
    row-gap:6px;
  }
  #rbb-scope .activity-note{
    font-size:0.8rem;
    color:rgba(255,255,255,0.55);
  }
  #rbb-scope .log-scroll{
    margin-top:48px;
    max-height:510px;
    overflow-y:auto;
    padding-right:12px;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,111,224,0.6) transparent;
  }
  #rbb-scope .log-scroll::-webkit-scrollbar{ width:6px; }
  #rbb-scope .log-scroll::-webkit-scrollbar-track{ background:transparent; }
  #rbb-scope .log-scroll::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg, var(--court-blue), var(--hot-pink));
    border-radius:100px;
  }
  #rbb-scope .log-timeline{
    position:relative;
    padding-left:48px;
  }
  #rbb-scope .log-timeline::before{
    content:'';
    position:absolute;
    left:20px; top:8px; bottom:8px;
    width:2px;
    background:linear-gradient(180deg, var(--court-blue), var(--violet), var(--hot-pink));
    opacity:0.6;
  }
  #rbb-scope .log-item{
    position:relative;
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    column-gap:14px;
    row-gap:4px;
    padding:18px 0 18px 20px;
  }
  #rbb-scope .log-item:not(:last-child){
    border-bottom:1px solid rgba(255,255,255,0.08);
  }
  #rbb-scope .log-dot{
    position:absolute;
    left:-34px; top:24px;
    width:12px; height:12px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 0 0 4px rgba(255,255,255,0.15), 0 0 14px 2px rgba(111,192,255,0.8);
  }
  #rbb-scope .log-date{
    font-family:'Zen Kaku Gothic New', sans-serif;
    font-weight:900;
    font-size:1.15rem;
    background:linear-gradient(100deg, var(--sky-blue), var(--soft-pink));
    -webkit-background-clip:text; background-clip:text; color:transparent;
    flex:0 0 auto;
  }
  #rbb-scope .log-dow{
    font-size:0.85rem;
    font-weight:700;
    margin-left:4px;
  }
  #rbb-scope .log-tag-members{
    flex:0 0 auto;
    font-size:0.72rem;
    font-weight:700;
    color:#151726;
    background:linear-gradient(100deg, var(--sky-blue), var(--soft-pink));
    padding:3px 10px;
    border-radius:100px;
    white-space:nowrap;
  }
  #rbb-scope .log-text{
    color:rgba(255,255,255,0.88);
    font-size:0.98rem;
    font-weight:500;
  }
  #rbb-scope .log-members{
    flex:1 0 100%;
    margin-top:2px;
    padding-left:0;
    font-size:0.82rem;
    color:rgba(255,255,255,0.5);
  }
  @media (max-width:640px){
    #rbb-scope .log-date{ min-width:auto; font-size:1.05rem; }
  }

  /* ---------- YAKINIKU ---------- */
  #rbb-scope .yakiniku{
    background:#fff;
    padding:20px 0 70px;
  }
  #rbb-scope .yakiniku-media{
    position:relative;
    border-radius:28px;
    overflow:hidden;
    display:flex;
    align-items:center;
  }
  #rbb-scope .yakiniku-photo{
    position:absolute;
    inset:0;
  }
  #rbb-scope .yakiniku-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }
  #rbb-scope .yakiniku-card{
    position:relative;
    z-index:1;
    margin:6% auto 6% 6%;
    width:min(90%, 440px);
    background:rgba(251,250,254,0.94);
    backdrop-filter:blur(6px);
    border-radius:20px;
    padding:48px;
    box-shadow:0 30px 60px -20px rgba(16,20,54,0.35);
    color:var(--ink);
  }
  #rbb-scope .yakiniku-card .kicker{color:var(--court-blue);}
  #rbb-scope .yakiniku-card h2{font-size:clamp(1.3rem,2.6vw,1.9rem); font-weight:700; line-height:1.4;}
  #rbb-scope .yakiniku-card p{margin-top:16px; opacity:0.85; font-size:0.95rem;}
  #rbb-scope .yakiniku-card p:first-child{margin-top:0;}
  #rbb-scope .yakiniku-card ul{margin-top:22px; display:flex; flex-direction:column; gap:10px;}
  #rbb-scope .yakiniku-card li{display:flex; gap:10px; align-items:flex-start; font-size:0.9rem; color:#4A4E62;}

  /* ---------- SNS ---------- */
  #rbb-scope .sns{background:linear-gradient(180deg, #fff 0%, var(--pale-pink) 100%);}
  #rbb-scope .sns-embed{
    margin-top:44px;
    max-width:560px;
    margin-left:auto;
    margin-right:auto;
    min-height:200px;
  }
  #rbb-scope .sns-embed > a.twitter-timeline{
    display:none;
  }
  #rbb-scope .sns-fallback{
    display:none;
    flex-direction:column;
    align-items:center;
    gap:10px;
    padding:40px 28px;
    border-radius:20px;
    border:1px solid var(--line);
    background:#fff;
    text-decoration:none;
    text-align:center;
  }
  #rbb-scope .sns-fallback-handle{
    font-weight:700;
    font-size:1.05rem;
    color:var(--ink);
  }
  #rbb-scope .sns-fallback-cta{
    font-size:0.9rem;
    font-weight:700;
    color:var(--court-blue);
  }

  /* ---------- FLOW ---------- */
  #rbb-scope .flow{background:#fff;}
  #rbb-scope .flow-steps{
    margin-top:64px;
    display:flex;
    position:relative;
    gap:0;
  }
  #rbb-scope .flow-steps::before{
    content:'';
    position:absolute;
    top:28px;
    left:calc(100% / 6);
    right:calc(100% / 6);
    height:2px;
    background:linear-gradient(90deg, var(--court-blue), var(--violet), var(--hot-pink));
    z-index:0;
  }
  #rbb-scope .flow-step{
    flex:1;
    position:relative;
    z-index:1;
    text-align:center;
    padding:0 16px;
  }
  #rbb-scope .flow-step .step-num{
    width:56px; height:56px;
    margin:0 auto;
    border-radius:50%;
    background:linear-gradient(135deg, var(--court-blue), var(--violet), var(--hot-pink));
    color:#fff;
    display:flex; align-items:center; justify-content:center;
    font-family:'Zen Kaku Gothic New', sans-serif;
    font-weight:900; font-size:1.4rem;
    box-shadow:0 14px 28px -10px rgba(107,66,232,0.45);
  }
  #rbb-scope .flow-step h3{margin-top:20px; font-size:1.02rem; font-weight:700;}
  #rbb-scope .flow-step p{margin-top:8px; font-size:0.92rem; color:#4A4E62;}

  /* ---------- FORM ---------- */
  #rbb-scope .contact{
    background:linear-gradient(180deg, #fff 0%, #EFF4FF 100%);
  }
  #rbb-scope .x-apply{
    margin-top:64px;
    display:grid;
    grid-template-columns:0.85fr 1.15fr;
    gap:44px;
    align-items:start;
  }
  #rbb-scope .x-apply-info p{margin-top:14px; color:#4A4E62; font-size:0.95rem;}
  #rbb-scope .x-apply-info .btn-primary{
    margin-top:24px;
    display:block;
    width:fit-content;
    margin-left:auto;
    margin-right:auto;
  }
  #rbb-scope .x-apply-post{display:flex; justify-content:center;}
  #rbb-scope .x-timeline-block{ margin-top:56px; }
  #rbb-scope .x-timeline-embed{
    margin-top:20px;
    max-width:560px;
    display:flex;
    justify-content:center;
  }
  #rbb-scope .contact-grid{
    margin-top:80px;
    display:grid;
    grid-template-columns:0.85fr 1.15fr;
    gap:44px;
  }
  #rbb-scope .contact-side h3{font-size:1.15rem; font-weight:700;}
  #rbb-scope .contact-side p{margin-top:12px; color:#4A4E62; font-size:0.95rem;}
  #rbb-scope .contact-side .info-line{
    margin-top:22px; padding-top:22px;
    border-top:1px solid var(--line);
    font-size:0.9rem; color:#4A4E62;
  }
  #rbb-scope form{
    background:#fff;
    border:1px solid var(--line);
    border-radius:20px;
    padding:34px;
  }
  #rbb-scope .field{margin-bottom:20px;}
  #rbb-scope .field label{
    display:block; font-size:0.85rem; font-weight:700;
    margin-bottom:8px;
  }
  #rbb-scope .field .req{color:var(--hot-pink); font-weight:700; margin-left:4px;}
  #rbb-scope .field input,
  #rbb-scope .field select,
  #rbb-scope .field textarea{
    width:100%;
    border:1px solid var(--line);
    border-radius:10px;
    padding:12px 14px;
    font-family:inherit;
    font-size:0.95rem;
    background:#FBFAFE;
  }
  #rbb-scope .field input:focus,
  #rbb-scope .field select:focus,
  #rbb-scope .field textarea:focus{
    outline:2px solid var(--court-blue);
    outline-offset:1px;
  }
  #rbb-scope .field-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
  #rbb-scope .submit-btn{
    width:100%;
    background:linear-gradient(100deg, var(--court-blue), var(--violet), var(--hot-pink));
    color:#fff; font-weight:700; font-size:1rem;
    border:none; border-radius:100px;
    padding:16px; cursor:pointer;
    margin-top:6px;
  }
  #rbb-scope .submit-btn:focus-visible{outline:3px solid var(--navy); outline-offset:2px;}
  #rbb-scope .form-msg{
    margin-top:16px; font-size:0.9rem; text-align:center;
    display:none;
  }
  #rbb-scope .form-msg.show{display:block;}

  #rbb-scope footer{
    background:var(--navy); color:rgba(255,255,255,0.7);
    padding:40px 0; font-size:0.85rem;
    text-align:center;
  }
  #rbb-scope footer .footer-logo{height:30px; width:auto; margin:0 auto 10px; display:block; opacity:0.95;}
  #rbb-scope .footer-copyright{margin-top:6px; font-size:0.78rem; opacity:0.7;}

  /* ---------- BACK TO TOP ---------- */
  #rbb-scope .back-to-top{
    position:fixed;
    right:32px; bottom:32px;
    width:96px; height:96px;
    border:none;
    outline:none;
    background:none;
    padding:0;
    cursor:pointer;
    z-index:500;
    -webkit-tap-highlight-color:transparent;
    opacity:0; visibility:hidden; transform:translateY(12px) scale(0.9);
    transition:opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease;
  }
  #rbb-scope .back-to-top::-moz-focus-inner{ border:0; }
  #rbb-scope .back-to-top.show{ opacity:1; visibility:visible; transform:translateY(0) scale(1); }
  #rbb-scope .back-to-top:hover{ transform:translateY(-3px) scale(1.05); }
  #rbb-scope .back-to-top img{
    width:100%; height:100%;
    object-fit:contain;
    display:block;
    filter:drop-shadow(0 6px 14px rgba(16,20,54,0.35));
  }
  @media (max-width:640px){
    #rbb-scope .back-to-top{ right:20px; bottom:20px; width:72px; height:72px; }
  }

  @media (max-width: 760px){
    #rbb-scope .activity-log::before{ display:none; }
    #rbb-scope .nav-burger{ display:flex; }
    #rbb-scope .nav-links{
      display:none;
      position:absolute;
      top:100%; left:0; right:0;
      flex-direction:column;
      align-items:flex-start;
      gap:0;
      max-width:none;
      overflow:visible;
      background:#fff;
      border-bottom:1px solid var(--line);
      box-shadow:0 16px 24px -16px rgba(16,20,54,0.25);
      padding:8px 24px 16px;
    }
    #rbb-scope .nav-links.open{ display:flex; }
    #rbb-scope .nav-links a{
      width:100%;
      padding:12px 0;
      font-size:0.95rem;
      border-bottom:1px solid var(--line);
    }
    #rbb-scope .nav-links a:last-child{ border-bottom:none; }
    #rbb-scope .hero{max-height:520px;}
    #rbb-scope .about-grid{grid-template-columns:1fr;}
    #rbb-scope .member-card{flex:0 0 160px; height:230px;}
    #rbb-scope .member-card-front,
  #rbb-scope .member-card-back{padding:26px 14px 22px;}
    #rbb-scope .member-photo{width:100px; height:100px;}
    #rbb-scope .carousel-arrow{width:34px; height:34px; font-size:1.1rem;}
    #rbb-scope .card-grid{grid-template-columns:1fr;}
    #rbb-scope .sched-grid{grid-template-columns:1fr;}
    #rbb-scope .bibs-grid{grid-template-columns:1fr;}
    #rbb-scope .yakiniku{padding:16px 0 40px;}
    #rbb-scope .yakiniku-media{border-radius:20px;}
    #rbb-scope .yakiniku-card{margin-left:auto; margin-right:auto; width:calc(100% - 40px); padding:32px 26px;}
    #rbb-scope .schedule-media{min-height:auto; border-radius:20px;}
    #rbb-scope .schedule-overlay{padding:40px 24px;}
    #rbb-scope .flow-steps{flex-direction:column; gap:36px;}
    #rbb-scope .flow-steps::before{
      left:27px; right:auto; top:0; bottom:0;
      width:2px; height:auto;
      background:linear-gradient(180deg, var(--court-blue), var(--violet), var(--hot-pink));
    }
    #rbb-scope .flow-step{text-align:left; padding:0 0 0 76px;}
    #rbb-scope .flow-step .step-num{position:absolute; left:0; top:0; margin:0;}
    #rbb-scope .x-apply{grid-template-columns:1fr;}
    #rbb-scope .contact-grid{grid-template-columns:1fr;}
    #rbb-scope .field-row{grid-template-columns:1fr;}
    #rbb-scope section{padding:64px 0;}
  }

  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
  }

  /* ---------- LOADING SCREEN ---------- */
  #rbb-scope #loading-screen{
    position:fixed; inset:0; z-index:9999;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:28px;
    background:#ffffff;
    transition:opacity 0.5s ease, visibility 0.5s ease;
  }
  #rbb-scope #loading-screen.hidden{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
  }
  #rbb-scope #loading-screen .loading-logo{
    width:200px;
    height:auto;
    animation:loading-pulse 1.6s ease-in-out infinite;
  }
  #rbb-scope #loading-screen .loading-bar-track{
    width:220px;
    height:4px;
    border-radius:100px;
    background:rgba(16,26,61,0.12);
    overflow:hidden;
  }
  #rbb-scope #loading-screen .loading-bar-fill{
    height:100%;
    width:0%;
    border-radius:100px;
    background:linear-gradient(100deg, var(--court-blue), var(--violet), var(--hot-pink));
    animation:loading-fill 1.4s ease forwards;
  }
  @keyframes loading-fill{
    0%{ width:0%; }
    60%{ width:78%; }
    100%{ width:100%; }
  }
  @keyframes loading-pulse{
    0%, 100%{ opacity:1; }
    50%{ opacity:0.75; }
  }
  @media (prefers-reduced-motion: reduce){
    #rbb-scope #loading-screen .loading-logo{ animation:none; }
    #rbb-scope #loading-screen .loading-bar-fill{ animation:none; width:100%; }
  }

/* ---------- 404 ---------- */
#rbb-scope .rbb-404{ min-height:50vh; }
#rbb-scope .rbb-404 .btn-primary{ margin-top:12px; }

/* ---------- Member count (above the carousel) ---------- */
#rbb-scope .member-count{
  margin:44px 0 0;
  display:flex; flex-direction:column; align-items:center; gap:2px;
  text-align:center;
}
#rbb-scope .member-count + .member-marquee{ margin-top:20px; }
#rbb-scope .member-count-label{
  font-size:0.85rem; font-weight:700; letter-spacing:0.12em;
  color:var(--court-blue);
}
#rbb-scope .member-count-value{
  display:inline-flex; align-items:baseline; gap:4px;
  font-family:'Zen Kaku Gothic New', sans-serif; font-weight:900; line-height:1.1;
}
#rbb-scope .member-count-num{
  font-size:clamp(3rem, 8vw, 4.4rem);
  background:linear-gradient(100deg, var(--court-blue), var(--violet), var(--hot-pink));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  font-variant-numeric:tabular-nums;
}
#rbb-scope .member-count-unit{ font-size:1.25rem; color:var(--ink); }

/* ---------- Member modal: X / REALITY links next to the name ---------- */
#rbb-scope .mm-name-row{ display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; }
#rbb-scope .mm-links{ display:inline-flex; align-items:center; gap:8px; }
#rbb-scope .mm-links:not(:has(.mm-link:not([hidden]))){ display:none; }
#rbb-scope .mm-link[hidden]{ display:none; }
#rbb-scope .mm-link{
  display:inline-flex; align-items:center; justify-content:center;
  height:32px; min-width:32px; border-radius:999px;
  text-decoration:none; transition:transform .15s ease, box-shadow .15s ease;
}
#rbb-scope .mm-link:hover{ transform:translateY(-1px); box-shadow:0 4px 12px rgba(18,22,58,.18); }
#rbb-scope .mm-link:focus-visible{ outline:3px solid var(--violet); outline-offset:2px; }
/* Both buttons share the same black pill; X can carry the official logo image. */
#rbb-scope .mm-link{ background:#000; color:#fff; }
#rbb-scope .mm-link.has-icon{ width:32px; padding:0; }
#rbb-scope .mm-link.has-icon img{ width:15px; height:15px; object-fit:contain; display:block; }
#rbb-scope .mm-link-text{
  font-size:0.72rem; font-weight:900; letter-spacing:0.04em; line-height:1;
  padding:0 12px; color:#fff;
}
#rbb-scope .mm-link--x:not(.has-icon) .mm-link-text{ padding:0; }
@media (max-width:640px){
  #rbb-scope .mm-name-row{ justify-content:center; }
}
