@charset "utf-8";

/*
Theme Name: Hino-tama Basic - Suika-FX Edition
Author: Hinnon@Hino-tama Workshop / Refined by Suika
Author URI: https://www.hino-tama.com/
Description: 『水迦 FXレジスタンス・ラボ』専用に兵器化されたサイバーパンク・ミニマリズムテーマ。
Version: 1.1.0
*/

/**
 * INDEX
 * 1. Variables & Base (サイバーパンク・ダークモード最適化)
 * 2. Layout (Flexbox Implementation)
 * 3. Header & Navigation (サイバーXボタン導線)
 * 4. Main Content (Loop & Single)
 * 5. Headings
 * 6. Pagination
 * 7. Breadcrumbs
 * 8. Footer (入場規律・心理防壁)
 * 9. Footer Navigation
 * 10. Sidebar & Widgets
 * 11. Responsive Optimization
 * 12. Mail form
 * 13. Sitemap Page
 * 14. Bento UI (Resistance Lab Core) ※新規追加
 */

/* ==========================================================================
   1. Variables & Base
   ========================================================================== */
:root {
    --primary-color: #39ff14;    /* サイバーグリーン（ネオン発光） */
    --accent-color: #1e90ff;     /* ドジャーブルー */
    --bg-color: #05070a;         /* 漆黒（完全な黒を超えた闇） */
    --text-color: #e0e6ed;       /* メインテキスト（視認性の高いライトグレー） */
    --card-bg: rgba(16, 22, 32, 0.5); /* Bentoカード背景（半透明） */
    --card-border: rgba(59, 255, 20, 0.15); /* カード境界線の淡い発光 */

    --body-font: 'Noto Sans JP', sans-serif;
    --font-serif: 'Noto Serif JP', serif;
    --font-outfit: 'Outfit', sans-serif;
    --font-cyber: 'Orbitron', 'Share Tech Mono', sans-serif; /* テック系フォント */
    --max-width: 1200px;
}

html {
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: scroll;
    font-size: 16px;
    background-color: var(--bg-color);
}

*, *::before,
*::after {
    box-sizing: inherit;
}

body {
    margin: 0;
    padding: 0;
    font-family: var(--body-font);
    line-height: 1.7;
    color: var(--text-color);
    background-color: var(--bg-color);
    -webkit-text-size-adjust: 100%;
}

a,
a:link,
a:visited {
    color: var(--accent-color);
    text-decoration: none;
    transition: all 0.2s ease-in-out;
}

a:hover {
    opacity: 0.8;
    color: var(--primary-color);
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

/* ==========================================================================
   2. Layout (Flexbox Implementation)
   ========================================================================== */

.home-top {
    width: 100%;
}

.container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    max-width: var(--max-width, 1200px);
    margin: 0 auto;
    margin-top: 148px; /* ヘッダーの高さを考慮 */
    padding: 2rem 1.25rem;
    position: relative;
}

/* トップページ（Bento UI）展開時はコンテナの余白と幅をフルに活かす */
.home-system-active {
    max-width: 100%;
    padding: 0;
    margin-bottom: 0;
}

.contents {
    flex: 1;
    min-width: 0;
}

.has-sidebar .contents {
    flex: 0 0 var(--contents-width, 70%);
    max-width: var(--contents-width, 70%);
}

.has-sidebar .sidebar {
    flex: 0 0 var(--sidebar-width, 27%);
    max-width: var(--sidebar-width, 27%);
}

.no-sidebar .contents,
.no-sidebar .home-top {
    flex: none !important;
    width: 100%;
    max-width: var(--one-column-width, 850px);
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ==========================================================================
   3. Header & Navigation
   ========================================================================== */

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 148px;
    z-index: 100;
    background-color: rgba(5, 7, 10, 0.85);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(57, 255, 20, 0.2); /* サイバーグリーン細線 */
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.5);
}

.header-inner {
    position: relative;
    display: flex;
    width: 100%;
    height: 148px;
    max-width: var(--max-width);
    margin: 0 auto;
    padding: 0 1.25rem;
    align-items: center;
    justify-content: space-between; /* Xリンクを右端へ */
}

