/* =========================
   PC 共通
========================= */
body{
    margin:0;
    font-family:'Orbitron',sans-serif;
    color:white;
    text-align:center;
    background:url("tako.jpg") center/cover no-repeat fixed;
}
body::before{
    content:"";
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.65);
    z-index:-1;
}
.container{
    margin:0 auto;
    max-width:1000px;
    padding:10px 20px;
    text-align:center;
    display:flex;
    flex-direction:column;
}
.main-title{
    font-size:46px;
    letter-spacing:4px;
    white-space:nowrap;
    margin:15px 0 5px 0;
}
.countdown{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:18px;
    margin-top:20px;
}
.colon{
    font-size:48px;
    margin-top:-8px;
}
.time{
    width:85px;
}
.time div{
    font-size:68px;
    text-shadow:0 0 20px cyan;
    font-variant-numeric:tabular-nums;
}
.time span{
    font-size:14px;
    letter-spacing:2px;
}
.ningyo{
    margin-top:25px;
}
.title{
    font-size:28px;
    margin-bottom:10px;
}
#count{
    font-size:60px;
    cursor:pointer;
    transition:0.3s;
}
.progress{
    width:350px;
    height:20px;
    background:#333;
    margin:15px auto;
    border-radius:20px;
    overflow:hidden;
}
#bar{
    height:100%;
    width:0%;
    background:linear-gradient(90deg,#00ffff,#00ff88);
    min-width:25px;
}
.support{
    margin-top:5px;
    font-size:16px;
}

/* ===== ロゴボタン（PC） ===== */
.buttons{
    margin-top:20px;
    padding-bottom:20px;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:28px;
}
.logo-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:opacity 0.2s, transform 0.2s;
}
.logo-link:hover{
    opacity:0.75;
    transform:scale(1.1);
}
.logo-icon{
    display:block;
    object-fit:contain;
}
.logo-x{
    width:40px;
    height:40px;
    filter:invert(1);
}
.logo-niconico{
    width:52px;
    height:52px;
    /* filter:invert(1);  ← 削除 */
}

#particles-js{
    position:fixed;
    width:100%;
    height:100%;
    z-index:-2;
}

/* =========================
   スマホ専用
========================= */
@media(max-width:700px){

body{
    background:url("tako.jpg") center/cover no-repeat;
    background-attachment:scroll;
    margin:0;
    padding:0;
    height:100dvh;
    overflow:hidden;
}

.container{
    height:100dvh;
    display:flex;
    flex-direction:column;
    padding:0 10px;
}

.main-title{
    width:100%;
    font-size:22px;
    margin:20px 0 4px 0;
    text-align:center;
    flex-shrink:0;
}

.countdown{
    gap:2px;
    margin-top:6px;
    display:flex;
    align-items:flex-start;
    flex-shrink:0;
}

.time{
    width:38px;
    display:flex;
    flex-direction:column;
    align-items:center;
}

.time div{
    font-size:32px;
    line-height:1;
}

.time span{
    font-size:7px;
    line-height:1.4;
    margin-top:2px;
}

.colon{
    font-size:30px;
    line-height:1;
    margin-top:0;
    padding-bottom:calc(7px * 1.4 + 2px);
}

/* 人形カウンター：残りスペースを占有して中央寄せ */
.ningyo{
    flex:1;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    margin:0;
}

#count{
    font-size:34px;
}

.progress{
    width:90%;
}

.support{
    font-size:13px;
    margin-top:6px;
}

/* ロゴボタン：最下部に固定 */
.buttons{
    flex:0 0 auto;
    margin-top:0;
    padding-bottom:14px;
    gap:32px;
    display:flex;
    justify-content:center;
    align-items:center;
}

.logo-x{
    width:36px;
    height:36px;
    filter:invert(1);
}

.logo-niconico{
    width:46px;
    height:46px;
     /* filter:invert(1); ← 削除 */
}

}