/*
Theme Name: numa-theme
Theme URI: https://eroge-numa.com
Author: えろげ沼！
Description: えろげ沼！専用テーマ。「沼」＝湿地の意匠（深い苔緑＋蛍光ピンク）で世界観を作り、グローバルメニュー・ヘッダー・フッターを完全に制御する。文字・余白・カード幅はすべて clamp() による流体指定で、ブレークポイントの段差を作らない。GA4タグを内蔵（Cocoonのアクセス解析設定からの引き継ぎ）。
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL v2 or later
Text Domain: numa-theme
*/

/* ============================================================
   トークン（sitewide）。numa-display側は自己完結の同系トークンを
   持っているため、プラグイン単体でも見た目が崩れない。
   ============================================================ */
:root{
	--nm-bg:#070d0a;
	--nm-bg-2:#0c1712;
	--nm-surface:#122019;
	--nm-surface-2:#17291f;
	--nm-line:rgba(125,220,154,.20);
	--nm-line-strong:rgba(125,220,154,.38);
	--nm-text:#e2ece5;
	--nm-muted:rgba(226,236,229,.62);
	--nm-green:#7ddc9a;
	--nm-green-dim:#4fae76;
	--nm-pink:#ff5fd1;
	--nm-pink-deep:#8f1268;
	--nm-amber:#ffbe5c;

	--nm-shell:clamp(320px,94vw,1180px);
	--nm-pad:clamp(14px,.6rem + 1.2vw,32px);
	--nm-fs-body:clamp(.9rem,.86rem + .2vw,1rem);
	--nm-fs-h1:clamp(1.45rem,1.1rem + 1.8vw,2.4rem);
	--nm-fs-h2:clamp(1.15rem,1rem + .8vw,1.6rem);
	--nm-fs-sm:clamp(.74rem,.72rem + .12vw,.84rem);
	--nm-header-h:clamp(54px,3.2rem + 1.2vw,72px);
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
	margin:0;
	background:var(--nm-bg);
	color:var(--nm-text);
	font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",sans-serif;
	font-size:var(--nm-fs-body);
	line-height:1.75;
	overflow-x:hidden;
}

/* 沼の霧。ページ全体にごく薄く漂わせる（画像なし・CSSのみ） */
body::before{
	content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
	background:
		radial-gradient(70% 45% at 50% 0%,rgba(255,95,209,.10),transparent 65%),
		radial-gradient(60% 40% at 8% 12%,rgba(125,220,154,.08),transparent 60%),
		radial-gradient(80% 60% at 100% 100%,rgba(143,18,104,.10),transparent 65%);
}
body > *{position:relative;z-index:1}

img,svg,video{max-width:100%;height:auto}
a{color:var(--nm-green);text-underline-offset:3px}
a:hover{color:var(--nm-pink)}
:focus-visible{outline:2px solid var(--nm-green);outline-offset:2px;border-radius:6px}

/* --- スキップリンク ---------------------------------------- */
.nm-skip{
	position:absolute;left:-9999px;top:0;z-index:100;
	background:var(--nm-green);color:#06170e;padding:.6em 1em;font-weight:700;border-radius:0 0 8px 0
}
.nm-skip:focus{left:0}

/* --- ヘッダー ---------------------------------------------- */
.nm-header{
	position:sticky;top:0;z-index:50;
	background:linear-gradient(180deg,rgba(7,13,10,.96),rgba(7,13,10,.82));
	backdrop-filter:blur(10px);
	border-bottom:1px solid transparent;
	border-image:linear-gradient(90deg,var(--nm-green),var(--nm-pink),transparent) 1;
}
.nm-header__inner{
	width:var(--nm-shell);margin:0 auto;padding:0 var(--nm-pad);
	min-height:var(--nm-header-h);
	display:flex;align-items:center;gap:clamp(10px,2vw,28px);
}
.nm-brand{margin:0;flex:1 1 auto;min-width:0}
.nm-brand__link{display:flex;flex-direction:column;text-decoration:none;color:inherit}
.nm-brand__name{
	font-size:clamp(1.05rem,.95rem + .7vw,1.5rem);font-weight:900;letter-spacing:.02em;line-height:1.15;
	background:linear-gradient(92deg,var(--nm-green) 10%,var(--nm-pink) 90%);
	-webkit-background-clip:text;background-clip:text;color:transparent;
	filter:drop-shadow(0 0 14px rgba(255,95,209,.28));
}
.nm-brand__tag{
	font-size:var(--nm-fs-sm);color:var(--nm-muted);white-space:nowrap;
	overflow:hidden;text-overflow:ellipsis
}