.site-title-wrap img {
    display: block;
    width: auto;
    height: 80px; /* テック系ロゴの収まりを考慮して微微調整 */
}

.admin-bar header {
    top: 32px;
}

@media screen and (max-width: 782px) {
    .admin-bar header {
        top: 46px;
    }
}

/* X（旧Twitter）専用のサイバーボタンデザイン */
.btn-cyber-x {
    display: inline-flex;
    align-items: center;
    font-family: var(--font-cyber);
    font-weight: bold;
    color: var(--primary-color) !important;
    border: 1px solid var(--primary-color);
    padding: 10px 24px;
    border-radius: 4px;
    letter-spacing: 2px;
    background: rgba(57, 255, 20, 0.05);
    box-shadow: 0 0 10px rgba(57, 255, 20, 0.2);
    text-transform: uppercase;
}

.btn-cyber-x:hover {
    background: var(--primary-color);
    color: var(--bg-color) !important;
    box-shadow: 0 0 20px var(--primary-color);
    opacity: 1;
}

/* 余計な通常メニューはトップページでは非表示 */
.home-system-active .header-nav-wrap {
    display: none;
}

/* ==========================================================================
   4. Main Content (Loop & Single)
   ========================================================================== */

article {
    margin-top: 3rem;
}

.article-list {
    display: flex;
    padding: 1rem 0;
    border-bottom: 1px solid var(--primary-color);
    position: relative;
}

/* ==========================================================================
   5. Headings
   ========================================================================== */

.entry-title,
.article-content h1 {
    font-size: 1.85rem;
    line-height: 1.3;
    margin-bottom: 2rem;
    font-weight: bold;
    color: #fff;
    border-bottom: 1px solid var(--accent-color);
    padding-bottom: 10px;
}

.article-content h2 {
    font-size: 1.6rem;
    padding: 0.6rem 0 0.6rem 1rem;
    margin: 4rem 0 1.5rem;
    border-left: 6px solid var(--primary-color);
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

/* ==========================================================================
   8. Footer
   ========================================================================== */
.footer {
    background-color: #010203;
    color: rgba(255, 255, 255, 0.5);
    padding: 3rem 0 2rem;
    border-top: 1px solid rgba(30, 144, 255, 0.2); /* ドジャーブルーの防壁線 */
}

.footer-discipline {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 1.25rem;
    text-align: center;
    font-size: 0.85rem;
    letter-spacing: 1.5px;
    line-height: 1.8;
    color: #8899a6;
}

.copyright-wrap {
    text-align: center;
    font-family: var(--font-outfit);
    font-size: 0.8rem;
    margin-top: 2rem;
    color: rgba(255, 255, 255, 0.3);
}

/* ==========================================================================
   11. Responsive Optimization
   ========================================================================== */

@media (max-width: 800px) {
    .container {
        flex-direction: column;
        margin-top: 100px;
    }

    .site-title-wrap img {
        height: 50px;
    }

    header {
        height: 100px;
    }

    .header-inner {
        height: 100px;
    }

    .btn-cyber-x {
        padding: 6px 14px;
        font-size: 0.8rem;
    }
}

/* ==========================================================================
   14. Bento UI (Resistance Lab Core) ── 完全融合版
   ========================================================================== */

/* サイト全体にうっすらとデジタルドット・グリッドの背景を敷く */
body {
    background-image:
        radial-gradient(rgba(57, 255, 20, 0.05) 1px, transparent 1px),
        radial-gradient(rgba(30, 144, 255, 0.03) 1px, transparent 1px);
    background-size: 24px 24px;
    background-position: 0 0, 12px 12px;
}

/* 1. グリッドコンテナ：ヘッダー分の余白を確実に作り、縦潰れを防ぐ */
.bento-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    /* 1マスの最小高さを300pxに保証し、コンテンツによる縦潰れを完全阻止 */
    grid-template-rows: repeat(2, minmax(300px, 1fr));
    gap: 24px;
    width: 100%;
    max-width: var(--max-width);
    margin: 148px auto 40px; /* ★148px：これで上のヘッダーとのめり込みを完全に防ぎます */
    padding: 20px;
    height: auto; /* 高さを自動可変にして、はみ出しを防止 */
    min-height: calc(100vh - 148px - 120px); /* 画面サイズに余裕があれば綺麗に引き伸ばす */
    box-sizing: border-box;
}

