/*
Theme Name: PinkArchive
Theme URI: https://pinkarchive.com/
Author: PinkArchive
Description: ブルーアーカイブ(ブルアカ)のエロ漫画・エロ画像まとめサイト向けテーマ。作品をカスタム投稿タイプ archive として扱い、媒体／タグ／キャラクター／シリーズ／サークル／作者の6タクソノミーで分類します。
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: pinkarchive
Tags: two-columns, custom-menu, translation-ready
*/

/* ===== reset ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
img,svg{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button,input,select,textarea{font:inherit;color:inherit;border:none;background:none}

/* ===== tokens ===== */
:root {
    color-scheme: light;
    --bg: #FFF8FA;
    --surface: #FFFFFF;
    --surface2: #F8F5F9;
    --hover: #F5F0F8;
    --accent: #F5A0C0;
    --accent-h: #E890B0;
    --accent-sub: rgba(245, 160, 192, .10);
    --text: #2A2030;
    --sec: #6A6078;
    --tert: #A098B0;
    --border: #E8E0F0;
    --tagbg: #F5F0F8;
    --tagtx: #6A6078;
    --gold: #F0C050;
    --silver: #A0A8B8;
    --bronze: #C87850;
    --eromanga: #E87098;
    --erogazou: #9070C8;
    --shadow: 0 8px 32px rgba(0, 0, 0, .06);
    --r: 6px;
    --r-lg: 10px;
    --maxw: 1240px;
    --gut: 20px;
    --hh: 56px;
    --cover-ratio: 3/4;
}

/*
 * このテーマは「白 + ぴんく」の明色固定。
 * 端末がダークモードでも配色を変えないよう、
 * prefers-color-scheme による自動切り替えは持たせていない。
 */

/* ===== base ===== */
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hh) + 10px)}
body{font-family:'Noto Sans JP',sans-serif;font-size:14px;line-height:1.7;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

/* ===== header ===== */
.hdr{position:sticky;top:0;z-index:100;background:var(--surface);border-bottom:1px solid var(--border);height:var(--hh)}
.hdr-inner{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut);display:flex;align-items:center;height:100%;gap:20px}
.logo{font-family:'Outfit','Noto Sans JP',sans-serif;font-size:22px;font-weight:700;letter-spacing:.5px;color:var(--text);white-space:nowrap}
.logo i{font-style:normal;color:var(--accent)}
.nav-toggle{display:none;flex-direction:column;gap:5px;padding:6px;cursor:pointer}
.nav-toggle span{display:block;width:20px;height:2px;background:var(--text);border-radius:2px;transition:transform .2s}
.gnav{margin-left:auto}
.nav-list{display:flex;gap:4px}
.nav-list li a{display:block;padding:6px 12px;font-size:13px;font-weight:500;border-radius:var(--r);transition:background .15s}
.nav-list li a:hover{background:var(--hover)}

/* ===== layout ===== */
.site-wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}
.archive-wrap{display:grid;grid-template-columns:1fr 300px;gap:30px;padding-top:24px}
.archive-main{min-width:0}

/* ===== intro ===== */
.intro{text-align:center;padding:48px var(--gut) 40px;max-width:700px;margin:0 auto}
.intro h1{font-size:28px;font-weight:800;line-height:1.4;margin-bottom:12px}
.intro h1 i{font-style:normal;color:var(--accent)}
.intro p{font-size:14px;color:var(--sec);margin-bottom:24px}

/* ===== search ===== */
.search-form{display:flex;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;max-width:500px;margin:0 auto;transition:border-color .2s}
.search-form:focus-within{border-color:var(--accent)}
.search-field{flex:1;padding:10px 16px;font-size:14px;background:transparent;outline:none}
.search-field::placeholder{color:var(--tert)}
.search-submit{padding:10px 14px;color:var(--sec);cursor:pointer;transition:color .15s}
.search-submit:hover{color:var(--accent)}
.search-top{margin-bottom:24px}

/* ===== sections ===== */
.sec{margin-bottom:36px}
.sec-hd{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:14px;gap:12px}
.sec-hd h2{font-size:18px;font-weight:700}
.more{font-size:12px;color:var(--accent);font-weight:600;white-space:nowrap}
.more:hover{color:var(--accent-h)}

