/* ==========================================================================
   laxdx NEWS（/news/）
   仕様の正典は includes/news.php 冒頭。ここは見た目だけ。

   laxdx は assets/css/common.css の :root で常時ダーク配色（背景#000・文字#fff）。
   ライトテーマは存在しないので prefers-color-scheme は使わずダーク前提で書く。
   色はサイト変数（--card-background / --border-color / --accent-orange 等）に合わせる。
   カテゴリ色は includes/news.php の news_categories() から --nw-c で渡ってくる。
   ========================================================================== */

#nwrap {
    max-width: 900px;
    margin: 0 auto;
    padding: 1.75rem 1rem 4rem;
    color: #f1f1f4;
}

/* ---------- 見出し ---------- */
.nw-head { text-align: center; margin-bottom: 1.5rem; }
.nw-head h1 {
    font-size: 1.8rem; font-weight: 800; margin: 0 0 .5rem;
    letter-spacing: .02em; color: #fff;
}
.nw-head p { color: #9a9aa5; font-size: .85rem; line-height: 1.7; margin: 0; }
.nw-head-sub { font-size: .8rem; opacity: .8; }

/* ---------- タブ ---------- */
.nw-tabs {
    display: flex; flex-wrap: wrap; gap: .4rem;
    justify-content: center; margin-bottom: 1.5rem;
}
.nw-tab {
    --nw-c: #f5a623;
    display: inline-block; text-decoration: none;
    font-size: .82rem; font-weight: 700; line-height: 1;
    padding: .55rem .9rem; border-radius: 999px;
    border: 1px solid #32323e; background: #1a1a1f; color: #d5d5dd;
    transition: transform .12s ease, border-color .12s ease, color .12s ease;
}
.nw-tab:hover { transform: translateY(-1px); border-color: var(--nw-c); color: var(--nw-c); }
.nw-tab.is-on { background: var(--nw-c); border-color: var(--nw-c); color: #111; }
.nw-tab-rss { border-style: dashed; }

/* ---------- 見出し下のボタン ---------- */
.nw-head-acts { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; margin-top: 1rem; }
.nw-headbtn {
    text-decoration: none; font-size: .78rem; font-weight: 700; line-height: 1;
    padding: .6rem 1rem; border-radius: 999px;
    background: #f5a623; color: #111; border: 1px solid #f5a623;
}
.nw-headbtn:hover { filter: brightness(1.08); }
.nw-headbtn-sub { background: transparent; color: #d5d5dd; border-color: #32323e; }
.nw-headbtn-sub:hover { border-color: #f5a623; color: #f5a623; filter: none; }

/* ---------- アンテナ一覧（高密度・1行1記事） ----------
   カード型より情報密度を優先する。1画面に何十本も並ぶのがアンテナの体裁。 */
.nw-feed { list-style: none; margin: 0; padding: 0; border-top: 1px solid #23232b; }
.nw-row {
    display: flex; align-items: stretch;
    border-bottom: 1px solid #23232b;
    transition: background .12s ease;
}
.nw-row:hover { background: #14141a; }
.nw-row-own { background: linear-gradient(90deg, rgba(74,158,255,.10), transparent 42%); }
.nw-row-own:hover { background: linear-gradient(90deg, rgba(74,158,255,.16), #14141a 42%); }

.nw-row-main {
    flex: 1 1 auto; min-width: 0;
    display: flex; gap: .7rem; align-items: center;
    padding: .5rem .4rem; text-decoration: none; color: inherit;
}

.nw-rthumb {
    flex: 0 0 88px; width: 88px; height: 58px;
    border-radius: 6px; overflow: hidden; background: #0d0d11; display: block;
}
.nw-rthumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* 画像が無い/読めない行も高さを揃える（欠けるとリズムが崩れて読みにくい） */
.nw-rthumb.is-off { background: repeating-linear-gradient(45deg, #131319, #131319 6px, #17171e 6px, #17171e 12px); }
.nw-rthumb.is-off img { display: none; }

.nw-rbody { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: .25rem; }
.nw-rtitle {
    font-size: .88rem; font-weight: 600; line-height: 1.45; color: #e8e8ee;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.nw-row-main:hover .nw-rtitle { color: #f5a623; }
.nw-rmeta { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; font-size: .68rem; color: #7c7c88; }

.nw-rtalk {
    flex: 0 0 auto; display: flex; align-items: center; padding: 0 .7rem;
    text-decoration: none; font-size: .95rem; opacity: .35;
}
.nw-rtalk:hover { opacity: 1; }

/* 探索枠（まだ表示回数が少ない記事）の印。新顔だと分かるほうが押される */
.nw-new {
    font-size: .6rem; font-weight: 800; letter-spacing: .04em;
    color: #111; background: #4caf50; padding: .1rem .35rem; border-radius: 3px;
}

.nw-meta {
    display: flex; flex-wrap: wrap; align-items: center; gap: .45rem;
    font-size: .7rem; color: #7c7c88; margin-bottom: .4rem;
}
.nw-chip {
    --nw-c: #f5a623;
    font-weight: 800; color: #111; background: var(--nw-c);
    padding: .18rem .5rem; border-radius: 999px; font-size: .67rem; line-height: 1.4;
}
.nw-src { font-weight: 600; color: #9a9aa5; }
.nw-src::after { content: '・'; margin-left: .3rem; color: #4a4a55; }

.nw-title { margin: 0 0 .3rem; font-size: 1rem; font-weight: 700; line-height: 1.55; }
.nw-title a { color: #f1f1f4; text-decoration: none; }
.nw-title a:hover { color: #f5a623; }

.nw-sum { margin: 0 0 .3rem; font-size: .79rem; color: #a4a4b0; line-height: 1.65; }
.nw-orig { margin: 0; font-size: .67rem; color: #6a6a76; line-height: 1.5; }

.nw-acts { display: flex; align-items: center; gap: .7rem; margin-top: .5rem; }
.nw-act {
    font-size: .71rem; font-weight: 700; text-decoration: none;
    color: #f5a623; border: 1px solid rgba(245,166,35,.35);
    padding: .25rem .6rem; border-radius: 999px;
}
.nw-act:hover { background: rgba(245,166,35,.14); }
.nw-clicks { font-size: .67rem; color: #6a6a76; }

/* 年齢確認ゲート(.nw-gate*)のCSSは 2026-07-28 に撤去（ゲート自体を廃止したため） */

/* ---------- 登録・投稿フォーム（register.php / submit.php） ---------- */
.nw-form-page { max-width: 720px; }
.nw-formwrap h1 { font-size: 1.35rem; font-weight: 800; margin: 0 0 .75rem; color: #fff; }
.nw-lead { font-size: .84rem; color: #a4a4b0; line-height: 1.8; margin: 0 0 1.5rem; }
.nw-lead strong { color: #f5a623; }

.nw-tabs-form { justify-content: flex-start; margin-bottom: 1.25rem; }

.nw-alert {
    border: 1px solid rgba(255,64,129,.4); background: rgba(255,64,129,.08);
    border-radius: 10px; padding: .8rem 1rem; margin-bottom: 1.25rem;
}
.nw-alert p { margin: 0 0 .35rem; font-size: .8rem; color: #ffb3ce; line-height: 1.6; }
.nw-alert p:last-child { margin-bottom: 0; }

.nw-form { display: flex; flex-direction: column; gap: 1.1rem; }
.nw-field { display: flex; flex-direction: column; gap: .4rem; }
.nw-label { font-size: .8rem; font-weight: 700; color: #d5d5dd; }
.nw-label em { font-style: normal; font-size: .68rem; color: #ff4081; margin-left: .4rem; }
.nw-field input[type="text"], .nw-field textarea {
    width: 100%; box-sizing: border-box;
    background: #0f0f14; border: 1px solid #32323e; border-radius: 8px;
    padding: .7rem .8rem; color: #e8e8ee; font-size: .88rem; font-family: inherit;
}
.nw-field input[type="text"]:focus, .nw-field textarea:focus { outline: none; border-color: #f5a623; }
.nw-field textarea { line-height: 1.7; resize: vertical; }
.nw-hint { font-size: .7rem; color: #6a6a76; line-height: 1.6; }

.nw-radio { display: flex; align-items: center; gap: .5rem; font-size: .8rem; color: #c9c9d3; cursor: pointer; }
.nw-radio input { accent-color: #f5a623; }

.nw-submit {
    align-self: flex-start; border: 0; cursor: pointer;
    background: #f5a623; color: #111; font-weight: 800; font-size: .9rem;
    padding: .75rem 2rem; border-radius: 999px;
}
.nw-submit:hover { filter: brightness(1.08); }

.nw-terms { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid #24242c; }
.nw-terms h2 { font-size: .88rem; font-weight: 800; margin: 0 0 .7rem; color: #d5d5dd; }
.nw-terms ul { margin: 0; padding-left: 1.1rem; }
.nw-terms li { font-size: .76rem; color: #8a8a96; line-height: 1.9; }
.nw-terms strong { color: #c9c9d3; }

.nw-done { text-align: center; padding: 3rem 1rem; }
.nw-done-icon {
    width: 56px; height: 56px; margin: 0 auto 1rem; border-radius: 50%;
    background: #4caf50; color: #fff; font-size: 1.8rem; font-weight: 800;
    display: flex; align-items: center; justify-content: center;
}
.nw-done h1 { font-size: 1.3rem; font-weight: 800; margin: 0 0 .8rem; color: #fff; }
.nw-done p { font-size: .85rem; color: #a4a4b0; line-height: 1.8; margin: 0 0 .8rem; }
.nw-done a { color: #f5a623; }

/* ---------- 記事詳細 ---------- */
.nw-crumb { font-size: .75rem; color: #7c7c88; margin-bottom: 1rem; }
.nw-crumb a { color: #4a9eff; text-decoration: none; }
.nw-crumb span { margin: 0 .35rem; }

.nw-article {
    background: #16161c; border: 1px solid #2a2a33;
    border-radius: 16px; padding: 1.5rem;
}
.nw-article h1 { font-size: 1.5rem; font-weight: 800; line-height: 1.5; margin: .3rem 0 1rem; color: #fff; }
.nw-cover { width: 100%; max-height: 320px; object-fit: cover; border-radius: 12px; margin-bottom: 1.25rem; }
.nw-article-body { font-size: .92rem; line-height: 1.9; color: #c9c9d3; }
.nw-article-body p { margin: 0 0 1rem; }

.nw-rank { list-style: none; counter-reset: nwr; margin: 0 0 1.25rem; padding: 0; }
.nw-rank li {
    counter-increment: nwr;
    display: flex; align-items: baseline; gap: .6rem;
    padding: .6rem .2rem; border-bottom: 1px solid #24242c;
}
.nw-rank li::before {
    content: counter(nwr);
    flex: 0 0 1.6rem; text-align: center;
    font-weight: 800; font-size: .8rem; color: #4a9eff;
}
.nw-rank li:first-child::before { color: #f5a623; font-size: 1.05rem; }
.nw-rank-t { flex: 1 1 auto; min-width: 0; font-weight: 600; word-break: break-word; color: #e8e8ee; }
.nw-rank-t a { color: inherit; text-decoration: none; }
.nw-rank-t a:hover { color: #f5a623; }
.nw-rank-m { flex: 0 0 auto; font-size: .74rem; color: #7c7c88; white-space: nowrap; }

.nw-note { font-size: .72rem; color: #6a6a76; line-height: 1.7; }
.nw-src-note { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid #24242c; }

.nw-cta {
    display: inline-block; text-decoration: none; font-weight: 700; font-size: .85rem;
    color: #f5a623; padding: .5rem 0;
}
.nw-cta:hover { text-decoration: underline; }

/* ---------- 商品カード（送客） ---------- */
.nw-promo, .nw-more { margin-top: 2rem; }
.nw-promo h2, .nw-more h2 { font-size: 1rem; font-weight: 800; margin: 0 0 .8rem; color: #fff; }

.nw-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .75rem; }
.nw-card {
    display: flex; flex-direction: column; text-decoration: none; color: #e8e8ee;
    border: 1px solid #2a2a33; border-radius: 12px; overflow: hidden; background: #16161c;
    transition: transform .12s ease, border-color .12s ease;
}
.nw-card:hover { transform: translateY(-2px); border-color: #45454f; }
.nw-card img { width: 100%; aspect-ratio: 16/10; object-fit: cover; display: block; background: #0d0d11; }
.nw-card-noimg {
    display: flex; align-items: center; justify-content: center;
    aspect-ratio: 16/10; font-size: 1.6rem; background: #0d0d11;
}
.nw-card-t { padding: .5rem .6rem .2rem; font-size: .75rem; font-weight: 600; line-height: 1.45; }
.nw-card-p { padding: 0 .6rem .55rem; font-size: .73rem; font-weight: 800; color: #f5a623; }

.nw-morelist { list-style: none; margin: 0; padding: 0; }
.nw-morelist li {
    display: flex; justify-content: space-between; gap: .75rem; align-items: baseline;
    padding: .55rem 0; border-bottom: 1px solid #24242c; font-size: .85rem;
}
.nw-morelist a { color: #e8e8ee; text-decoration: none; font-weight: 600; }
.nw-morelist a:hover { color: #f5a623; }
.nw-morelist .nw-ago { color: #6a6a76; font-size: .72rem; white-space: nowrap; }

/* ---------- ページャ・その他 ---------- */
.nw-pager { display: flex; align-items: center; justify-content: center; gap: 1rem; margin: 1.75rem 0; }
.nw-pager a {
    text-decoration: none; font-size: .82rem; font-weight: 700; color: #f5a623;
    border: 1px solid rgba(245,166,35,.35); padding: .45rem 1rem; border-radius: 999px;
}
.nw-pager a:hover { background: rgba(245,166,35,.14); }
.nw-pageno { font-size: .78rem; color: #7c7c88; }

.nw-empty { text-align: center; padding: 3rem 1rem; color: #9a9aa5; font-size: .88rem; }

.nw-disclaimer {
    margin-top: 2.5rem; padding-top: 1rem;
    border-top: 1px solid #24242c;
    font-size: .7rem; color: #6a6a76; line-height: 1.8;
}
.nw-disclaimer a { color: #4a9eff; }

/* ---------- スマホ ---------- */
@media (max-width: 560px) {
    #nwrap { padding: 1.25rem .75rem 3rem; }
    .nw-head h1 { font-size: 1.45rem; }
    .nw-item { gap: .7rem; padding: .7rem; }
    .nw-thumb { flex-basis: 96px; width: 96px; height: 66px; }
    .nw-title { font-size: .9rem; }
    .nw-sum { font-size: .75rem; }
    .nw-article { padding: 1.1rem; }
    .nw-article h1 { font-size: 1.22rem; }
    .nw-cards { grid-template-columns: repeat(2, 1fr); }
    /* アンテナ一覧はスマホでも密度を保つ（サムネだけ少し縮める） */
    .nw-rthumb { flex-basis: 76px; width: 76px; height: 50px; }
    .nw-rtitle { font-size: .83rem; }
    .nw-row-main { gap: .55rem; padding: .45rem .25rem; }
    .nw-rtalk { padding: 0 .5rem; }
    .nw-headbtn { font-size: .74rem; padding: .55rem .85rem; }
}