/* 2. 各カード：中身が詰まっても破綻しないようにクッション調整 */
.bento-card {
    position: relative;
    background: linear-gradient(135deg, rgba(10, 16, 26, 0.75) 0%, rgba(5, 7, 10, 0.95) 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 4px;
    padding: 30px; /* 内側の余白を少しだけスマートに調整 */
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 20px; /* 上下のテキストとボタンが絶対に被らないための防壁 */
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.6);
}

/* カードの四隅のハイテクインジケーター（L字装飾） */
.bento-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 12px; height: 12px;
    border-top: 2px solid rgba(255, 255, 255, 0.15);
    border-left: 2px solid rgba(255, 255, 255, 0.15);
    transition: all 0.3s ease;
}

/* ホバー時にカード全体が覚醒 */
.bento-card:hover {
    transform: translateY(-4px);
    border-color: rgba(255, 255, 255, 0.2);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.8), inset 0 0 15px rgba(30, 144, 255, 0.05);
}

.bento-card:hover::before {
    border-color: var(--accent-color);
}

/* CARD 01：基本支給品（グリーンアクセント） */
.card-01 {
    border-left: 4px solid var(--primary-color);
}
.card-01:hover::before {
    border-color: var(--primary-color);
}
.card-01:hover {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.8), inset 0 0 15px rgba(57, 255, 20, 0.05);
}

/* CARD 02：レジスタンス思想（ブルーアクセント） */
.card-02 {
    border-left: 4px solid var(--accent-color);
}

/* テキストコンポーネント */
.card-meta {
    font-family: var(--font-cyber);
    font-size: 0.75rem;
    color: var(--accent-color);
    letter-spacing: 2px;
    margin-bottom: 8px;
}

.card-title {
    font-family: var(--font-cyber);
    font-size: 1.6rem;
    font-weight: 800;
    margin: 0 0 12px 0;
    color: #fff;
    letter-spacing: 1px;
}

.card-desc {
    font-size: 0.95rem;
    color: #8899a6;
    margin: 0 0 20px 0;
    line-height: 1.6;
}

/* CARD 02（思想）の強調テキスト演出 */
.card-02 .card-desc p {
    font-family: var(--body-font);
    letter-spacing: 1px;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.1);
}

/* 💀 箇条書きの丸ポチをサイバー矢印へハック */
.card-desc ul {
    list-style: none !important;
    padding-left: 0 !important;
    margin-top: 15px !important;
}

.card-desc li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 12px;
    font-size: 0.9rem;
    color: #ccd6f6 !important;
}

.card-desc li::before {
    content: "➔";
    position: absolute;
    left: 0;
    color: var(--primary-color);
    font-family: var(--font-cyber);
    font-weight: bold;
}

/* タグ演出 */
.tag-live {
    background: rgba(57, 255, 20, 0.15);
    color: var(--primary-color);
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.7rem;
    margin-left: 10px;
    border: 1px solid var(--primary-color);
}

/* サイバーアクションボタン（起動スイッチ化） */
.btn-cyber-action {
    display: block;
    width: 100%;
    text-align: center;
    font-family: var(--font-cyber);
    font-weight: 700;
    font-size: 0.9rem;
    letter-spacing: 2px;
    padding: 16px;
    background: rgba(30, 144, 255, 0.03);
    border: 1px solid rgba(30, 144, 255, 0.4);
    color: var(--accent-color) !important;
    border-radius: 2px;
    text-transform: uppercase;
    position: relative;
    transition: all 0.3s ease;
}

.btn-cyber-action:hover {
    background: var(--accent-color) !important;
    color: #000 !important;
    box-shadow: 0 0 25px var(--accent-color);
    border-color: var(--accent-color);
    opacity: 1;
}

/* CARD 01 のボタンはグリーン発光 */
.card-01 .btn-cyber-action {
    background: rgba(57, 255, 20, 0.02);
    border-color: rgba(57, 255, 20, 0.4);
    color: var(--primary-color) !important;
}