/* ===== card grid ===== */
.card-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.card{display:block;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;transition:all .2s}
.card:hover{border-color:var(--accent);transform:translateY(-3px);box-shadow:var(--shadow)}
.card-link{display:block;height:100%}
.card-thumb{position:relative;aspect-ratio:var(--cover-ratio);overflow:hidden;background:var(--surface2)}
.card-thumb img{width:100%;height:100%;object-fit:cover}
.card-body{padding:10px 10px 12px}
.card-title{font-size:12px;font-weight:600;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-meta{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:10px;color:var(--sec)}

/* ===== badges ===== */
.bd-media{position:absolute;top:6px;left:6px;font-size:10px;font-weight:700;color:#fff;padding:2px 8px;border-radius:3px;line-height:1.4}
.bd-media.eromanga,.mbadge.eromanga{background:var(--eromanga)}
.bd-media.erogazou,.mbadge.erogazou{background:var(--erogazou)}
.mbadge{display:inline-block;font-size:10px;font-weight:700;color:#fff;padding:1px 6px;border-radius:3px;line-height:1.4}

/* ===== ranking ===== */
.rank-list{display:flex;flex-direction:column;gap:10px}
.rank-item{display:flex;gap:12px;align-items:flex-start;padding:10px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);transition:all .2s}
.rank-item:hover{border-color:var(--accent);box-shadow:var(--shadow)}
.rank-n{font-family:'Outfit',sans-serif;font-size:20px;font-weight:700;min-width:28px;text-align:center;line-height:1;padding-top:2px;color:var(--tert)}
.rank-n.n1{color:var(--gold)}
.rank-n.n2{color:var(--silver)}
.rank-n.n3{color:var(--bronze)}
.rank-thumb{width:56px;height:75px;border-radius:var(--r);overflow:hidden;flex-shrink:0;background:var(--surface2)}
.rank-thumb img{width:100%;height:100%;object-fit:cover}
.rank-info{flex:1;min-width:0}
.rank-title{font-size:13px;font-weight:600;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rank-meta{font-size:10px;color:var(--sec);margin-top:4px}

/* ===== sidebar ranking ===== */
.w-rank .rank-item{padding:8px;gap:8px}
.w-rank .rank-n{font-size:16px;min-width:22px}
.w-rank .rank-thumb{width:44px;height:59px}
.w-rank .rank-title{font-size:12px}
.w-rank .n{font-family:'Outfit',sans-serif}

/* ===== sort tabs ===== */
.sorttabs{display:flex;gap:4px;margin-bottom:15px;flex-wrap:wrap}
.sorttabs a,.sorttabs span{display:block;padding:5px 14px;font-size:12px;font-weight:600;border-radius:var(--r);border:1px solid var(--border);color:var(--sec);transition:all .15s}
.sorttabs a:hover{border-color:var(--accent);color:var(--accent)}
.sorttabs .current{background:var(--accent);color:#fff;border-color:var(--accent)}

/* ===== media sort tabs ===== */
.media-tabs{margin-bottom:15px}

/* ===== pills ===== */
.pill-wrap{display:flex;flex-wrap:wrap;gap:8px}
.pill{display:inline-flex;align-items:center;gap:4px;padding:5px 12px;font-size:12px;font-weight:500;background:var(--tagbg);color:var(--tagtx);border-radius:20px;border:1px solid transparent;transition:all .15s}
.pill:hover{border-color:var(--accent);color:var(--accent)}
.pill-ct{font-size:10px;opacity:.7}

/* ===== term name list ===== */
.term-name-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px}
.term-name-item{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;font-size:13px;border-radius:var(--r);transition:background .15s}
.term-name-item:hover{background:var(--hover)}
.term-ct{font-size:11px;color:var(--tert)}

/* ===== dual columns ===== */
.dual{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.dual.single{grid-template-columns:1fr}

/* ===== character grid ===== */
.chara-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 12px;
}

.chara-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    text-align: center;
    padding: 14px 8px;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--r-lg);
    transition: all .2s;
}

.chara-card:hover {
    border-color: var(--accent);
    transform: translateY(-3px);
    box-shadow: var(--shadow);
}

.chara-card img {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--surface2);
    margin-bottom: 8px;
}

.chara-card .chara-ph {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: var(--surface2);
    margin-bottom: 8px;
}

.chara-name {
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 2px;
}

.chara-ct {
    font-size: 10px;
    color: var(--sec);
}