/* --- グローバルメニュー ------------------------------------ */
.nm-nav__list{
	display:flex;flex-wrap:wrap;align-items:center;gap:clamp(2px,.6vw,10px);
	list-style:none;margin:0;padding:0
}
.nm-nav__item,.nm-nav .menu-item{list-style:none}
.nm-nav__link,.nm-nav a{
	display:inline-flex;align-items:center;min-height:40px;
	padding:.3em .8em;border-radius:999px;
	font-size:var(--nm-fs-sm);font-weight:700;text-decoration:none;color:var(--nm-text);
	transition:background .18s ease,color .18s ease,box-shadow .18s ease
}
.nm-nav__link:hover,.nm-nav a:hover{
	color:#fff;background:rgba(255,95,209,.16);
	box-shadow:inset 0 0 0 1px rgba(255,95,209,.45)
}
.nm-nav .current-menu-item > a,.nm-nav .current_page_item > a{
	color:#06170e;background:linear-gradient(180deg,var(--nm-green),var(--nm-green-dim))
}

/* ハンバーガー（狭い画面のみ） */
.nm-navtoggle{
	display:none;flex:0 0 auto;width:44px;height:44px;
	background:transparent;border:1px solid var(--nm-line-strong);border-radius:10px;
	cursor:pointer;padding:0;align-items:center;justify-content:center;flex-direction:column;gap:4px
}
.nm-navtoggle__bar{display:block;width:20px;height:2px;background:var(--nm-text);border-radius:2px}

@media (max-width:860px){
	.nm-navtoggle{display:flex}
	.nm-nav{
		position:absolute;left:0;right:0;top:100%;
		background:rgba(7,13,10,.98);backdrop-filter:blur(12px);
		border-bottom:1px solid var(--nm-line);
		max-height:0;overflow:hidden;transition:max-height .28s ease
	}
	.nm-nav__list{flex-direction:column;align-items:stretch;padding:.4em var(--nm-pad) 1em}
	.nm-nav__link,.nm-nav a{min-height:48px;border-radius:10px;justify-content:flex-start}
	body.nm-navopen .nm-nav{max-height:70vh;overflow:auto}
}
@media (prefers-reduced-motion:reduce){.nm-nav{transition:none}}

/* --- 本文シェル -------------------------------------------- */
.nm-shell{width:var(--nm-shell);margin:0 auto;padding:clamp(16px,2.5vw,40px) var(--nm-pad) clamp(40px,6vw,80px)}
.nm-article{min-width:0}
.nm-article__title{
	font-size:var(--nm-fs-h1);line-height:1.25;font-weight:900;margin:0 0 .5em;letter-spacing:.01em;
	text-wrap:balance
}
.nm-article__meta{color:var(--nm-muted);font-size:var(--nm-fs-sm);margin:-.3em 0 1.4em}