.card-01 .btn-cyber-action:hover {
    background: var(--primary-color) !important;
    color: #000 !important;
    box-shadow: 0 0 25px var(--primary-color);
    border-color: var(--primary-color);
}

/* 🔒 LOCKEDカードのディープスモーク＆バッジ演出 */
.bento-card.locked {
    pointer-events: none;
    user-select: none;
    background: rgba(4, 6, 9, 0.92);
    border: 1px dashed rgba(255, 255, 255, 0.05) !important;
}

/* スモークガラス */
.bento-card.locked::after {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: radial-gradient(rgba(0, 0, 0, 0.4) 30%, rgba(5, 7, 10, 0.9));
    backdrop-filter: blur(6px) grayscale(100%);
    z-index: 2;
}

/* LOCKED中央バッジ（L字装飾をバッジに書き換え） */
.bento-card.locked::before {
    content: '🔒 LOCKED / UNDER DEV';
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    font-family: var(--font-cyber);
    font-size: 0.85rem;
    font-weight: bold;
    color: rgba(255, 255, 255, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.3);
    padding: 6px 16px;
    background: rgba(0, 0, 0, 0.8);
    letter-spacing: 2px;
    border-radius: 4px;
    z-index: 3;
    white-space: nowrap;
    width: auto;
    height: auto;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    border-left: 1px solid rgba(255, 255, 255, 0.3);
}

/* CARD 04：検証ログ背景用 */
.card-04 {
    background-image: url('images/v-chart-opaque.png');
    background-size: cover;
    background-position: center;
}

/* ==========================================================================
   Bento UI スマホ対応（レスポンシブフォールバック）
   ========================================================================== */
@media (max-width: 800px) {
    .bento-grid {
        grid-template-columns: 1fr !important;
        grid-template-rows: auto;
        height: auto;
        gap: 16px;
        padding: 16px;
    }

    .card-01 { order: 1; }
    .card-02 { order: 2; }
    .card-03 { order: 3; }
    .card-04 { order: 4; }

    .card-title {
        font-size: 1.3rem;
    }
}

/* ==========================================================================
   15. Resistance OS / Page Typography (思想論文・読書特化仕様)
   ========================================================================== */

/* 固定ページ全体のレイアウトを「1カラム・読書集中モード」に強制変革 */
.page .container {
    max-width: 800px; /* 横幅をあえて絞り、視線移動を最小限にして読書リズムを作る */
    margin-top: 160px;
    padding: 2rem 1.5rem;
}

/* 固定ページではサイドバーを完全に無視する（Hino-tama Basicのレスポンシブ崩れ防止） */
.page .sidebar,
.page .sidebar-wrapper {
    display: none !important;
}
.page .contents {
    flex: 0 0 100% !important;
    max-width: 100% !important;
}

/* 論文本文のタイポグラフィベース */
.page .article-content {
    font-family: var(--body-font);
    font-size: 1.05rem; /* 通常よりわずかに大きく */
    line-height: 2.0;   /* 行間を限界まで広げ、長文でも脳が疲れない余白を維持 */
    color: #ccd6f6;     /* ほんのり青みを帯びた、冷徹で知的なライトグレー */
    letter-spacing: 0.05em;
}

/* 段落間の余白（ここが詰まるとブログ感が出るため、広めに確保） */
.page .article-content p {
    margin-bottom: 2.5rem;
}

/* 思想論文専用・見出し（H2）の再定義 */
.page .article-content h2 {
    font-family: var(--font-cyber);
    font-size: 1.75rem;
    color: #fff;
    border-left: 4px solid var(--accent-color); /* ドジャーブルーのストイックな縦線 */
    border-bottom: 1px solid rgba(30, 144, 255, 0.1);
    padding: 0.5rem 0 0.5rem 1.25rem;
    margin: 5rem 0 2.5rem;
    letter-spacing: 1px;
}

/* 思想論文専用・小見出し（H3） */
.page .article-content h3 {
    font-family: var(--font-cyber);
    font-size: 1.35rem;
    color: var(--primary-color); /* サイバーグリーン */
    border-left: none; /* デフォルトの線をパージ */
    padding-left: 0;
    margin: 4rem 0 1.5rem;
    position: relative;
}
.page .article-content h3::before {
    content: "■ ";
    color: var(--primary-color);
    font-size: 1rem;
    vertical-align: middle;
}