/* ===== pagination ===== */
.pagination{display:flex;justify-content:center;gap:4px;margin-top:30px;padding:20px 0}
.pagination a,.pagination span{display:flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 10px;font-size:13px;font-weight:600;border-radius:var(--r);border:1px solid var(--border);transition:all .15s}
.pagination a:hover{border-color:var(--accent);color:var(--accent)}
.pagination .current{background:var(--accent);color:#fff;border-color:var(--accent)}

/* ===== single work ===== */
.single-work{padding-top:20px}
/* 右カラム構成では .archive-wrap 側の余白と二重になるため打ち消す */
.archive-wrap .single-work{padding-top:0}
.breadcrumb{font-size:12px;color:var(--sec);margin-bottom:20px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.breadcrumb a:hover{color:var(--accent)}
.work-layout{display:grid;grid-template-columns:280px 1fr;gap:24px;margin-bottom:24px}
/* 表紙が無い作品は1カラムにして空欄を作らない（.no-cover の方が詳細度が高いので順序に依存しない） */
.work-layout.no-cover{grid-template-columns:1fr}
.work-cover{border-radius:var(--r-lg);overflow:hidden;background:var(--surface2)}
.work-cover img{width:100%;height:auto}
.work-title{font-size:22px;font-weight:800;line-height:1.4;margin-bottom:16px}
.work-info{min-width:0}

/* ===== work meta table ===== */
.work-meta,.detail-table{width:100%;border-collapse:collapse;margin-bottom:16px;font-size:13px}
.work-meta th,.detail-table th{text-align:left;padding:8px 12px;background:var(--surface2);border:1px solid var(--border);font-weight:600;white-space:nowrap;width:100px}
.work-meta td,.detail-table td{padding:8px 12px;border:1px solid var(--border)}
.work-meta td a,.detail-table td a{color:var(--accent)}
.work-meta td a:hover,.detail-table td a:hover{text-decoration:underline}

/* ===== work actions ===== */
.work-actions{display:flex;gap:8px;flex-wrap:wrap}
.work-actions .btn{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;font-size:13px;font-weight:600;border-radius:var(--r);cursor:pointer;transition:all .15s}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-h)}
.btn-outline{border:1px solid var(--border);color:var(--sec)}
.btn-outline:hover{border-color:var(--accent);color:var(--accent)}

/* ===== work body ===== */
.work-body{margin-bottom:24px;line-height:1.8}
.work-body p{margin-bottom:1em}
.work-body img{border-radius:var(--r);margin:12px 0}

/* ===== work reader (エロ漫画: 縦スクロール) ===== */
/*
 * 本文カラム幅そのままだと1行が長すぎて視線移動が辛いので上限を設ける。
 * ページ間は詰めて、めくる感覚に近づける。
 */
.work-reader{display:flex;flex-direction:column;gap:6px;max-width:820px;margin:0 auto 6px}
.work-reader .pg{width:100%;height:auto;border-radius:3px;background:var(--surface2)}
.pg-note{text-align:center;font-size:12px;color:var(--tert);padding:14px 0;border-top:1px dashed var(--border);max-width:820px;margin:0 auto 24px}

/* ===== work gallery (エロ画像: サムネイル) ===== */
.work-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:24px}
.work-gallery a{display:block;border-radius:var(--r);overflow:hidden;background:var(--surface2)}
.work-gallery img{width:100%;height:auto;transition:opacity .2s}
.work-gallery a:hover img{opacity:.8}

/* ===== work tags ===== */
.work-tags{margin-bottom:24px}
.work-tags .pill-wrap{margin-top:8px}

/* ===== related ===== */
.related{margin-bottom:36px}
.related .sec-hd{margin-bottom:14px}
.related .card-grid{grid-template-columns:repeat(4,1fr)}

/* ===== sidebar ===== */
.sidebar{position:sticky;top:calc(var(--hh) + 20px);align-self:start}
.widget{margin-bottom:24px}
.w-title{font-size:15px;font-weight:700;margin-bottom:12px;padding-bottom:8px;border-bottom:2px solid var(--accent)}

/* ===== sidebar promo ===== */
.w-promo{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;margin-bottom:24px}
.w-promo-thumb{aspect-ratio:16/9;overflow:hidden;background:var(--surface2)}
.w-promo-thumb img{width:100%;height:100%;object-fit:cover}
.w-promo-body{padding:12px}
.w-promo-title{font-size:13px;font-weight:600;line-height:1.4;margin-bottom:6px}
.w-promo-desc{font-size:11px;color:var(--sec);line-height:1.5}

/* ===== archive header ===== */
.archive-hd{margin-bottom:20px}
.archive-hd h1{font-size:24px;font-weight:800;line-height:1.4;margin-bottom:6px}
.archive-desc{font-size:13px;color:var(--sec)}