/* 本文（編集枠）の基本タイポグラフィ */
.nm-entry > * + *{margin-top:1.1em}
.nm-entry h2{
	font-size:var(--nm-fs-h2);font-weight:800;margin:2em 0 .6em;padding:.5em .8em;
	background:linear-gradient(90deg,rgba(125,220,154,.14),rgba(255,95,209,.10) 45%,transparent);
	border-left:3px solid var(--nm-green);border-radius:0 8px 8px 0
}
.nm-entry h3{font-size:clamp(1rem,.95rem + .4vw,1.25rem);font-weight:800;margin:1.8em 0 .5em;color:var(--nm-green)}
.nm-entry p{margin:0 0 1.1em}
.nm-entry ul,.nm-entry ol{padding-left:1.4em}
.nm-entry li + li{margin-top:.3em}
.nm-entry strong{color:#fff}
.nm-entry blockquote{
	margin:1.4em 0;padding:.8em 1em;border-left:3px solid var(--nm-pink);
	background:rgba(255,95,209,.07);border-radius:0 10px 10px 0;color:var(--nm-muted)
}
.nm-entry code{
	background:rgba(125,220,154,.12);padding:.1em .4em;border-radius:5px;font-size:.92em
}
.nm-entry table{width:100%;border-collapse:collapse;font-size:var(--nm-fs-sm)}
.nm-entry th,.nm-entry td{border:1px solid var(--nm-line);padding:.5em .7em;text-align:left}
.nm-entry th{background:rgba(125,220,154,.10)}

/* --- ボタン ------------------------------------------------ */
.nm-btn{
	display:inline-flex;align-items:center;min-height:44px;padding:.4em 1.2em;
	border-radius:999px;text-decoration:none;font-weight:700;
	color:#06170e;background:linear-gradient(180deg,var(--nm-green),var(--nm-green-dim));
	box-shadow:0 2px 16px rgba(125,220,154,.25);margin:.3em .5em .3em 0
}
.nm-btn:hover{color:#06170e;filter:brightness(1.08)}

/* --- 投稿一覧・ページ送り ---------------------------------- */
.nm-postlist{list-style:none;margin:1.2em 0;padding:0}
.nm-postlist__item{
	display:flex;justify-content:space-between;gap:1em;align-items:baseline;
	padding:.7em .2em;border-bottom:1px solid var(--nm-line)
}
.nm-postlist__link{font-weight:700;text-decoration:none;color:var(--nm-text)}
.nm-postlist__link:hover{color:var(--nm-green)}
.nm-postlist__date{color:var(--nm-muted);font-size:var(--nm-fs-sm);font-variant-numeric:tabular-nums;flex:0 0 auto}
.nm-pager .nav-links{display:flex;flex-wrap:wrap;gap:.5em;justify-content:center;margin-top:1.5em}
.nm-pager a,.nm-pager .current{
	display:inline-flex;align-items:center;min-height:44px;padding:.3em 1em;
	border:1px solid var(--nm-line-strong);border-radius:10px;text-decoration:none
}
.nm-pager .current{background:linear-gradient(180deg,var(--nm-green),var(--nm-green-dim));color:#06170e;font-weight:700;border-color:transparent}

/* --- 404 --------------------------------------------------- */
.nm-404__links{margin-top:1.5em}

/* --- フッター ---------------------------------------------- */
.nm-footer{
	margin-top:clamp(30px,5vw,70px);
	background:linear-gradient(180deg,transparent,rgba(143,18,104,.10) 40%,rgba(7,13,10,1));
	border-top:1px solid var(--nm-line)
}
.nm-footer__inner{
	width:var(--nm-shell);margin:0 auto;padding:clamp(22px,3.5vw,46px) var(--nm-pad)
}
.nm-footer__disc{font-size:var(--nm-fs-sm);color:var(--nm-muted);margin:0 0 1.2em;line-height:1.9}
.nm-footer__list{display:flex;flex-wrap:wrap;gap:.4em 1.2em;list-style:none;margin:0 0 1.2em;padding:0;font-size:var(--nm-fs-sm)}
.nm-footer__list a{text-decoration:none}
.nm-footer__list a:hover{text-decoration:underline}
.nm-footer__copy{font-size:var(--nm-fs-sm);color:var(--nm-muted);margin:0}

/* --- 年齢確認（Age Gateプラグイン）を世界観に合わせる ------- */
.age-gate{background:var(--nm-bg)!important;color:var(--nm-text)!important}
.age-gate__form{
	background:linear-gradient(180deg,var(--nm-surface-2),var(--nm-surface))!important;
	border:1px solid var(--nm-line)!important;border-radius:16px!important;
	box-shadow:0 20px 60px rgba(0,0,0,.6)!important
}
.age-gate__heading-title{
	background:linear-gradient(92deg,var(--nm-green) 10%,var(--nm-pink) 90%);
	-webkit-background-clip:text;background-clip:text;color:transparent!important
}
.age-gate__submit{
	border-radius:999px!important;font-weight:700!important;min-height:44px;border:none!important
}
.age-gate__submit--yes{background:linear-gradient(180deg,var(--nm-green),var(--nm-green-dim))!important;color:#06170e!important}
.age-gate__submit--no{background:rgba(255,255,255,.08)!important;color:var(--nm-text)!important}