/* ── 論文の説得力を跳ね上げる【特殊文字装飾】 ── */

/* 1. 太字（strong）：ただ太くするのではなく、重要な「思想のコア」として発光させる */
.page .article-content strong {
    color: #fff;
    font-weight: 700;
    background: linear-gradient(transparent 70%, rgba(57, 255, 20, 0.15) 70%); /* 薄いグリーンのアンダーライン */
    padding: 0 2px;
}

/* 2. 引用（blockquote）：「大口の罠」や「一般の教科書の誤謬」を痛烈に引用するための檻 */
.page .article-content blockquote {
    margin: 3rem 0;
    padding: 25px 30px;
    background: rgba(16, 22, 32, 0.4);
    border-left: 3px solid rgba(255, 255, 255, 0.2);
    border-radius: 2px;
    position: relative;
}
.page .article-content blockquote p {
    margin-bottom: 0;
    font-style: italic;
    color: #8899a6;
    font-size: 0.95rem;
}
.page .article-content blockquote::before {
    content: "“";
    position: absolute;
    top: -10px; left: 10px;
    font-size: 3rem;
    color: rgba(255, 255, 255, 0.05);
    font-family: serif;
}

/* 3. マーカー・重要フレーズ（インラインコード風装飾） */
/* 管理画面で「インラインコード」または <code> タグを使うと、軍事テキスト風に囲われます */
.page .article-content code {
    font-family: var(--font-cyber);
    background-color: rgba(30, 144, 255, 0.1);
    color: var(--accent-color);
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 0.9rem;
    margin: 0 4px;
    border: 1px solid rgba(30, 144, 255, 0.2);
}

/* ==========================================================================
   16. Simple Membership Cyber Tuning (認証フォームの兵器化)
   ========================================================================== */

/* フォーム全体のコンテナ調整 */
.swpm-login-widget-form,
#swpm-registration-form {
    background: linear-gradient(135deg, rgba(10, 16, 26, 0.75) 0%, rgba(5, 7, 10, 0.95) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 4px !important;
    padding: 40px !important;
    color: #ccd6f6 !important;
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.6) !important;
    max-width: 600px;
    margin: 0 auto;
}

/* 入力項目ラベルのテック化（★ログインフォームの通常ラベルも巻き込み） */
.swpm-login-label,
.swpm-registration-label,
.swpm-login-widget-form label {
    font-family: var(--font-cyber) !important;
    font-size: 0.85rem !important;
    color: var(--accent-color) !important; /* ドジャーブルー */
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 8px !important;
    display: block;
}

/* 入力フォーム（ユーザー名、メール、パスワード等）をシステム端末風に */
.swpm-login-widget-form input[type="text"],
.swpm-login-widget-form input[type="password"],
#swpm-registration-form input[type="text"],
#swpm-registration-form input[type="password"],
#swpm-registration-form input[type="email"] {
    width: 100% !important;
    background: rgba(5, 7, 10, 0.8) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 2px !important;
    padding: 12px 16px !important;
    color: #fff !important;
    font-family: var(--body-font) !important;
    font-size: 1rem !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box;
    margin-bottom: 20px !important;
}

/* ⚡ 【最強化】ChromeやEdgeのオートフィル（自動入力）の白背景・枠線を完全に抹殺するパッチ */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
.swpm-login-widget-form input:-webkit-autofill,
#swpm-registration-form input:-webkit-autofill {
    -webkit-text-fill-color: #ffffff !important; /* 文字色を純白に強制 */
    -webkit-box-shadow: 0 0 0px 1000px #05070a inset !important; /* 本基地の漆黒（#05070a）のインセットシャドウで中身を強制塗りつぶし */
    box-shadow: 0 0 0px 1000px #05070a inset !important;
    border-color: rgba(57, 255, 20, 0.15) !important; /* 縁の線もテーマのストイックな色に強制固定 */
    transition: background-color 5000s ease-in-out 0s !important;
}