/* ===== page content ===== */
.page-content{padding:20px 0}
.page-content h1{font-size:24px;font-weight:800;margin-bottom:20px}
.entry-content{line-height:1.8;font-size:15px}
.entry-content p{margin-bottom:1em}
.entry-content h2{font-size:20px;font-weight:700;margin:1.5em 0 .5em}
.entry-content h3{font-size:17px;font-weight:700;margin:1.2em 0 .4em}
.entry-content ul,.entry-content ol{margin:.5em 0 1em 1.5em}
.entry-content ul{list-style:disc}
.entry-content ol{list-style:decimal}
.entry-content a{color:var(--accent)}
.entry-content a:hover{text-decoration:underline}
.entry-content img{border-radius:var(--r);margin:12px 0}
.entry-content blockquote{border-left:3px solid var(--accent);padding:12px 16px;background:var(--surface2);border-radius:0 var(--r) var(--r) 0;margin:1em 0}

/* ===== search: post / page results ===== */
.post-list{display:flex;flex-direction:column;gap:10px}
.post-item{padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);transition:border-color .15s}
.post-item:hover{border-color:var(--accent)}
.post-item h3{font-size:15px;font-weight:700;line-height:1.4;margin-bottom:6px}
.post-item h3 a:hover{color:var(--accent)}
.post-item p{font-size:13px;color:var(--sec);line-height:1.7}

/* ===== no results ===== */
.no-result{text-align:center;padding:40px 20px;color:var(--sec);font-size:14px}

/* ===== footer ===== */
.ftr{margin-top:48px;padding:32px var(--gut);background:var(--surface);border-top:1px solid var(--border);text-align:center}
.ftr-inner{max-width:var(--maxw);margin:0 auto}
.ftr-brand{font-family:'Outfit',sans-serif;font-size:18px;font-weight:700;letter-spacing:.5px;display:inline-block;margin-bottom:8px}
.ftr-brand i{font-style:normal;color:var(--accent)}
.ftr-desc{font-size:12px;color:var(--sec);margin-bottom:16px}
.ftr-links{display:flex;justify-content:center;gap:16px;margin-bottom:12px}
.ftr-links li a{font-size:12px;color:var(--sec);transition:color .15s}
.ftr-links li a:hover{color:var(--accent)}
.ftr-copy{font-size:11px;color:var(--tert)}

/* ===== responsive: tablet ===== */
@media (max-width:1080px){
    .archive-wrap{grid-template-columns:1fr;gap:24px}
    .sidebar{position:static}
    .card-grid{grid-template-columns:repeat(4,1fr)}
    .related .card-grid{grid-template-columns:repeat(3,1fr)}
    .work-gallery{grid-template-columns:repeat(3,1fr)}
}

@media (max-width:880px){
    .card-grid{grid-template-columns:repeat(3,1fr)}
    .work-layout{grid-template-columns:200px 1fr;gap:16px}
    .dual{grid-template-columns:1fr}
    .chara-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (max-width:720px){
    .nav-toggle{display:flex}
    .gnav{position:fixed;top:var(--hh);left:0;right:0;bottom:0;background:var(--surface);padding:16px var(--gut);transform:translateX(100%);transition:transform .25s;overflow-y:auto;z-index:99}
    .gnav.open{transform:translateX(0)}
    .nav-list{flex-direction:column;gap:0}
    .nav-list li a{padding:12px 0;font-size:15px;border-bottom:1px solid var(--border)}
}

@media (max-width:560px){
    :root{--gut:16px;--hh:50px}
    .logo{font-size:18px}
    .intro h1{font-size:22px}
    .intro{padding:32px var(--gut) 28px}
    .card-grid{grid-template-columns:repeat(2,1fr);gap:10px}
    .card-body{padding:8px 8px 10px}
    .card-title{font-size:11px}
    .sec-hd h2{font-size:16px}
    .work-layout{grid-template-columns:1fr}
    .work-cover{max-width:280px}
    .work-title{font-size:18px}
    .related .card-grid{grid-template-columns:repeat(2,1fr)}
    .work-gallery{grid-template-columns:repeat(2,1fr)}
    .archive-hd h1{font-size:20px}
    .chara-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
    }
    .chara-card img,
    .chara-card .chara-ph {
        width: 56px;
        height: 56px;
    }
}

/* ===== utility ===== */
.text-accent{color:var(--accent)}
.bg-surface{background:var(--surface)}
.mt-0{margin-top:0}
.mb-0{margin-bottom:0}