@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    デザイン案：カードグリッド＋ヒーロー検索（ダークモード）
*/

/* ==========================================================
   GLOBAL DARK MODE
   ========================================================== */
body {
    background: #0a0a14 !important;
    color: #e0e0e0 !important;
}
/* SWELLのヘッダー */
.l-header,
.l-header__inner,
.p-globalNav {
    background: #0f0f1a !important;
    border-bottom: 1px solid #1e1e30 !important;
}
/* SWELL追従ヘッダー（スクロール時の固定バー）──全パターン網羅 */
.l-fixHeader,
.l-fixHeader .l-header__inner,
.l-fixHeader .l-header__bar,
.l-fixHeader .p-globalNav,
#fix_header,
.p-fixHeader,
.l-header.-fixed,
.l-header[data-scrolled="true"],
.l-header[data-scrolled="true"] .l-header__inner,
.l-header[data-scrolled="true"] .l-header__bar,
div[class*="fixHeader"],
header[class*="fixHeader"],
/* SWELLカスタムヘッダーバー */
.l-header__bar,
.l-header__barInner,
.l-header__customBtn,
.c-headerBarBtn {
    background: #0f0f1a !important;
    border-bottom: 1px solid #1e1e30 !important;
    color: #ccc !important;
}
.l-header__bar a,
.l-header__barInner a,
.c-headerBarBtn { color: #ccc !important; }
/* SWELLスマホ用固定バー・追従メニュー・ハンバーガー */
.p-fixBtnWrap,
.l-scrollNavArea,
.p-spMenu,
.p-spMenu__inner,
.p-spMenu__body,
.p-spMenu__nav,
.c-overlay.-spMenu,
.-spMenu .p-spMenu__inner {
    background: #0f0f1a !important;
    color: #ccc !important;
}
.p-spMenu__inner a,
.p-spMenu__body a,
.p-spMenu__nav a { color: #ccc !important; }
/* SWELLの検索フォーム（ヘッダー内） */
.l-header .c-searchForm,
.p-spMenu .c-searchForm {
    background: #1a1a2e !important;
    border: 1px solid #2a2a3e !important;
}
.l-header .c-searchForm input,
.p-spMenu .c-searchForm input {
    background: transparent !important;
    color: #e0e0e0 !important;
}
.l-header a,
.p-globalNav a,
.c-gnav__item a { color: #ccc !important; }
.l-header a:hover,
.p-globalNav a:hover { color: #e94560 !important; }
/* SWELLのフッター */
.l-footer,
.l-footer__inner,
.l-footer__widgetArea,
.l-footer__foot,
.c-copyright { background: #0a0a14 !important; color: #666 !important; border-top: 1px solid #1e1e30 !important; }
.l-footer a { color: #888 !important; }
/* フッターSEOテキスト */
.footer-seo-text {
    background: #0d0d1a;
    border-top: 1px solid #1e1e30;
    padding: 40px 20px 32px;
}
.footer-seo-inner {
    max-width: 900px;
    margin: 0 auto;
}
.footer-seo-text h2 {
    font-size: 16px;
    color: #8892b0;
    margin: 0 0 12px;
    font-weight: 600;
}
.footer-seo-text h3 {
    font-size: 14px;
    color: #7880a0;
    margin: 20px 0 8px;
    font-weight: 600;
}
.footer-seo-text p {
    font-size: 13px;
    line-height: 1.85;
    color: #555a70;
    margin: 0 0 8px;
}
.footer-seo-text strong {
    color: #6cacda;
    font-weight: 600;
}
/* メインコンテンツエリア */
.l-content,
.l-mainContent,
.l-container,
.l-mainContent__inner,
.post_content,
main,
#content,
#main { background: transparent !important; color: #e0e0e0 !important; }
/* SWELLのパンくず */
.p-breadcrumb { background: transparent !important; }
.p-breadcrumb a { color: #888 !important; }
/* リンクのデフォルト色 */
a { color: #6cacda; }
a:hover { color: #e94560; }

/* ==========================================================
   0. SWELL レイアウト上書き（HOME・アーカイブ共通）
   ========================================================== */
body.home .l-container,
body.archive .l-container,
body.taxonomy .l-container,
body.search .l-container {
    max-width: 1400px !important;
    width: 95% !important;
    margin: 0 auto !important;
    padding: 30px 0 !important;
}

/* ── パンくずリスト ── */
.work-breadcrumb {
    max-width: 1200px;
    margin: 0 auto 12px;
    padding: 0 16px;
    font-size: 13px;
    line-height: 1.6;
}
.breadcrumb-list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0;
}
.breadcrumb-item {
    display: flex;
    align-items: center;
}
.breadcrumb-item + .breadcrumb-item::before {
    content: '>';
    margin: 0 8px;
    color: #555a70;
    font-size: 11px;
}
.breadcrumb-item a {
    color: #6cacda;
    text-decoration: none;
    transition: color 0.2s;
}
.breadcrumb-item a:hover {
    color: #90caf9;
    text-decoration: underline;
}
.breadcrumb-item.current span {
    color: #8890a4;
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}
@media (max-width: 768px) {
    .work-breadcrumb { padding: 0 12px; font-size: 12px; }
    .breadcrumb-item.current span { max-width: 180px; }
}

/* HOME・作品アーカイブではサイドバーを非表示にして全幅使用 */
/* SWELLでは固定フロントページ→ body.page / body.page-id-XX  */
body.home #sidebar,
body.page #sidebar,
body.archive #sidebar,
body.taxonomy #sidebar,
body.search #sidebar,
#sidebar {
    display: none !important;
}
body.home .l-mainContent,
body.page .l-mainContent,
body.archive .l-mainContent,
body.taxonomy .l-mainContent,
body.search .l-mainContent,
.l-mainContent {
    max-width: 100% !important;
    flex: 1 !important;
    width: 100% !important;
}
/* SWELLの2カラムレイアウトを強制1カラム化 */
body .l-content { display: block !important; }
body .l-content .l-mainContent__inner { max-width: 100% !important; }

/* 個別ページも広げる＋SWELLデフォルトサイドバー非表示 */
body.single-works .l-container {
    max-width: 1400px !important;
    width: 95% !important;
}
body.single-works #sidebar { display: none !important; }
body.single-works .l-mainContent {
    max-width: 100% !important;
    flex: 1 !important;
}

/* SWELLデフォルトの不要装飾を非表示（個別ページ） */
body.single-works .p-authorBox,
body.single-works .post_related,
body.single-works .p-entryFoot,
body.single-works .p-breadcrumb { display: none !important; }

/* SWELLの投稿ヘッダー（日付バッジ・タイトル・日時）を強制非表示 */
body.single-works .l-articleHeader,
body.single-works .p-articleHeader,
body.single-works .p-articleHeader__body,
body.single-works .p-articleHeader__top,
body.single-works .c-postTitle,
body.single-works .p-articleMetas,
body.single-works .l-article__header,
body.single-works .post-head,
body.single-works .p-articleHeader__metas,
body.single-works .c-postMeta,
body.single-works .c-postDate,
/* SWELL固有：日付バッジ（左の 2026 3/22） */
body.single-works .p-articleHeader__date,
body.single-works .c-postDate__date,
body.single-works .l-header__postDate,
/* 広範囲で非表示にするためのワイルドカード的セレクタ */
body.single-works .post_content > .l-articleHeader,
body.single-works header.p-articleHeader {
    display: none !important;
}
/* SWELLのコメントセクション：SWELL独自の装飾ヘッダーをリセット */
body.single-works .p-commentArea__title,
body.single-works .c-secTitle,
body.single-works .c-commentTitle {
    background: none !important;
    color: #333 !important;
    padding: 0 0 12px 0 !important;
    margin: 0 0 20px !important;
    font-size: 18px !important;
    font-weight: bold !important;
    border: none !important;
    border-bottom: 2px solid #f0f0f0 !important;
    border-radius: 0 !important;
}

/* ==========================================================
   1. ヒーローセクション（HOME 検索）
      ※ SWELLのコンテンツラッパー内で正しく表示されるように調整
   ========================================================== */
.home-hero {
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%) !important;
    border-radius: 16px !important;
    padding: 50px 40px !important;
    margin-bottom: 24px !important;
    color: #fff !important;
    /* SWELLの余計なスタイルをリセット */
    border: none !important;
    box-shadow: none !important;
    max-width: 100% !important;
    width: 100% !important;
}
.home-hero h2 {
    font-size: 26px !important;
    font-weight: bold !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
    color: #fff !important;
    /* SWELLのh2装飾をリセット */
    background: none !important;
    border: none !important;
    line-height: 1.4 !important;
}
.home-hero h2::before,
.home-hero h2::after {
    display: none !important;
    content: none !important;
}
.home-hero p {
    color: #8892b0 !important;
    font-size: 14px !important;
    margin: 0 0 22px !important;
}
.hero-search {
    display: flex !important;
    gap: 10px !important;
    max-width: 600px !important;
}
.hero-search input[type="text"] {
    flex: 1 !important;
    padding: 14px 20px !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    background: rgba(255, 255, 255, 0.12) !important;
    color: #fff !important;
    outline: none !important;
    box-shadow: none !important;
}
.hero-search input::placeholder { color: #778 !important; }
.hero-search input:focus { background: rgba(255, 255, 255, 0.2) !important; }
.hero-search button {
    padding: 14px 28px !important;
    border: none !important;
    border-radius: 10px !important;
    background: #e94560 !important;
    color: #fff !important;
    font-weight: bold !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: background 0.2s !important;
}
.hero-search button:hover { background: #d63851 !important; }

/* ==========================================================
   2. フィルターバー
   ========================================================== */
.filter-bar {
    display: flex !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    margin-bottom: 24px !important;
    padding: 0 4px !important;
}
.filter-label {
    font-size: 13px;
    font-weight: bold;
    color: #8892b0;
    margin-right: 4px;
}
.filter-chip {
    display: inline-block;
    padding: 7px 16px;
    border-radius: 20px;
    border: 1px solid #3a3a50;
    background: rgba(255,255,255,0.04);
    font-size: 12px;
    font-weight: 500;
    color: #b0b8c8;
    text-decoration: none !important;
    cursor: pointer;
    transition: 0.2s;
}
.filter-chip:hover { background: rgba(255,255,255,0.08); color: #e0e0e0; }
.filter-chip.on {
    background: #e94560 !important;
    color: #fff !important;
    border-color: #e94560 !important;
}
/* ジャンル別色（非アクティブ） */
.filter-chip.tag-love,
.filter-chip.tag-junai,
.filter-chip.tag-pure { border-color: rgba(216,27,96,0.4); background: rgba(216,27,96,0.1); color: #f48fb1; }
.filter-chip.tag-love.on,
.filter-chip.tag-junai.on,
.filter-chip.tag-pure.on { background: #d81b60 !important; border-color: #d81b60 !important; color: #fff !important; }

.filter-chip.tag-netori,
.filter-chip.tag-ntr,
.filter-chip.tag-uwaki { border-color: rgba(233,69,96,0.4); background: rgba(233,69,96,0.1); color: #ef9a9a; }
.filter-chip.tag-netori.on,
.filter-chip.tag-ntr.on,
.filter-chip.tag-uwaki.on { background: #c0392b !important; border-color: #c0392b !important; color: #fff !important; }

/* ── 種別チップ ── */
.filter-divider {
    color: #444;
    font-size: 16px;
    align-self: center;
}
.filter-chip.type-chip { border-color: rgba(176,190,197,0.3); background: rgba(176,190,197,0.08); color: #90a4ae; }
.filter-chip.type-chip.on { background: #546e7a !important; border-color: #546e7a !important; color: #fff !important; }
.filter-chip.type-game  { border-color: rgba(144,202,249,0.35); background: rgba(21,101,192,0.12); color: #90caf9; }
.filter-chip.type-game.on  { background: #1565c0 !important; border-color: #1565c0 !important; color: #fff !important; }
.filter-chip.type-novel { border-color: rgba(165,214,167,0.35); background: rgba(46,125,50,0.12); color: #a5d6a7; }
.filter-chip.type-novel.on { background: #2e7d32 !important; border-color: #2e7d32 !important; color: #fff !important; }
.filter-chip.type-manga { border-color: rgba(255,204,128,0.35); background: rgba(230,81,0,0.12); color: #ffcc80; }
.filter-chip.type-manga.on { background: #e65100 !important; border-color: #e65100 !important; color: #fff !important; }
.filter-chip.type-video { border-color: rgba(206,147,216,0.35); background: rgba(106,27,154,0.12); color: #ce93d8; }
.filter-chip.type-video.on { background: #6a1b9a !important; border-color: #6a1b9a !important; color: #fff !important; }
.filter-chip.type-cg    { border-color: rgba(128,203,196,0.35); background: rgba(0,105,92,0.12); color: #80cbc4; }
.filter-chip.type-cg.on { background: #00695c !important; border-color: #00695c !important; color: #fff !important; }

/* ── 種別バッジ（カード・詳細ページ） ── */
.type-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 3px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    text-decoration: none !important;
    background: rgba(176,190,197,0.1);
    color: #90a4ae;
    border: 1px solid rgba(176,190,197,0.3);
    transition: 0.15s;
}
.type-badge:hover { opacity: 0.85; }
.type-badge.type-game  { background: rgba(21,101,192,0.15); color: #90caf9; border-color: rgba(144,202,249,0.35); }
.type-badge.type-novel { background: rgba(46,125,50,0.15); color: #a5d6a7; border-color: rgba(165,214,167,0.35); }
.type-badge.type-manga { background: rgba(230,81,0,0.15); color: #ffcc80; border-color: rgba(255,204,128,0.35); }
.type-badge.type-video { background: rgba(106,27,154,0.15); color: #ce93d8; border-color: rgba(206,147,216,0.35); }
.type-badge.type-cg    { background: rgba(0,105,92,0.15); color: #80cbc4; border-color: rgba(128,203,196,0.35); }

/* アーカイブヒーロー 種別バリエーション */
.archive-hero--type { background: linear-gradient(135deg, #263238, #37474f) !important; }

/* ══════════════════════════════════════════════════
   複合フィルター UI
   ══════════════════════════════════════════════════ */

/* NTR詳細フィルター折りたたみパネル */
.ntr-filter-panel {
    background: #141425;
    border: 1px solid #2a2a3e;
    border-radius: 8px;
    margin: 0 0 8px;
    overflow: hidden;
}
.ntr-filter-panel[open] { border-color: #5e35b1; }

.ntr-filter-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 600;
    color: #b39ddb;
    user-select: none;
    list-style: none;
}
.ntr-filter-toggle::-webkit-details-marker { display: none; }
.ntr-filter-panel[open] .ntr-filter-toggle-label::first-letter { content: '▼'; }
.ntr-filter-panel[open] .ntr-filter-toggle { background: rgba(94,53,177,0.1); }

.ntr-filter-count {
    background: #4527a0;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 10px;
}

.ntr-filter-body {
    padding: 12px 16px 14px;
    border-top: 1px solid #2a2a3e;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ntr-filter-row {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    flex-wrap: wrap;
}
.ntr-filter-row .filter-label {
    flex-shrink: 0;
    margin-top: 4px;
}
.ntr-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* アクティブフィルタタグバー */
.active-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    padding: 8px 12px;
    background: rgba(255,179,0,0.08);
    border: 1px solid rgba(255,179,0,0.3);
    border-radius: 8px;
    margin: 0 0 10px;
    font-size: 13px;
}
.active-filters-label {
    font-size: 12px;
    font-weight: 600;
    color: #ffb300;
    flex-shrink: 0;
}
.active-filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    background: rgba(255,179,0,0.12);
    border: 1px solid #ffb300;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    color: #ffcc80;
    text-decoration: none !important;
    transition: 0.15s;
}
.active-filter-tag:hover {
    background: #ffb300;
    color: #1a1a2e;
}
.aft-x {
    font-size: 11px;
    opacity: 0.7;
}
.clear-all-filters {
    margin-left: auto;
    font-size: 12px;
    color: #c62828;
    text-decoration: none !important;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 4px;
    transition: 0.15s;
}
.clear-all-filters:hover {
    background: #c62828;
    color: #fff;
}

/* ══════════════════════════════════════════════════
   NTR属性バッジ（関係性・経緯・結末）
   ══════════════════════════════════════════════════ */
.attr-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 600;
    text-decoration: none !important;
    border: 1px solid;
    transition: 0.15s;
    margin: 1px 2px;
}
.attr-badge:hover { opacity: 0.85; }

/* 関係性（暖色：ピンク系） */
.attr-badge.attr-ntr_relation {
    background: rgba(136,14,79,0.15);
    color: #f48fb1;
    border-color: rgba(244,143,177,0.35);
}
/* 経緯（紫系） */
.attr-badge.attr-ntr_process {
    background: rgba(69,39,160,0.15);
    color: #b39ddb;
    border-color: rgba(179,157,219,0.35);
}
/* 結末（深い青緑系） */
.attr-badge.attr-ntr_ending {
    background: rgba(0,96,100,0.15);
    color: #80deea;
    border-color: rgba(128,222,234,0.35);
}

/* ── フィルターチップ：NTR属性 ── */
.filter-chip.attr-chip {
    border-color: rgba(206,147,216,0.35);
    background: rgba(106,27,154,0.1);
    color: #ce93d8;
}
.filter-chip.attr-chip.on {
    background: #6a1b9a !important;
    border-color: #6a1b9a !important;
    color: #fff !important;
}
/* 関係性チップ */
.filter-chip.attr-ntr_relation {
    border-color: rgba(244,143,177,0.35);
    background: rgba(136,14,79,0.1);
    color: #f48fb1;
}
.filter-chip.attr-ntr_relation.on {
    background: #880e4f !important;
    border-color: #880e4f !important;
    color: #fff !important;
}
/* 経緯チップ */
.filter-chip.attr-ntr_process {
    border-color: rgba(179,157,219,0.35);
    background: rgba(69,39,160,0.1);
    color: #b39ddb;
}
.filter-chip.attr-ntr_process.on {
    background: #4527a0 !important;
    border-color: #4527a0 !important;
    color: #fff !important;
}
/* 結末チップ */
.filter-chip.attr-ntr_ending {
    border-color: rgba(128,222,234,0.35);
    background: rgba(0,96,100,0.1);
    color: #80deea;
}
.filter-chip.attr-ntr_ending.on {
    background: #006064 !important;
    border-color: #006064 !important;
    color: #fff !important;
}

.sort-form { margin-left: auto; }
.sort-select {
    padding: 7px 14px;
    border-radius: 8px;
    border: 1px solid #2a2a3e;
    font-size: 12px;
    background: #1a1a2e;
    color: #ccc;
    cursor: pointer;
}

/* ==========================================================
   3. カードグリッド
   ========================================================== */
.card-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important;
    gap: 20px !important;
    margin-bottom: 40px !important;
    list-style: none !important;
    padding: 0 !important;
}
.work-card {
    background: #1a1a2e;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #2a2a3e;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s, box-shadow 0.2s;
}
.work-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

/* サムネイル */
.card-thumb-link {
    display: block !important;
    text-decoration: none !important;
}
.card-thumb {
    width: 100% !important;
    aspect-ratio: 4 / 3;
    background: #1a1a2e;
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
.card-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    display: block !important;
    max-width: none !important;
}
.card-thumb .no-img-text { font-size: 13px; color: #aaa; }
.rating-badge {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    background: rgba(0, 0, 0, 0.75) !important;
    color: #f1c40f !important;
    padding: 4px 10px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: bold !important;
    line-height: 1 !important;
    z-index: 2 !important;
}

/* カード本体 */
.card-body { padding: 14px 16px 16px; background: #1a1a2e; }
.card-tags { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 8px; }
.card-tag {
    display: inline-block !important;
    font-size: 10px !important;
    padding: 3px 9px !important;
    border-radius: 4px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: opacity 0.2s;
    background: rgba(57,73,171,0.15) !important;
    color: #8c9eff !important;
    border: 1px solid rgba(57,73,171,0.3);
}
.card-tag:hover { opacity: 0.8; }
.card-tag.tag-love, .card-tag.tag-junai, .card-tag.tag-pure {
    background: rgba(216,27,96,0.15) !important; color: #f48fb1 !important; border-color: rgba(216,27,96,0.3);
}
.card-tag.tag-netori, .card-tag.tag-ntr, .card-tag.tag-uwaki {
    background: rgba(233,69,96,0.15) !important; color: #ef9a9a !important; border-color: rgba(233,69,96,0.3);
}

.card-title {
    font-size: 14px !important;
    font-weight: bold !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
    line-height: 1.4 !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.card-title a { color: #e0e0e0 !important; text-decoration: none !important; }
.card-title a:hover { color: #e94560 !important; }

.card-author { font-size: 12px; color: #8892b0; margin-bottom: 10px; }
.card-author .author-link {
    color: #2376ad !important;
    text-decoration: none !important;
    font-weight: 600;
}
.card-author .author-link:hover { text-decoration: underline !important; }

.card-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    color: #666;
}
/* 販売ページボタン（カード内） */
.card-buy-btn a {
    display: inline-block !important;
    padding: 5px 14px !important;
    border-radius: 6px !important;
    background: #2376ad !important;
    color: #fff !important;
    font-size: 0 !important;        /* 元のテキストを隠す */
    text-decoration: none !important;
    transition: background 0.2s;
    line-height: 1 !important;
}
.card-buy-btn a::after {
    content: "販売ページ" !important;
    font-size: 11px !important;
    font-weight: bold;
}
.card-buy-btn a:hover { background: #1a5a8a !important; }

/* ==========================================================
   4. ページネーション
   ========================================================== */
.work-pagination { text-align: center; margin: 30px 0 50px; }
.work-pagination ul {
    list-style: none !important;
    display: flex !important;
    justify-content: center;
    gap: 6px;
    padding: 0 !important;
    margin: 0 !important;
}
.work-pagination li { list-style: none !important; }
.work-pagination a,
.work-pagination span {
    display: inline-block;
    padding: 8px 14px;
    border: 1px solid #2a2a3e;
    border-radius: 6px;
    font-size: 14px;
    color: #8892b0;
    text-decoration: none;
    background: #1a1a2e;
    transition: 0.2s;
}
.work-pagination .current {
    background: #e94560;
    color: #fff;
    border-color: #e94560;
}
.work-pagination a:hover { background: #252540; color: #e0e0e0; }

/* ==========================================================
   5. アーカイブヒーローヘッダー
   ========================================================== */
.archive-hero {
    background: linear-gradient(135deg, #16213e, #0f3460) !important;
    border-radius: 16px !important;
    padding: 36px 40px !important;
    color: #fff !important;
    margin-bottom: 28px !important;
    display: flex !important;
    align-items: center !important;
    gap: 20px !important;
}
.archive-hero.author-hero {
    background: linear-gradient(135deg, #1a1a2e, #533483) !important;
}
.archive-hero-icon {
    width: 56px;
    height: 56px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    flex-shrink: 0;
}
.archive-hero h1 {
    font-size: 22px !important;
    font-weight: bold !important;
    margin: 0 0 4px !important;
    padding: 0 !important;
    color: #fff !important;
    background: none !important;
    border: none !important;
}
.archive-hero h1::before,
.archive-hero h1::after { display: none !important; }
.archive-hero .archive-count { font-size: 13px; color: #8892b0; }

/* SWELLのデフォルトアーカイブヘッダーを非表示 */
body.post-type-archive-works .l-articleHeader,
body.post-type-archive-works .p-archiveHeader,
body.taxonomy-work_category .l-articleHeader,
body.taxonomy-work_category .p-archiveHeader,
body.taxonomy-work_author .l-articleHeader,
body.taxonomy-work_author .p-archiveHeader {
    display: none !important;
}

/* ==========================================================
   6. 個別ページ（詳細レイアウト）
   ========================================================== */
.detail-layout {
    display: grid !important;
    grid-template-columns: 320px 1fr !important;
    gap: 30px !important;
    background: #1a1a2e !important;
    border-radius: 16px !important;
    padding: 30px !important;
    border: 1px solid #2a2a3e !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2) !important;
    margin-bottom: 30px !important;
}
.detail-visual { position: relative; }
.detail-images { border-radius: 12px; overflow: hidden; }
.detail-images img {
    width: 100% !important;
    height: auto !important;
    display: block;
    border-radius: 12px;
}
.detail-no-image {
    background: #0f0f1a;
    border-radius: 12px;
    aspect-ratio: 3/4;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #555;
    font-size: 14px;
}

.detail-title {
    font-size: 22px !important;
    font-weight: bold !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
    line-height: 1.4 !important;
    color: #e0e0e0 !important;
    border: none !important;
    background: none !important;
}
.detail-title::before,
.detail-title::after { display: none !important; }

.detail-meta-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
    border: none !important;
}
.detail-meta-table tr {
    border-bottom: 1px solid #2a2a3e !important;
}
.detail-meta-table tr:last-child {
    border-bottom: none !important;
}
.detail-meta-table th {
    text-align: left;
    padding: 11px 14px;
    background: rgba(255,255,255,0.03);
    font-size: 13px;
    color: #8892b0;
    font-weight: 600;
    width: 130px;
    border-bottom: 1px solid #2a2a3e !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    white-space: nowrap;
}
.detail-meta-table td {
    padding: 11px 14px;
    font-size: 14px;
    color: #ccc;
    border-bottom: 1px solid #2a2a3e !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
}
.detail-meta-table .author-link {
    color: #6cacda !important;
    font-weight: bold;
    text-decoration: none !important;
}
.detail-meta-table .author-link:hover { text-decoration: underline !important; }

.detail-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.detail-tags .card-tag { font-size: 12px !important; padding: 4px 12px !important; }

.stars { color: #f1c40f; font-size: 18px; letter-spacing: 2px; }
.rating-num { color: #888; font-size: 13px; margin-left: 6px; }

/* CTA ボタン（販売ページ・個別ページ） */
.detail-cta-wrap { margin: 8px 0 0; }
.detail-cta-wrap a:not(.btn-platform) {
    display: inline-block !important;
    padding: 14px 36px !important;
    background: linear-gradient(135deg, #e94560, #c0392b) !important;
    color: #fff !important;
    border-radius: 10px !important;
    font-size: 0 !important;        /* 元のテキストを隠す */
    text-decoration: none !important;
    transition: opacity 0.2s;
}
.detail-cta-wrap a:not(.btn-platform)::after {
    content: "販売ページへ →" !important;
    font-size: 15px !important;
    font-weight: bold;
}
.detail-cta-wrap a:not(.btn-platform):hover { opacity: 0.9; }

.detail-desc {
    margin-top: 24px;
    font-size: 14px;
    line-height: 1.8;
    color: #aaa;
    border-top: 1px solid #2a2a3e;
    padding-top: 20px;
}

/* ── みどころ（ハイライト） ── */
.detail-highlight {
    background: rgba(255,109,0,0.08);
    border-left: 4px solid #ff6d00;
    border-radius: 0 10px 10px 0;
    padding: 14px 18px;
    margin-bottom: 18px;
}
.detail-highlight-label {
    display: inline-block;
    background: #ff6d00;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 4px;
    margin-bottom: 8px;
}
.detail-highlight p {
    font-size: 14px;
    line-height: 1.7;
    color: #e0c8a0;
    margin: 0;
}

/* ── 属性別スコアバー ── */
.detail-score-panel {
    background: rgba(255,255,255,0.03);
    border: 1px solid #2a2a3e;
    border-radius: 10px;
    padding: 16px 20px;
    margin-top: 16px;
}
.detail-score-heading {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #e0e0e0 !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
}
.score-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}
.score-row:last-child { margin-bottom: 0; }
.score-label {
    flex-shrink: 0;
    width: 90px;
    font-size: 12px;
    font-weight: 600;
    color: #8892b0;
    text-align: right;
}
.score-bar-track {
    flex: 1;
    height: 10px;
    background: #2a2a3e;
    border-radius: 5px;
    overflow: hidden;
}
.score-bar-fill {
    height: 100%;
    border-radius: 5px;
    background: linear-gradient(90deg, #ff6d00, #ff9100);
    transition: width 0.4s ease;
}
.score-value {
    flex-shrink: 0;
    width: 28px;
    font-size: 13px;
    font-weight: 700;
    color: #ff9100;
    text-align: center;
}

/* ── スタッフコメント ── */
.detail-staff-comment {
    background: rgba(123,31,162,0.1);
    border-left: 4px solid #9c27b0;
    border-radius: 0 10px 10px 0;
    padding: 14px 18px;
    margin-top: 20px;
}
.staff-comment-heading {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #ce93d8 !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
}
.detail-staff-comment p {
    font-size: 14px;
    line-height: 1.7;
    color: #d1c4e9;
    margin: 0;
}

/* 関連作品 */
.related-works-section {
    background: #1a1a2e;
    border-radius: 16px;
    padding: 30px;
    border: 1px solid #2a2a3e;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
    margin-top: 30px;
}
.related-heading {
    font-size: 18px !important;
    font-weight: bold !important;
    margin: 0 0 20px !important;
    padding: 0 0 12px 0 !important;
    border: none !important;
    border-bottom: 2px solid #2a2a3e !important;
    background: none !important;
    color: #e0e0e0 !important;
}
.related-heading::before,
.related-heading::after { display: none !important; }
.related-works-section .card-grid { margin-bottom: 0 !important; }

.no-works { text-align: center; padding: 60px 20px; color: #666; font-size: 15px; }

/* ==========================================================
   7. レビュー（星評価＋コメント）
   ========================================================== */

/* ── レビュー平均スコア ── */
.review-summary-section {
    background: #1a1a2e;
    border-radius: 16px;
    padding: 30px;
    border: 1px solid #2a2a3e;
    margin-top: 30px;
    margin-bottom: 30px;
}
.review-summary-heading {
    font-size: 18px !important;
    font-weight: bold !important;
    margin: 0 0 16px !important;
    padding: 0 0 12px 0 !important;
    border: none !important;
    border-bottom: 2px solid #2a2a3e !important;
    background: none !important;
    color: #e0e0e0 !important;
}
.review-summary-heading::before,
.review-summary-heading::after { display: none !important; }
.review-summary-box {
    display: flex;
    align-items: center;
    gap: 12px;
}
.review-avg-score {
    font-size: 36px;
    font-weight: bold;
    color: #e0e0e0;
    line-height: 1;
}
.review-avg-stars {
    color: #f1c40f;
    font-size: 22px;
    letter-spacing: 2px;
}
.review-avg-count {
    font-size: 13px;
    color: #888;
}

/* ── コメント一覧 ── */
.comments-area {
    background: #1a1a2e !important;
    border-radius: 16px !important;
    padding: 30px !important;
    border: 1px solid #2a2a3e !important;
    margin-bottom: 30px !important;
}
.comments-area .comment-reply-title,
.comments-area h2,
.comments-area h3 {
    font-size: 18px !important;
    font-weight: bold !important;
    margin: 0 0 20px !important;
    padding: 0 0 12px 0 !important;
    border: none !important;
    border-bottom: 2px solid #2a2a3e !important;
    background: none !important;
    color: #e0e0e0 !important;
}
.comments-area h2::before, .comments-area h2::after,
.comments-area h3::before, .comments-area h3::after,
.comments-area .comment-reply-title::before,
.comments-area .comment-reply-title::after { display: none !important; }

.comment-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 30px !important;
}
.comment-list .comment {
    border-bottom: 1px solid #2a2a3e;
    padding: 20px 0;
}
.comment-list .comment:last-child { border-bottom: none; }
.comment-author {
    font-weight: bold;
    font-size: 14px;
    color: #e0e0e0;
}
.comment-meta { font-size: 12px; color: #666; margin-bottom: 8px; }
.comment-content { font-size: 14px; line-height: 1.7; color: #aaa; }

/* ── 星評価の表示（コメント内） ── */
.review-stars-display {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-bottom: 6px;
}
.review-star {
    font-size: 16px;
    line-height: 1;
}
.review-star.filled { color: #f1c40f; }
.review-star.empty  { color: #333; }
.review-rating-num {
    font-size: 12px;
    color: #888;
    margin-left: 8px;
}

/* ── 星選択UI（フォーム内） ── */
.review-star-input {
    margin-bottom: 16px;
}
.review-star-input label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #ccc;
    margin-bottom: 8px;
}
.star-select {
    display: flex;
    gap: 4px;
    cursor: pointer;
}
.star-option {
    font-size: 28px;
    color: #333;
    cursor: pointer;
    transition: color 0.15s;
    user-select: none;
    line-height: 1;
}
.star-option.hover,
.star-option.selected { color: #f1c40f; }

/* ── コメントフォーム ── */
.comment-form {
    margin-top: 20px;
}
.comment-form label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #8892b0;
    margin-bottom: 6px;
}
.comment-form textarea,
.comment-form input[type="text"] {
    width: 100% !important;
    padding: 12px 16px !important;
    border: 1px solid #2a2a3e !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    background: #0f0f1a !important;
    color: #e0e0e0 !important;
    transition: border-color 0.2s;
    box-sizing: border-box;
}
.comment-form textarea:focus,
.comment-form input[type="text"]:focus {
    border-color: #e94560 !important;
    outline: none !important;
    background: #141425 !important;
}
.comment-form .comment-form-author {
    margin-bottom: 14px;
}
.comment-form .comment-form-author input {
    max-width: 300px !important;
}
.comment-form .form-submit {
    margin-top: 16px;
}
.comment-form .form-submit input[type="submit"] {
    padding: 12px 32px !important;
    background: linear-gradient(135deg, #e94560, #c0392b) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: opacity 0.2s;
}
.comment-form .form-submit input[type="submit"]:hover { opacity: 0.9; }

/* ==========================================================
   8. HOME ヒーロー内：情報投稿リンク
   ========================================================== */
.home-hero-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 4px;
}
.hero-submit-link {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    transition: background 0.2s;
    flex-shrink: 0;
}
.hero-submit-link:hover {
    background: rgba(255, 255, 255, 0.2);
}
.hero-submit-icon { font-size: 18px; }

/* ==========================================================
   9. 情報投稿ページ
   ========================================================== */

/* ── SWELLページタイトル・パンくず非表示 ── */
body.page-submit-form .l-articleHeader,
body.page-submit-form .p-articleHeader,
body.page-submit-form header.p-articleHeader,
body.page-submit-form .c-pageTitle,
body.page-submit-form .l-content__titleArea,
body.page-submit-form .c-postTitle,
body.page-submit-form .p-articleHeader__body,
body.page-submit-form .p-articleHeader__top,
body.page-submit-form .p-articleHeader__metas,
body.page-submit-form .p-articleHeader__date,
body.page-submit-form .p-breadcrumb,
body.page-submit-form .l-article__header {
    display: none !important;
}

/* ── SWELLレイアウト全面リセット ── */
body.page-submit-form .l-container {
    max-width: 860px !important;
    width: 95% !important;
    margin: 0 auto !important;
    padding: 30px 0 !important;
}
body.page-submit-form .l-mainContent,
body.page-submit-form .l-mainContent__inner,
body.page-submit-form .l-content,
body.page-submit-form .l-article,
body.page-submit-form .post_content,
body.page-submit-form .entry-content {
    display: block !important;
    max-width: 100% !important;
    width: 100% !important;
    float: none !important;
    flex-direction: column !important;
}
body.page-submit-form #sidebar { display: none !important; }

/* エディタ由来のゴミ要素を非表示 */
body.page-submit-form .post_content > p:not(:has(.submit-page-wrap)),
body.page-submit-form .post_content > p > code:empty,
body.page-submit-form .post_content > code,
body.page-submit-form .post_content > :not(.submit-page-wrap):empty {
    display: none !important;
}

/* ── .submit-page-wrap本体 ── */
.submit-page-wrap {
    max-width: 760px !important;
    margin: 0 auto !important;
    display: block !important;
    width: 100% !important;
}
.submit-page-wrap > * {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}
/* ページヒーローだけflex（アイコン横並び用） */
.submit-page-wrap > .page-hero {
    display: flex !important;
}
/* フォームもblock */
.submit-page-wrap > .post-form-card {
    display: block !important;
}

/* ── ページヒーロー ── */
.page-hero {
    background: linear-gradient(135deg, #1a1a2e, #16213e);
    border-radius: 16px;
    padding: 36px 40px;
    color: #fff;
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 28px;
}
.page-hero-icon {
    width: 56px;
    height: 56px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    flex-shrink: 0;
}
.page-hero h2 {
    font-size: 22px !important;
    font-weight: bold !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
    color: #fff !important;
    background: none !important;
    border: none !important;
}
.page-hero h2::before,
.page-hero h2::after { display: none !important; }
.page-hero p {
    font-size: 13px;
    color: #8892b0;
    margin: 0;
    line-height: 1.7;
}

/* ── 投稿フォーム ── */
.post-form-card {
    background: #1a1a2e;
    border-radius: 16px;
    padding: 28px 32px;
    border: 1px solid #2a2a3e;
    margin-bottom: 40px;
}
.post-form-card .form-group {
    margin-bottom: 18px;
}
.post-form-card label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #ccc;
    margin-bottom: 7px;
}
.post-form-card .required {
    color: #e94560;
    font-size: 11px;
    font-weight: normal;
    margin-left: 4px;
}
.post-form-card input[type="text"],
.post-form-card textarea {
    width: 100%;
    padding: 11px 14px;
    border: 1px solid #2a2a3e;
    border-radius: 8px;
    font-size: 14px;
    background: #0f0f1a;
    color: #e0e0e0;
    transition: border-color 0.2s;
    box-sizing: border-box;
    font-family: inherit;
}
.post-form-card input[type="text"]:focus,
.post-form-card textarea:focus {
    border-color: #e94560;
    outline: none;
    background: #141425;
}
.post-form-card input[type="text"] {
    max-width: 280px;
}
.post-form-card textarea {
    resize: vertical;
    min-height: 150px;
    line-height: 1.7;
}
.form-note {
    display: block;
    font-size: 11px;
    color: #999;
    margin-top: 4px;
}
.form-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 8px;
}

.submit-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 13px 36px;
    background: linear-gradient(135deg, #e94560, #c0392b);
    color: #fff;
    border: none;
    border-radius: 10px;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    transition: opacity 0.2s, transform 0.15s;
}
.submit-btn:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}
.submit-btn svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

/* ══════════════════════════════════════════════════
   3ステップフォーム UI
   ══════════════════════════════════════════════════ */

/* ステッパー（進捗バー） */
.form-stepper {
    display: flex;
    align-items: center;
    gap: 0;
    margin: 0 0 24px;
    padding: 16px 20px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
}
.stepper-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    opacity: 0.4;
    transition: opacity 0.2s;
}
.stepper-step.active { opacity: 1; }
.stepper-step.done   { opacity: 0.75; }
.stepper-num {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #e0e0e0;
    color: #666;
    font-size: 14px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.2s;
}
.stepper-step.active .stepper-num {
    background: #c62828;
    color: #fff;
}
.stepper-step.done .stepper-num {
    background: #4caf50;
    color: #fff;
}
.stepper-step.done .stepper-num::after {
    content: '✓';
}
.stepper-step.done .stepper-num { font-size: 0; }
.stepper-step.done .stepper-num::after { font-size: 14px; }
.stepper-label {
    font-size: 11px;
    font-weight: 600;
    color: #555;
    white-space: nowrap;
}
.stepper-step.active .stepper-label { color: #c62828; }
.stepper-line {
    flex: 1;
    height: 2px;
    background: #e0e0e0;
    margin: 0 6px;
    margin-bottom: 18px;
    transition: background 0.3s;
}
.stepper-line.done { background: #4caf50; }

/* ステップパネル */
.form-step { animation: fadeInStep 0.2s ease; }
@keyframes fadeInStep { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.step-heading {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #333 !important;
    margin: 0 0 20px !important;
    padding-bottom: 10px !important;
    border-bottom: 2px solid #f5f5f5 !important;
}
.step-optional {
    font-size: 12px;
    font-weight: 400;
    color: #999;
}

/* ステップナビ（次へ / 戻る） */
.step-nav {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid #f0f0f0;
}
.step-next-btn {
    background: #c62828;
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 10px 22px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    transition: 0.15s;
}
.step-next-btn:hover { background: #b71c1c; }
.step-back-btn {
    background: transparent;
    color: #888;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 10px 18px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: 0.15s;
}
.step-back-btn:hover { background: #f5f5f5; color: #333; }

/* ラジオチップ（種別選択） */
.radio-chip-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.radio-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 7px 16px;
    border: 2px solid #e0e0e0;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: 0.15s;
    user-select: none;
    color: #555;
}
.radio-chip input[type="radio"] { display: none; }
.radio-chip:hover { border-color: #c62828; color: #c62828; }
.radio-chip:has(input:checked) {
    border-color: #c62828;
    background: #c62828;
    color: #fff;
}

/* チェックボックスチップ（関係性・経緯・結末） */
.check-chip-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.check-chip {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    border: 1px solid #e0e0e0;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: 0.15s;
    user-select: none;
    color: #555;
}
.check-chip input[type="checkbox"] { display: none; }
.check-chip:hover { border-color: #888; }
.check-chip:has(input:checked) { border-color: #4527a0; background: #4527a0; color: #fff; }
.check-relation:has(input:checked) { border-color: #880e4f; background: #880e4f; }
.check-process:has(input:checked) { border-color: #4527a0; background: #4527a0; }
.check-ending:has(input:checked)  { border-color: #006064; background: #006064; }

/* 入力エラー */
.input-error {
    border-color: #c62828 !important;
    box-shadow: 0 0 0 2px rgba(198,40,40,0.15) !important;
}
.field-error-msg {
    display: block;
    color: #c62828;
    font-size: 12px;
    font-weight: 600;
    margin-top: 4px;
}

/* 入力内容プレビュー */
.submit-preview {
    background: #f8f9fa;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    padding: 16px 20px;
    margin: 20px 0 0;
}
.preview-heading {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #333 !important;
    margin: 0 0 12px !important;
}
.preview-row {
    display: flex;
    gap: 12px;
    font-size: 13px;
    padding: 6px 0;
    border-bottom: 1px solid #eee;
}
.preview-row:last-child { border-bottom: none; }
.preview-key {
    flex-shrink: 0;
    width: 100px;
    font-weight: 600;
    color: #888;
    font-size: 12px;
}
.preview-val {
    color: #333;
    word-break: break-all;
}

/* ── 成功・エラー ── */
.submit-success {
    background: #d4edda;
    border: 1px solid #c3e6cb;
    color: #155724;
    padding: 16px 24px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    margin-bottom: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.submit-success-icon { font-size: 18px; }
.submit-error {
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    color: #721c24;
    padding: 12px 20px;
    border-radius: 8px;
    font-size: 14px;
    margin-bottom: 16px;
}

/* ── 投稿一覧フィード ── */
.posts-feed {
    margin-top: 10px;
}
.posts-feed-title {
    font-size: 17px !important;
    font-weight: bold !important;
    color: #1a1a2e !important;
    margin: 0 0 20px !important;
    padding: 0 0 12px !important;
    border-bottom: 2px solid #e94560 !important;
    background: none !important;
    display: flex;
    align-items: center;
    gap: 8px;
}
.posts-feed-title::before,
.posts-feed-title::after { display: none !important; }
.posts-feed-icon { font-size: 19px; }
.posts-feed-count {
    font-size: 12px;
    font-weight: normal;
    color: #fff;
    background: #e94560;
    padding: 2px 10px;
    border-radius: 20px;
    margin-left: 6px;
}

.posts-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.post-card {
    background: #fff;
    border-radius: 12px;
    padding: 20px 24px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.04);
    border-left: 4px solid #e94560;
    transition: box-shadow 0.2s, transform 0.15s;
}
.post-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.09);
    transform: translateY(-1px);
}
.post-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}
.post-author {
    font-weight: 600;
    font-size: 13px;
    color: #1a1a2e;
    background: #eef0f5;
    padding: 3px 10px;
    border-radius: 6px;
}
.post-date {
    font-size: 12px;
    color: #aaa;
}
.post-num {
    font-size: 11px;
    color: #bbb;
    margin-left: auto;
}
.post-body {
    font-size: 14px;
    color: #444;
    line-height: 1.85;
    white-space: pre-wrap;
    word-break: break-word;
}

/* ── ページネーション ── */
.posts-pagination {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 28px;
}
.posts-pagination a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: #fff;
    color: #333;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid #ddd;
    transition: all 0.2s;
}
.posts-pagination a:hover {
    background: #f0f0f5;
    border-color: #bbb;
}
.posts-pagination a.active {
    background: linear-gradient(135deg, #e94560, #c0392b);
    color: #fff;
    border-color: transparent;
    pointer-events: none;
}

/* ==========================================================
   10. レスポンシブ
   ========================================================== */
@media (max-width: 1024px) {
    .card-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important; gap: 16px !important; }
    .detail-layout { grid-template-columns: 1fr !important; }
    .detail-images img { max-width: 400px; }
}
@media (max-width: 768px) {
    .home-hero { padding: 30px 24px !important; }
    .home-hero h2 { font-size: 20px !important; }
    .home-hero-top { flex-direction: column; gap: 12px; }
    .hero-submit-link { align-self: flex-start; }
    .hero-search { flex-direction: column !important; }
    .hero-search button { width: 100%; }
    .card-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 12px !important; }
    .filter-bar { gap: 6px !important; }
    .filter-chip { padding: 5px 12px; font-size: 11px; }
    .archive-hero { padding: 24px !important; flex-direction: column !important; text-align: center; }
    .detail-layout { padding: 20px !important; gap: 20px !important; }
    .detail-title { font-size: 18px !important; }
    .page-hero { padding: 24px; flex-direction: column; }
    .page-hero h2 { font-size: 19px !important; }
    .post-form-card { padding: 20px; }
    .post-card { padding: 16px 18px; }
    .posts-feed-title { font-size: 15px !important; }
    .form-actions { justify-content: stretch; }
    .submit-btn { width: 100%; justify-content: center; }
    /* 複合フィルター モバイル */
    .ntr-filter-row { flex-direction: column; gap: 4px; }
    .ntr-filter-row .filter-label { margin-top: 0; }
    .active-filters { padding: 8px; }
    .clear-all-filters { margin-left: 0; }
    /* 3ステップフォーム モバイル */
    .form-stepper { padding: 12px; }
    .stepper-label { font-size: 10px; }
    .step-nav { flex-direction: column-reverse; }
    .step-next-btn, .step-back-btn { width: 100%; text-align: center; }
    .radio-chip-group, .check-chip-group { gap: 6px; }
    .preview-key { width: 80px; }
}
@media (max-width: 480px) {
    .card-grid { grid-template-columns: 1fr !important; }
}

/* ═══════════════════════════════════════════════════
   プラットフォーム別ボタン
   ═══════════════════════════════════════════════════ */

/* ── 共通ボタンスタイル ── */
.btn-platform {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.3em !important;
    padding: 0.45em 1em !important;
    border-radius: 6px !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    color: #fff !important;
    text-decoration: none !important;
    transition: opacity 0.2s, transform 0.15s !important;
    line-height: 1.4 !important;
    position: relative !important;
    z-index: 5 !important;
    background-image: none !important;
}
.btn-platform:hover {
    opacity: 0.85 !important;
    transform: translateY(-1px) !important;
    color: #fff !important;
    text-decoration: none !important;
}
.btn-platform::before,
.btn-platform::after {
    content: none !important;
    display: none !important;
}

/* ── プラットフォーム別カラー ── */
.btn-dlsite   { background: #0068b7 !important; }
.btn-fanza    { background: #ff6a00 !important; }
.btn-nocturne { background: #5b3c8e !important; }
.btn-pixiv    { background: #0096fa !important; }

/* ── カード内ボタンラッパー ── */
.card-platform-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 6px;
}
.card-platform-btns .btn-platform {
    font-size: 0.72rem !important;
    padding: 0.3em 0.6em !important;
}

/* ── 個別ページCTAラッパー（プラットフォームボタン用） ── */
.detail-cta-wrap .btn-platform {
    font-size: 0.95rem !important;
    padding: 0.55em 1.3em !important;
    z-index: 5 !important;
    position: relative !important;
}

/* ── 投稿フォーム：プラットフォームURL入力グループ ── */
.platform-url-group > label {
    font-weight: 600;
    margin-bottom: 0.5em;
    display: block;
}
.platform-url-row {
    display: flex;
    align-items: center;
    gap: 0.6em;
    margin-bottom: 0.5em;
}
.platform-url-label {
    min-width: 6.5em;
    font-size: 0.85rem;
    font-weight: 600;
    white-space: nowrap;
}
.platform-url-row input[type="url"] {
    flex: 1;
}

/* ── プラットフォームボタン レスポンシブ ── */
@media (max-width: 600px) {
    .platform-url-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.2em;
    }
    .platform-url-row input[type="url"] {
        width: 100%;
    }
    .detail-cta-wrap .btn-platform {
        font-size: 0.85rem !important;
        padding: 0.5em 1em !important;
        flex: 1 1 auto;
        justify-content: center;
    }
}

/* ═══════════════════════════════════════════════════
   右サイドバー（ライトテーマ）
   ═══════════════════════════════════════════════════ */

/* ── メイン + サイドバー Flexラッパー ── */
.works-with-sidebar {
    display: flex !important;
    gap: 24px !important;
    align-items: flex-start !important;
}
.works-main-col {
    flex: 1 !important;
    min-width: 0 !important;
}
/* サイドバー有りの時はカードグリッドを少し縮める */
.works-with-sidebar .card-grid {
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important;
}

/* ── サイドバー本体 ── */
.site-sidebar {
    width: 270px !important;
    flex-shrink: 0 !important;
    background: #141425 !important;
    border-radius: 14px !important;
    border: 1px solid #2a2a3e !important;
    position: sticky !important;
    top: 80px !important;
    max-height: calc(100vh - 100px) !important;
    overflow-y: auto !important;
    scrollbar-width: thin;
    scrollbar-color: #2a2a3e #141425;
}
.site-sidebar::-webkit-scrollbar { width: 5px; }
.site-sidebar::-webkit-scrollbar-track { background: #141425; }
.site-sidebar::-webkit-scrollbar-thumb { background: #2a2a3e; border-radius: 4px; }

/* 閉じるボタン（モバイル用。PCでは非表示） */
.sidebar-close {
    display: none;
    position: absolute;
    top: 10px; right: 12px;
    background: none; border: none;
    color: #8892b0; font-size: 24px;
    cursor: pointer; z-index: 10;
}

/* ── セクション共通 ── */
.sb-section {
    border-bottom: 1px solid #1e1e30;
}
.sb-section-toggle {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
    padding: 11px 14px !important;
    background: none !important;
    border: none !important;
    color: #e0e0e0 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    list-style: none !important;
    user-select: none;
}
.sb-section-toggle::-webkit-details-marker { display: none; }
.sb-section[open] .sb-section-toggle { background: rgba(233,69,96,0.06) !important; }
.sb-icon { font-size: 14px; }
.sb-section-body { padding: 6px 14px 14px; }

/* ── ジャンルリスト ── */
.sb-genre-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.sb-genre-link {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 7px 10px !important;
    border-radius: 8px !important;
    color: #ccc !important;
    text-decoration: none !important;
    font-size: 13px !important;
    transition: background 0.15s !important;
}
.sb-genre-link:hover {
    background: rgba(255,255,255,0.05) !important;
    color: #fff !important;
}
.sb-genre-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #e94560;
    flex-shrink: 0;
}
/* ジャンル別ドット色 */
.sb-genre-dot.genre-netori,
.sb-genre-dot.genre-ntr,
.sb-genre-dot.genre-uwaki   { background: #c0392b; }
.sb-genre-dot.genre-netorase { background: #e94560; }
.sb-genre-dot.genre-love,
.sb-genre-dot.genre-junai,
.sb-genre-dot.genre-pure     { background: #e91e8b; }

.sb-genre-name {
    flex: 1;
}
.sb-genre-count {
    font-size: 11px;
    font-weight: 600;
    color: #8892b0;
    background: #1e1e30;
    padding: 2px 8px;
    border-radius: 10px;
}

/* ── 種別グリッド ── */
.sb-type-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
}
.sb-type-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 3px !important;
    padding: 10px 6px !important;
    border-radius: 10px !important;
    background: #1a1a2e !important;
    border: 1px solid #2a2a3e !important;
    color: #ccc !important;
    text-decoration: none !important;
    font-size: 12px !important;
    transition: border-color 0.15s, background 0.15s !important;
}
.sb-type-card:hover {
    border-color: #e94560 !important;
    background: rgba(233,69,96,0.08) !important;
}
.sb-type-icon { font-size: 20px; }
.sb-type-name { font-weight: 600; color: #e0e0e0; }
.sb-type-count { font-size: 10px; color: #666; }
/* 種別カード色バリエーション */
.sb-type-card.type-game:hover  { border-color: #1565c0 !important; background: rgba(21,101,192,0.1) !important; }
.sb-type-card.type-novel:hover { border-color: #2e7d32 !important; background: rgba(46,125,50,0.1) !important; }
.sb-type-card.type-manga:hover { border-color: #e65100 !important; background: rgba(230,81,0,0.1) !important; }
.sb-type-card.type-video:hover { border-color: #6a1b9a !important; background: rgba(106,27,154,0.1) !important; }
.sb-type-card.type-cg:hover    { border-color: #00695c !important; background: rgba(0,105,92,0.1) !important; }

/* ── 属性チップ ── */
.sb-chip-group {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}
.sb-chip {
    display: inline-block !important;
    padding: 4px 10px !important;
    border-radius: 14px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    background: transparent !important;
    border: 1px solid #2a2a3e !important;
    color: #8892b0 !important;
    transition: 0.15s !important;
    cursor: pointer !important;
}
.sb-chip:hover { border-color: #555 !important; color: #e0e0e0 !important; }
.sb-chip.on {
    color: #fff !important;
}
.sb-chip.attr-ntr_relation     { border-color: #f48fb155; color: #f48fb1; }
.sb-chip.attr-ntr_relation.on  { background: #880e4f !important; border-color: #880e4f !important; }
.sb-chip.attr-ntr_process      { border-color: #b39ddb55; color: #b39ddb; }
.sb-chip.attr-ntr_process.on   { background: #4527a0 !important; border-color: #4527a0 !important; }
.sb-chip.attr-ntr_ending       { border-color: #80deea55; color: #80deea; }
.sb-chip.attr-ntr_ending.on    { background: #006064 !important; border-color: #006064 !important; }

/* ── 人気ランキング ── */
.sb-rank-item {
    display: flex !important;
    gap: 10px !important;
    align-items: flex-start !important;
    padding: 8px 10px !important;
    border-radius: 8px !important;
    background: #1a1a2e !important;
    border: 1px solid #2a2a3e !important;
    margin-bottom: 6px !important;
    text-decoration: none !important;
    transition: border-color 0.15s !important;
}
.sb-rank-item:hover {
    border-color: #e94560 !important;
}
.sb-rank-num {
    width: 24px; height: 24px;
    border-radius: 6px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    color: #fff; font-size: 12px; font-weight: 800;
    background: #555;
}
.sb-rank-num.rank-1 { background: #f1c40f; }
.sb-rank-num.rank-2 { background: #95a5a6; }
.sb-rank-num.rank-3 { background: #cd7f32; }
.sb-rank-info { flex: 1; min-width: 0; }
.sb-rank-title {
    display: block;
    font-size: 12px; font-weight: 600; color: #e0e0e0;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sb-rank-meta { display: flex; gap: 8px; margin-top: 3px; }
.sb-rank-stars { font-size: 10px; color: #f1c40f; }
.sb-rank-meta .type-badge { font-size: 9px !important; padding: 1px 6px !important; }

/* ── 最近の投稿 ── */
.sb-recent-item {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 6px 8px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: background 0.15s !important;
}
.sb-recent-item:hover { background: rgba(255,255,255,0.04) !important; }
.sb-recent-dot {
    width: 4px; height: 4px;
    border-radius: 50%;
    background: #e94560;
    flex-shrink: 0;
}
.sb-recent-title {
    flex: 1;
    font-size: 12px; color: #ccc;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.sb-recent-date {
    font-size: 10px; color: #666; flex-shrink: 0;
}

/* ── タグクラウド ── */
.sb-tag-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
}
.sb-cloud-tag {
    color: #666 !important;
    text-decoration: none !important;
    padding: 2px 4px;
    transition: color 0.15s !important;
}
.sb-cloud-tag:hover { color: #e94560 !important; }

/* ── 統計 ── */
.sb-stats {
    padding: 14px !important;
    border-bottom: none !important;
}
.sb-stats-title {
    font-size: 11px;
    color: #666;
    text-align: center;
    margin-bottom: 8px;
}
.sb-stats-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 6px;
}
.sb-stat-card {
    text-align: center;
    padding: 8px 4px;
    background: #1a1a2e;
    border-radius: 8px;
    border: 1px solid #2a2a3e;
}
.sb-stat-num {
    display: block;
    font-size: 16px; font-weight: 800; color: #e94560;
}
.sb-stat-label {
    display: block;
    font-size: 10px; color: #666;
}

/* ── モバイルハンバーガーボタン ── */
.sidebar-toggle-btn {
    display: none;
    position: fixed;
    bottom: 20px; right: 20px;
    z-index: 999;
    padding: 12px 20px;
    border-radius: 30px;
    border: none;
    background: linear-gradient(135deg, #e94560, #c0392b);
    color: #fff;
    font-size: 14px; font-weight: 700;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(233,69,96,0.4);
    transition: transform 0.2s;
}
.sidebar-toggle-btn:hover { transform: translateY(-2px); }

/* ── オーバーレイ ── */
.sidebar-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1000;
    opacity: 0;
    transition: opacity 0.3s;
}
.sidebar-overlay.open {
    display: block;
    opacity: 1;
}

/* ── レスポンシブ: 768px以下でドロワー化 ── */
@media (max-width: 768px) {
    .works-with-sidebar {
        flex-direction: column !important;
    }
    .works-with-sidebar .card-grid {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important;
    }
    .site-sidebar {
        position: fixed !important;
        top: 0 !important; right: -300px !important;
        width: 280px !important;
        height: 100vh !important;
        max-height: 100vh !important;
        border-radius: 0 !important;
        border: none !important;
        border-left: 1px solid #2a2a3e !important;
        z-index: 1001 !important;
        transition: right 0.3s ease !important;
    }
    .site-sidebar.open {
        right: 0 !important;
    }
    .sidebar-close {
        display: block !important;
    }
    .sidebar-toggle-btn {
        display: block !important;
    }
}