/* ⚡ オートフィルされた状態でフォーカスが当たった時のネオン発光も維持 */
input:-webkit-autofill:focus,
.swpm-login-widget-form input:-webkit-autofill:focus,
#swpm-registration-form input:-webkit-autofill:focus {
    border-color: var(--primary-color) !important; /* サイバーグリーン */
    box-shadow: 0 0 12px rgba(57, 255, 20, 0.3), 0 0 0px 1000px #05070a inset !important;
}

/* 🚨 浮いてしまっている「登録＆ログイン」ボタンを狙撃して完全兵器化する（★ログインボタンのセレクタをマージ） */
.swpm-login-widget-form input[type="submit"],
#swpm-registration-form input[type="submit"],
#swpm-registration-form input[name="submit"],
#swpm-registration-form button,
#swpm-registration-form .swpm-registration-submit,
.swpm-registration-submit-btn {
    width: 100% !important; /* 横幅いっぱいに広げて存在感を確保 */
    background: rgba(57, 255, 20, 0.03) !important;
    border: 1px solid rgba(57, 255, 20, 0.5) !important;
    color: var(--primary-color) !important; /* サイバーグリーン */
    font-family: var(--font-cyber) !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    padding: 16px !important;
    font-size: 1rem !important;
    border-radius: 2px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-transform: uppercase;
    margin-top: 30px !important;
    display: block !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

/* ボタンホバー時のネオン爆発エフェクト（★ログインボタンのセレクタをマージ） */
.swpm-login-widget-form input[type="submit"]:hover,
#swpm-registration-form input[type="submit"]:hover,
#swpm-registration-form input[name="submit"]:hover,
#swpm-registration-form button:hover,
#swpm-registration-form .swpm-registration-submit:hover,
.swpm-registration-submit-btn:hover {
    background: var(--primary-color) !important;
    color: #000 !important;
    box-shadow: 0 0 25px var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    opacity: 1 !important;
}

/* パスワード再設定等のリンク（★ログインフォーム内のリンクもドジャーブルーに統一） */
.swpm-login-action-links a,
.swpm-login-widget-form a {
    font-size: 0.85rem !important;
    color: var(--accent-color) !important; /* 指定のドジャーブルーへ統一 */
    font-family: var(--body-font) !important;
}
.swpm-login-action-links a:hover,
.swpm-login-widget-form a:hover {
    color: var(--primary-color) !important;
}

/* フォームから「姓」「名」の入力エリアを行ごと完全にパージする */
div.swpm-form-row.swpm-firstname-row,
div.swpm-form-row.swpm-lastname-row {
    display: none !important;
}

/* 万が一、テーマやプラグインのバージョンによってテーブル構造が変わっている場合の防壁フック */
#swpm-registration-form .swpm-registration-form-row:has(input[name="first_name"]),
#swpm-registration-form .swpm-registration-form-row:has(input[name="last_name"]) {
    display: none !important;
}

/* ➔ おかしな登録完了メッセージのテキスト（お願い等）を完全破壊し、再構築する */
.swpm-registration-success-msg {
    font-size: 0 !important; /* 元の怪しい翻訳テキストだけを狙撃して完全消滅させる */
    color: transparent !important;
    line-height: 0 !important;
    margin: 30px 0 !important;
}

/* ➔ 完全に統制された新しい完了メッセージをサイバーグリーンでインジェクション */
.swpm-registration-success-msg::before {
    content: "── アカウント開設完了。速やかに";
    font-size: 1rem !important; /* 文字サイズを正常化して復活 */
    color: var(--primary-color) !important; /* サイバーグリーン */
    font-family: var(--body-font) !important;
    line-height: 1.8 !important;
    display: inline-block;
}

/* ➔ ログインリンク（aタグ）だけをドジャーブルーでサルベージして再装飾 */
.swpm-registration-success-msg a {
    font-size: 1rem !important; /* リンク文字のサイズだけを復活 */
    color: var(--accent-color) !important; /* ドジャーブルー */
    font-family: var(--body-font) !important;
    font-weight: bold;
    border-bottom: 1px dashed var(--accent-color); /* アンダーラインをテック風の破線に */
    padding-bottom: 2px;
    transition: all 0.3s ease;
    margin-left: 4px;
}

.swpm-registration-success-msg a:hover {
    color: var(--primary-color) !important;
    border-bottom-color: var(--primary-color);
    opacity: 1;
}

