/* トップ専用の追加スタイル: 告知帯・ロボットサンドボックスへの導線 */

/* 告知帯（期限付き。data-until を過ぎたら JS が消す） */
.notice-bar {
    background: #16203a;
    color: #f3ecd8;
    font-size: 0.92rem;
    line-height: 1.6;
    padding: 0.7rem 1rem;
    text-align: center;
    border-bottom: 3px solid #dd8f3a;
}
.notice-bar b { color: #e9b862; }
.notice-bar a { color: #f3ecd8; text-decoration: underline; text-underline-offset: 3px; }
.notice-bar a:hover { color: #e9b862; }
.notice-bar .sep { opacity: 0.5; margin: 0 0.5em; }
@media (max-width: 600px) {
    .notice-bar .sep { display: block; height: 0; overflow: hidden; }
}

/* ロボットサンドボックスへの導線（創作の顔） */
.rs-panel {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1rem 2rem;
    width: 100%;
    box-sizing: border-box;
}
.rs-panel-inner {
    background: linear-gradient(135deg, #16203a 0%, #1f2c4f 100%);
    color: #f3ecd8;
    border-radius: 16px;
    padding: 1.6rem 1.8rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.2rem;
    position: relative;
    overflow: hidden;
}
/* 三日月（クリーム色を薄く）。装飾はこれだけ。透明な円の内側の影で三日月を描く */
.rs-panel-inner::before {
    content: '';
    position: absolute;
    right: 150px;
    top: -40px;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    box-shadow: inset 26px -16px 0 0 rgba(243, 236, 216, 0.14);
    pointer-events: none;
}
.rs-panel-inner > * { position: relative; z-index: 1; }
.rs-panel-inner img { width: 150px; height: auto; flex: 0 0 auto; }
.rs-panel-text { flex: 1 1 280px; }
.rs-panel-text h3 { margin: 0 0 0.3rem; font-size: 1.15rem; color: #f3ecd8; }
.rs-panel-text p { margin: 0; color: #e6dcc0; font-size: 0.95rem; line-height: 1.7; }
.rs-panel .btn-rs {
    background: #dd8f3a;
    color: #16203a;
    box-shadow: 0 4px 16px rgba(221, 143, 58, 0.3);
    white-space: nowrap;
}
@media (hover: hover) and (pointer: fine) {
    .rs-panel .btn-rs:hover { background: #e9b862; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(221, 143, 58, 0.4); }
}