/* ==========================================================================
   16-補足. Simple Membership Password Reset (クラス名依存パージ版)
   ========================================================================== */

/* ➔ クラス名が何であれ、固定ページ内のフォームをすべて装甲コンテナ化 */
.page .article-content form,
.swpm-forgot-password-form,
#swpm-forgot-pass-form,
.swpm-reset-password-form {
    background: linear-gradient(135deg, rgba(10, 16, 26, 0.75) 0%, rgba(5, 7, 10, 0.95) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 4px !important;
    padding: 40px !important;
    color: #ccd6f6 !important;
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.6) !important;
    max-width: 600px;
    margin: 0 auto;
}

/* ➔ フォーム内のすべてのラベルをテック化 */
.page .article-content form label,
.swpm-forgot-password-form label {
    font-family: var(--font-cyber) !important;
    font-size: 0.85rem !important;
    color: var(--accent-color) !important;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 12px !important;
    display: block;
}

/* ➔ フォーム内のテキスト入力欄を100%幅の漆黒端末風に拡張 */
.page .article-content form input[type="text"],
.page .article-content form input[type="email"],
.swpm-forgot-password-form input[type="text"] {
    width: 100% !important;
    background: rgba(5, 7, 10, 0.8) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 2px !important;
    padding: 14px 16px !important;
    color: #fff !important;
    font-family: var(--body-font) !important;
    font-size: 1rem !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box;
    margin-bottom: 20px !important;
}

/* フォーム入力中の発光エフェクト（あらゆるブラウザの上書きを許さない最優先・覚醒グリーン） */
.swpm-login-widget-form input[type="text"]:focus,
.swpm-login-widget-form input[type="password"]:focus,
#swpm-registration-form input[type="text"]:focus,
#swpm-registration-form input[type="password"]:focus,
#swpm-registration-form input[type="email"]:focus,
.page .article-content form input[type="text"]:focus,
.page .article-content form input[type="email"]:focus,
input:-webkit-autofill:focus {
    outline: none !important;
    border-color: var(--primary-color) !important; /* サイバーグリーン */
    box-shadow: 0 0 12px rgba(57, 255, 20, 0.4), 0 0 0px 1000px #05070a inset !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* 🚨 白く浮いている実行ボタンをまとめて起動スイッチへ変更 */
.page .article-content form input[type="submit"],
.swpm-forgot-password-form input[type="submit"] {
    width: 100% !important;
    background: rgba(57, 255, 20, 0.03) !important;
    border: 1px solid rgba(57, 255, 20, 0.5) !important;
    color: var(--primary-color) !important;
    font-family: var(--font-cyber) !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    padding: 16px !important;
    font-size: 1rem !important;
    border-radius: 2px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-transform: uppercase;
    margin-top: 20px !important;
    display: block !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

/* ボタンホバー時のネオン爆発 */
.page .article-content form input[type="submit"]:hover {
    background: var(--primary-color) !important;
    color: #000 !important;
    box-shadow: 0 0 25px var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    opacity: 1 !important;
}

/* ==========================================================================
   16-補完2. Simple Membership System Messages (システム通知のログ化)
   ========================================================================== */

/* ➔ リセット成功・エラー等の浮遊通知ボックスを完全可視化 */
.swpm-msg-container,
.swpm-blue-box,
.swpm-red-box,
.swpm-pass-reset-error-msg,
.swpm-pass-reset-success-msg,
.swpm-reset-password-success-msg {
    background: rgba(5, 7, 10, 0.95) !important;
    border: 1px solid var(--primary-color) !important; /* サイバーグリーンの枠線 */
    color: var(--primary-color) !important; /* 文字をサイバーグリーンで発光 */
    padding: 16px 20px !important;
    margin: 0 auto 25px !important;
    max-width: 600px;
    font-family: var(--body-font) !important;
    font-size: 0.95rem !important;
    border-radius: 2px !important;
    text-align: left !important;
    box-shadow: 0 0 15px rgba(57, 255, 20, 0.1) !important;
    box-sizing: border-box;
}

/* ➔ メールアドレスが違っていた場合などの「エラー通知」は警告レッドに */
.swpm-red-box,
.swpm-pass-reset-error-msg {
    border-color: #ff3333 !important; /* 警告赤 */
    color: #ff3333 !important;
    box-shadow: 0 0 15px rgba(255, 51, 51, 0.15) !important;
}

/* ==========================================================================
   17. Simple Download Monitor Cyber Tuning (ダウンロードボタンの兵器化)
   ========================================================================== */

/* ➔ SDMが標準で吐き出すダサい緑ボタンを、完全なレジスタンス規格へ強制上書き */
.cyber-download-zone .sdm_download_link,
.sdm_download_link {
    display: block !important;
    max-width: 500px !important;
    margin: 0 auto !important;
    background: rgba(57, 255, 20, 0.03) !important;
    border: 1px solid rgba(57, 255, 20, 0.5) !important;
    color: var(--primary-color) !important; /* サイバーグリーン */
    font-family: var(--font-cyber) !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    padding: 20px 30px !important;
    font-size: 1.1rem !important;
    border-radius: 2px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    text-align: center !important;
}

/* ➔ ボタンホバー時の強烈ネオン爆発 */
.cyber-download-zone .sdm_download_link:hover,
.sdm_download_link:hover {
    background: var(--primary-color) !important;
    color: #000 !important;
    box-shadow: 0 0 30px var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    opacity: 1 !important;
}

/* ==========================================================================
   17. Simple Download Monitor Cyber Tuning (ダウンロードセクター完全統制)
   ========================================================================== */

/* ➔ 【防壁】マニュアルエリアに紛れ込むプラグインのダサい初期パーツ（画像・DL数等）を根こそぎ完全パージ */
.download-specs .sdm_post_item_top,
.download-specs .sdm_download_item,
.download-specs .sdm_post_item_top_left,
.download-specs .sdm_post_item_top_right,
.download-specs .sdm_download_link,
.download-specs .sdm_download_link_parent,
.single-sdm_downloads .sdm_post_item_top,
.single-sdm_downloads .sdm_download_item {
    display: none !important;
}

/* ➔ 本命の起動スイッチ（外枠aタグ）を最優先で兵器化 */
.cyber-download-zone .sdm_download_link,
div.cyber-download-zone a.sdm_download_link {
    display: block !important;
    max-width: 550px !important;
    margin: 0 auto !important;
    background: rgba(57, 255, 20, 0.03) !important;
    border: 1px solid rgba(57, 255, 20, 0.5) !important;
    color: var(--primary-color) !important; /* サイバーグリーン */
    font-family: var(--font-cyber) !important;

    /* ⚡【文字ブレ絶対防壁】400（normal）に固定し、アンチエイリアスで輪郭を鋭利に研ぎ澄ます */
    font-weight: normal !important;
    text-shadow: none !important; /* 影を完全拒否 */
    -webkit-font-smoothing: antialiased !important; /* Mac/iOS用のクッキリ化処理 */
    -moz-osx-font-smoothing: grayscale !important;

    letter-spacing: 2px !important;
    padding: 20px 30px !important;
    font-size: 1.05rem !important;
    border-radius: 2px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

/* ➔ ボタンの内部に潜むプラグインの隠れ装飾・残存する影を完全初期化 */
.cyber-download-zone .sdm_download_link *,
div.cyber-download-zone a.sdm_download_link * {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    font-family: inherit !important;
    box-shadow: none !important;
    text-shadow: none !important; /* 内部パーツのドロップシャドウも完全抹殺 */
    display: inline !important;
}

/* ➔ カッコ［ ］を文字の左右に完全に密着・同調させる */
.cyber-download-zone .sdm_download_link::before {
    content: "[ " !important;
    display: inline !important;
}
.cyber-download-zone .sdm_download_link::after {
    content: " ]" !important;
    display: inline !important;
}

/* ➔ ボタンホバー時の強烈ネオン爆発 */
.cyber-download-zone .sdm_download_link:hover,
div.cyber-download-zone a.sdm_download_link:hover {
    background: var(--primary-color) !important;
    color: #000 !important;
    box-shadow: 0 0 30px var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    opacity: 1 !important;
    font-weight: normal !important;
    text-shadow: none !important;
}