/* Stack展示場（段階2b） */
:root{
  --bg:#0d0f13; --panel:#151821; --line:#262b38; --fg:#e8eaf0; --muted:#8b93a5;
  --acc:#4b8bf0;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);
  font:14px/1.6 "Hiragino Sans","Yu Gothic UI",system-ui,sans-serif}

/* hidden属性は何があっても効かせる（display指定に負けさせない） */
[hidden]{display:none !important}

.top{display:flex;align-items:center;gap:18px;padding:10px 18px;
  border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);z-index:10}
.top h1{font-size:17px;margin:0}
.tab{background:none;border:none;color:var(--muted);font-size:14px;
  padding:6px 10px;cursor:pointer;border-bottom:2px solid transparent}
.tab.on{color:var(--fg);border-bottom-color:var(--acc)}
.auth{margin-left:auto;color:var(--muted);font-size:12px;
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:100%}
.top{flex-wrap:wrap}

.gate{padding:60px 20px;text-align:center;color:var(--muted)}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
  gap:12px;padding:16px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:9px;
  overflow:hidden;cursor:pointer}
.card img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;background:#0a0c10}
.card .cap{padding:6px 9px;font-size:12px;color:var(--muted);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.drafts{max-width:900px;margin:0 auto;padding:16px}
.draft{display:flex;gap:12px;align-items:center;background:var(--panel);
  border:1px solid var(--line);border-radius:9px;padding:10px;margin:10px 0}
.draft img{width:84px;height:84px;object-fit:cover;border-radius:6px;background:#0a0c10}
.draft .meta{flex:1;font-size:12px;color:var(--muted)}
.badge{display:inline-block;font-size:11px;border:1px solid var(--line);
  border-radius:4px;padding:1px 6px;margin-right:6px;color:var(--muted)}
.badge.chain{color:#7fd0a0;border-color:#2c4a3a}

.overlay{position:fixed;inset:0;background:rgba(5,7,10,.94);z-index:50;
  display:flex;align-items:center;justify-content:center}
.box{position:relative;background:var(--panel);border:1px solid var(--line);
  border-radius:10px;padding:18px;width:min(1100px,94vw);max-height:92vh;overflow:auto}
.close{position:absolute;top:8px;right:10px;background:none;border:none;
  color:var(--fg);font-size:24px;cursor:pointer}
.detail-flex{display:flex;gap:16px;flex-wrap:wrap}
.detail-img{flex:1.4;min-width:280px}
.detail-img img{max-width:100%;max-height:78vh;border-radius:8px}
.detail-side{flex:1;min-width:260px}
.detail-side h2{margin:2px 0 8px;font-size:16px}
.recipe{background:#0e1118;border:1px solid var(--line);border-radius:8px;
  padding:10px;font-size:12px;white-space:pre-wrap;word-break:break-all}
.recipe h3{margin:0 0 6px;font-size:12px;color:var(--muted)}

.pub-box{width:min(560px,94vw)}
.pub-box img{width:150px;border-radius:8px;margin:4px 0 10px}
.pub-box label{display:block;margin:8px 0;font-size:13px}
.pub-box input[type=text],.pub-box input:not([type]){width:100%;background:#0e1118;
  border:1px solid var(--line);border-radius:6px;color:var(--fg);padding:7px 9px}
.sw input{margin-right:8px}
.sw.must{color:#f0c04b}
.row{display:flex;gap:10px;margin-top:12px}
.btn{background:#232838;border:1px solid var(--line);color:var(--fg);
  border-radius:7px;padding:8px 16px;cursor:pointer;font-size:13px}
.btn.primary{background:var(--acc);border-color:var(--acc)}
.btn.danger{background:none;border-color:#5a2a2a;color:#e08a8a}
.btn:disabled{opacity:.5;cursor:default}
.muted{color:var(--muted);font-size:12px}

/* 系譜（親リンク＋派生サムネ） */
.lineage-parent a { color: #5b8cff; cursor: pointer; text-decoration: none; }
.lineage-parent a:hover { text-decoration: underline; }
.lineage-head { margin-top: 8px; font-size: 13px; opacity: .8; }
.lineage-children { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.lineage-thumb { width: 64px; height: 64px; object-fit: cover; border-radius: 6px;
  cursor: pointer; border: 1px solid rgba(255,255,255,.15); }
.lineage-thumb:hover { border-color: #5b8cff; }

/* 会員バッジ */
.member-badge { display:inline-block; padding:2px 8px; border-radius:10px; font-size:12px;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); }
.member-badge.is-member { background:rgba(240,192,64,.18); border-color:#f0c040; color:#f0c040; }
/* 入会/会員管理CTA（案B ¥500/月） */
.member-cta { margin-left:8px; padding:3px 12px; border-radius:12px; font-size:12px; font-weight:700;
  cursor:pointer; background:#f0c040; color:#1a1a1a; border:1px solid #f0c040; }
.member-cta:hover:not(:disabled) { background:#ffd34d; }
.member-cta:disabled { opacity:.5; cursor:default; }
.member-cta.is-manage { background:transparent; color:#f0c040; border-color:rgba(240,192,64,.5); font-weight:600; }
.member-cta.is-manage:hover:not(:disabled) { background:rgba(240,192,64,.12); }

/* 管理人ちゃんコーナー（常駐AI管理人 第2層: お題＋今日の発見） */
.mascot { margin:12px 16px; padding:12px 14px; border:1px solid var(--line); border-radius:10px;
  background:linear-gradient(135deg, rgba(75,139,240,.10), var(--panel)); }
.mascot-head { font-size:12px; font-weight:700; color:var(--acc); margin-bottom:6px; }
.mascot-theme { font-size:15px; color:var(--fg); margin-bottom:10px; }
.mascot-theme b { font-size:18px; }
.mascot-disc-label { font-size:12px; color:var(--muted); margin-bottom:4px; }
.mascot-discovery img { max-width:170px; max-height:170px; border-radius:8px; cursor:pointer;
  display:block; object-fit:cover; background:#0a0c10; border:1px solid var(--line); }
.mascot-discovery img:hover { border-color:var(--acc); }

/* 管理画面（常駐AI管理人の人間用確認板・管理者のみ） */
.admin { max-width:900px; margin:0 auto; padding:16px; }
.admin-sec { margin:14px 0 22px; }
.admin-h { font-size:15px; margin:0 0 8px; border-bottom:1px solid var(--line); padding-bottom:6px; }
.admin-badge { font-size:12px; color:var(--acc); margin-left:6px; }
.admin-row { background:var(--panel); border:1px solid var(--line); border-radius:9px;
  padding:10px 12px; margin:8px 0; }
.admin-row-head { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:14px; }
.sev-badge { display:inline-block; color:#fff; font-size:12px; font-weight:700;
  border-radius:5px; padding:1px 8px; }
.admin-sum { font-size:13px; color:var(--fg); margin:6px 0 2px; }
.admin-note { font-size:12px; color:var(--muted); margin:2px 0; white-space:pre-wrap; word-break:break-word; }
.admin-row-act { display:flex; gap:8px; margin-top:8px; flex-wrap:wrap; }

/* 通報（常駐AI管理人④: 利用者→AI仕分け→人間の確認板） */
.report { margin-top:12px; }
.report-link { background:none; border:none; color:var(--muted); font-size:12px;
  cursor:pointer; padding:2px 0; text-decoration:underline; }
.report-link:hover { color:#e08a8a; }
.report-form { margin-top:8px; padding:10px; border:1px solid #5a2a2a; border-radius:8px;
  background:rgba(224,138,138,.06); }
.report-form label { display:block; font-size:12px; color:var(--muted); margin-bottom:8px; }
.report-form select, .report-form textarea { width:100%; margin-top:4px; background:#0e1118;
  border:1px solid var(--line); border-radius:6px; color:var(--fg); padding:7px 9px; font:inherit; }
.report-form textarea { resize:vertical; }
.report-row { display:flex; gap:8px; margin:4px 0 8px; }

/* コメント（常駐AI管理人②: 管理人Botの歓迎＋利用者コメント） */
.comments { margin-top:14px; border-top:1px solid var(--line); padding-top:10px; }
.comments-head { font-size:13px; color:var(--muted); margin:0 0 8px; }
.comment { margin-bottom:8px; }
.comment-who { font-size:12px; color:var(--muted); margin-bottom:2px; }
.comment.bot .comment-who { color:var(--acc); font-weight:700; }
.comment-body { font-size:14px; white-space:pre-wrap; word-break:break-word; color:var(--fg); }
.comment.bot .comment-body { background:rgba(75,139,240,.08); border-radius:6px; padding:6px 8px; }
.comment-form { display:flex; gap:8px; margin-top:10px; }
.comment-form input { flex:1; background:#0e1118; border:1px solid var(--line);
  border-radius:6px; color:var(--fg); padding:7px 9px; }

/* 入会/解約の完了カード（?billing=success|cancel） */
.billing-result-overlay{position:fixed;inset:0;z-index:100000;background:rgba(0,0,0,.62);
  display:flex;align-items:center;justify-content:center;padding:16px}
.billing-result-card{background:#1b1f27;color:#e5e7eb;width:min(440px,94vw);border-radius:16px;
  padding:28px 24px;text-align:center;border:1px solid rgba(255,255,255,.12);
  box-shadow:0 20px 60px rgba(0,0,0,.5);animation:brPop .25s ease-out}
.billing-result-card.is-success{border-color:#f0c040;box-shadow:0 20px 60px rgba(240,192,64,.28)}
@keyframes brPop{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}
.br-emoji{font-size:46px;line-height:1}
.br-title{margin:.5rem 0 .2rem;font-size:20px}
.billing-result-card.is-success .br-title{color:#f0c040}
.br-sub{margin:.2rem 0 .8rem;opacity:.9}
.br-benefits{text-align:left;max-width:320px;margin:.4rem auto .4rem;padding-left:1.1em;
  line-height:1.95;font-size:14px}
.br-note{font-size:12px;opacity:.7;margin:.5rem 0 0}
.br-btn{margin-top:1.1rem;padding:10px 26px;border-radius:24px;border:none;cursor:pointer;
  font-weight:700;font-size:15px;background:#f0c040;color:#1a1a1a}
.br-btn:hover{background:#ffd34d}

/* お題「このお題で作る」ボタン（StackPrompt連携） */
.mascot-make-btn{display:inline-block;margin-left:4px;padding:2px 10px;border-radius:12px;
  font-size:12px;font-weight:700;text-decoration:none;cursor:pointer;
  background:#f0c040;color:#1a1a1a;border:1px solid #f0c040}
.mascot-make-btn:hover{background:#ffd34d}
.mascot-make-btn.sm{font-size:11px;padding:1px 8px;margin-left:0}
/* 📅 これからのお題（先出し・会員は3日後まで／無料は明日まで＋🔒導線） */
.mascot-upcoming{margin-top:10px;padding-top:8px;border-top:1px dashed rgba(255,255,255,.14)}
.mascot-upcoming-label{font-size:12px;font-weight:700;color:var(--acc);margin-bottom:6px}
.mascot-upcoming-row{font-size:13px;color:var(--fg);margin:4px 0;display:flex;align-items:center;flex-wrap:wrap;gap:2px}
.mascot-upcoming-row.locked{opacity:.8}
.mascot-upcoming-upsell{margin-left:6px;font-size:11px;font-weight:700;text-decoration:none;
  padding:1px 8px;border-radius:12px;background:transparent;color:#f0c040;border:1px solid #f0c040}
.mascot-upcoming-upsell:hover{background:#f0c040;color:#1a1a1a}
/* ちちぷい風ディスカバリーPhase1: タグ検索＋人気タグ＋カードのタグ */
.discovery{padding:10px 12px;margin:0 0 8px;border-bottom:1px solid rgba(255,255,255,.1)}
.discovery-search{display:flex;gap:6px;align-items:center;margin-bottom:8px}
.discovery-input{flex:1 1 200px;max-width:420px;padding:6px 10px;border-radius:8px;
  border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.05);color:var(--fg)}
.discovery-current{font-size:14px;color:var(--fg)}
.discovery-current b{font-size:16px}
.discovery-back{margin-left:4px;color:var(--acc);text-decoration:none;font-size:13px}
.discovery-back:hover{text-decoration:underline}
.discovery-popular{font-size:13px;color:var(--fg);display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.discovery-popular-label{font-weight:700;color:var(--acc)}
.tag-chips{display:flex;flex-wrap:wrap;gap:5px}
.tag-chips.inline{display:inline-flex}
.tag-chips.card-tags{margin:4px 8px 8px;gap:4px}
.tag-chip{display:inline-block;padding:2px 8px;border-radius:11px;font-size:11px;
  text-decoration:none;background:rgba(240,192,64,.14);color:#f0c040;border:1px solid rgba(240,192,64,.35)}
.tag-chip:hover{background:#f0c040;color:#1a1a1a}
.card-tags .tag-chip{font-size:10px;padding:1px 6px}
/* 並び替えタブ(新着/人気/急上昇) */
.discovery-sorts{display:flex;gap:6px;margin-bottom:8px;flex-wrap:wrap}
.sort-tab{padding:4px 12px;border-radius:14px;font-size:13px;cursor:pointer;
  background:transparent;color:var(--fg);border:1px solid rgba(255,255,255,.2)}
.sort-tab.on{background:var(--acc);color:#fff;border-color:var(--acc);font-weight:700}
.sort-tab:hover{border-color:var(--acc)}
/* いいね(公開★) */
.card-like{font-size:12px;color:#ff6b8a;margin:2px 8px 6px;font-weight:700}
.d-like{margin:4px 0 8px}
.like-btn{padding:5px 14px;border-radius:16px;font-size:15px;cursor:pointer;font-weight:700;
  background:transparent;color:#ff6b8a;border:1px solid #ff6b8a}
.like-btn.on{background:#ff6b8a;color:#fff}
.like-btn:hover{background:rgba(255,107,138,.15)}
.like-btn.on:hover{background:#ff5277}
.like-count{font-size:14px}
/* 🎯今日のお題カテゴリ（今日＋これから＋日ごと半永久アーカイブ） */
.theme-cat{padding:12px}
.theme-today{padding:12px 14px;margin-bottom:12px;border:1px solid var(--acc);border-radius:10px;background:rgba(99,102,241,.06)}
.theme-today-head{font-size:18px;color:var(--fg);margin-bottom:8px}
.theme-today-head b{font-size:22px;color:var(--acc)}
.theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin:8px 0 4px}
.theme-archive{margin-top:16px}
.theme-archive-head{font-size:15px;font-weight:700;color:var(--acc);margin:10px 0 8px;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:4px}
.theme-day{margin-bottom:18px}
.theme-day-head{font-size:14px;color:var(--fg);margin-bottom:4px}
.theme-day-head b{color:var(--acc)}
.theme-day-all{display:inline-block;margin:4px 2px;font-size:12px;color:var(--acc);text-decoration:none}
.theme-day-all:hover{text-decoration:underline}
.theme-pick{font-weight:700}
.theme-pick #p-theme-lbl{font-weight:400;margin-left:4px}
.theme-dl-hint{margin-top:8px;font-size:12px}
.theme-dl-hint a{color:var(--acc);text-decoration:none;font-weight:700}
.theme-dl-hint a:hover{text-decoration:underline}
/* ⏰ 予約投稿（メンバー特典） */
.pub-sched{margin:8px 0;padding:10px;border:1px dashed var(--acc);border-radius:8px;background:rgba(99,102,241,.05)}
.pub-sched-head{font-weight:700;color:var(--acc);margin-bottom:6px}
.pub-sched-row{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:4px}
.pub-sched-row input[type=datetime-local]{padding:5px 8px;border-radius:6px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.05);color:var(--fg)}
.sched-h{font-size:14px;color:var(--acc);margin:6px 0}
/* 下書き箱 ドロップゾーン（D&D/フォルダ一括アップ） */
.dropzone{border:2px dashed rgba(255,255,255,.25);border-radius:12px;padding:20px;text-align:center;margin:10px 0 16px;transition:border-color .15s,background .15s}
.dropzone.over{border-color:var(--acc);background:rgba(99,102,241,.08)}
.dz-title{font-size:15px;margin:0 0 8px}
.dz-btns{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:6px}
.dz-btns .btn{cursor:pointer}
#p-sched-upsell{color:var(--acc);font-weight:700}

/* ── 収益化の導線: 会員特典モーダル / 公開フォームのアップセル（bg収益化） ── */
.member-badge.clickable { cursor:pointer; }
.member-badge.clickable:hover { filter:brightness(1.15); text-decoration:underline; }
.mp-box { max-width:440px; width:calc(100% - 32px); text-align:center; }
.mp-reason { background:rgba(240,192,64,.14); border:1px solid rgba(240,192,64,.4); color:#f0c040;
  border-radius:8px; padding:8px 10px; margin:0 0 10px; font-size:13px; }
.mp-title { margin:.2rem 0 .1rem; font-size:20px; color:#f0c040; }
.mp-price { margin:.1rem 0 .8rem; font-size:15px; }
.mp-price b { font-size:26px; }
.mp-price span { opacity:.8; font-size:13px; }
.mp-cancel { color:#8fd18f; }
.mp-cols { display:flex; gap:10px; text-align:left; }
.mp-col { flex:1; border:1px solid var(--line); border-radius:10px; padding:10px 12px; background:#1b2030; }
.mp-col-h { font-weight:700; margin-bottom:6px; text-align:center; }
.mp-mem { border-color:#f0c040; background:rgba(240,192,64,.08); }
.mp-mem .mp-col-h { color:#f0c040; }
.mp-col ul { margin:0; padding-left:1.1em; font-size:13px; line-height:1.7; }
.mp-col b { color:#fff; }
.mp-note { font-size:11px; opacity:.65; margin:.7rem 0 0; }
.mp-actions { display:flex; gap:8px; justify-content:center; margin-top:1rem; flex-wrap:wrap; }
.mp-cta { padding:10px 22px; border-radius:24px; font-weight:700; }
.mp-later { padding:10px 16px; border-radius:24px; opacity:.85; }
.pub-upsell { background:rgba(240,192,64,.1); border:1px solid rgba(240,192,64,.35); border-radius:8px;
  padding:8px 10px; margin:8px 0; font-size:12.5px; line-height:1.6; }
.pub-upsell-link { display:inline-block; margin-top:3px; color:#f0c040; font-weight:700; cursor:pointer; text-decoration:underline; }
@media (max-width:420px){ .mp-cols{ flex-direction:column; } }

/* X導線: 共有バー（作品詳細） */
.d-share { display:flex; gap:8px; flex-wrap:wrap; margin:0 0 10px; }
.share-btn { display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700;
  border:1px solid var(--line); border-radius:20px; padding:6px 14px; cursor:pointer;
  background:var(--panel); color:var(--fg); text-decoration:none; line-height:1; }
.share-btn:hover { border-color:var(--acc); }
.share-x { background:#000; color:#fff; border-color:#000; }
.share-x:hover { background:#1a1a1a; border-color:#1a1a1a; }
.share-x .x-logo { font-size:14px; font-weight:900; }
.share-copy { background:var(--panel); }

/* フォロー機能（作者表示・フォローボタン・作者ページ・人気ユーザー） */
.d-author { display:flex; align-items:center; gap:10px; margin:2px 0 8px; flex-wrap:wrap; }
.d-author-name { color:var(--acc); font-weight:700; font-size:13px; text-decoration:none; cursor:pointer; }
.d-author-name:hover { text-decoration:underline; }
.follow-btn { font-size:12px; font-weight:700; border:1px solid var(--acc); color:var(--acc);
  background:transparent; border-radius:20px; padding:4px 14px; cursor:pointer; line-height:1; }
.follow-btn:hover { background:rgba(75,139,240,.12); }
.follow-btn.on { background:var(--acc); color:#fff; border-color:var(--acc); }
.card-author { padding:0 9px 7px; font-size:11px; color:var(--acc); cursor:pointer; }
.card-author:hover { text-decoration:underline; }
.up-head { display:flex; flex-direction:column; gap:6px; padding:4px 0 14px; border-bottom:1px solid var(--line); margin-bottom:12px; }
.up-name { font-size:18px; font-weight:800; color:var(--fg); }
.up-stat { font-size:13px; color:var(--muted); }
.up-stat b { color:var(--fg); }
.up-head .follow-btn { align-self:flex-start; margin-top:4px; padding:6px 18px; font-size:13px; }
.popular-users { margin:18px 0 8px; padding:12px; background:var(--panel); border:1px solid var(--line); border-radius:9px; }
.popular-users-head { font-size:13px; font-weight:700; color:var(--fg); margin-bottom:8px; }
.popular-user { display:block; width:100%; text-align:left; background:none; border:none; border-bottom:1px solid var(--line);
  color:var(--acc); font-size:13px; padding:8px 2px; cursor:pointer; }
.popular-user:last-child { border-bottom:none; }
.popular-user:hover { color:var(--fg); }
.pu-count { color:var(--muted); font-size:11px; font-weight:400; }

/* 表示名の変更ボタン（ヘッダ＋自分の作者ページ） */
.name-edit-btn { font-size:11px; font-weight:700; border:1px solid var(--line); color:var(--muted);
  background:transparent; border-radius:14px; padding:3px 10px; cursor:pointer; margin-left:8px; line-height:1; }
.name-edit-btn:hover { border-color:var(--acc); color:var(--acc); }

/* 🎨 真似る導線（公開レシピ→ローカルStackPromptで再現） */
.mimic-box { margin-top: 10px; display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.mimic-btn { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700;
  background: var(--acc); color: #fff; border: none; border-radius: 20px; padding: 7px 16px; text-decoration: none; }
.mimic-btn:hover { filter: brightness(1.08); }
.mimic-dl { font-size: 11px; color: var(--muted); text-decoration: underline; }
.mimic-dl:hover { color: var(--acc); }


/* ===== はじめに / できること ヒーロー（bg2b.0.29） ===== */
.intro{position:relative;margin:14px 16px 0;padding:18px 20px;
  background:linear-gradient(180deg,#171b27,var(--panel));
  border:1px solid var(--line);border-radius:12px}
.intro-close{position:absolute;top:6px;right:10px;background:none;border:none;
  color:var(--muted);font-size:20px;line-height:1;cursor:pointer}
.intro-close:hover{color:var(--fg)}
.intro-title{margin:0 24px 6px 0;font-size:19px;color:var(--fg)}
.intro-sub{margin:0 0 14px;font-size:13px;color:var(--muted);line-height:1.6}
.intro-sub strong{color:#9fc0ff}
.intro-flow{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:10px;
  grid-template-columns:repeat(4,1fr);counter-reset:step}
.intro-flow li{position:relative;display:flex;gap:9px;align-items:flex-start;
  background:#0e1118;border:1px solid var(--line);border-radius:9px;padding:11px;counter-increment:step}
.intro-flow li::before{content:counter(step);position:absolute;top:-8px;left:-8px;
  width:20px;height:20px;border-radius:50%;background:var(--acc);color:#fff;
  font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}
.intro-ic{font-size:22px;line-height:1.1}
.intro-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.intro-tx b{font-size:13px;color:var(--fg)}
.intro-tx small{font-size:11px;color:var(--muted);line-height:1.4}
.intro-cta{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.intro-btn{display:inline-block;background:var(--acc);color:#fff;text-decoration:none;
  font-size:13px;font-weight:600;padding:8px 16px;border-radius:8px}
.intro-btn:hover{filter:brightness(1.08)}
.intro-hint{font-size:12px;color:var(--muted)}
@media(max-width:640px){.intro{margin:12px 12px 0;padding:15px}.intro-flow{grid-template-columns:repeat(2,1fr)}.intro-title{font-size:17px}}

/* 「はじめに」タブCTAのゴーストボタン（bg2b.0.30） */
.intro-btn.ghost{background:transparent;border:1px solid var(--acc);color:#cdd9ff;cursor:pointer}
.intro-btn.ghost:hover{background:rgba(75,139,240,.12);filter:none}

/* 固定カテゴリ（ジャンル）チップ bg2b.0.31 */
.discovery-cats{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 10px}
.cat-chip{background:#1b2130;border:1px solid var(--line);color:var(--muted);
  font-size:13px;padding:5px 14px;border-radius:999px;cursor:pointer;white-space:nowrap}
.cat-chip:hover{color:var(--fg);border-color:var(--acc)}
.cat-chip.on{background:var(--acc);border-color:var(--acc);color:#fff;font-weight:600}

/* 投稿フォームのカテゴリ選択 bg2b.0.31 */
.p-cats{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:2px 0 8px}
.p-cats-label{font-size:11px;color:var(--muted);width:100%;margin-bottom:1px}
.p-cat{background:#1b2130;border:1px solid var(--line);color:var(--muted);font-size:12px;
  padding:4px 12px;border-radius:999px;cursor:pointer}
.p-cat:hover{color:var(--fg);border-color:var(--acc)}
.p-cat.on{background:var(--acc);border-color:var(--acc);color:#fff;font-weight:600}

/* 展示＝左サイドバー(カテゴリ/並び/検索)＋右グリッドの2カラム bg2b.0.33 */
.feed-2col{display:flex;gap:18px;align-items:flex-start;padding:12px 16px}
.feed-side{flex:0 0 200px;position:sticky;top:54px;max-height:calc(100vh - 66px);overflow-y:auto;overflow-x:hidden}
.feed-main{flex:1 1 auto;min-width:0}
.feed-side .discovery{border-bottom:none;padding:0;margin:0}
.feed-side .discovery-cats{flex-direction:column;align-items:stretch;gap:5px;margin-bottom:12px}
.feed-side .discovery-cats .cat-chip{text-align:left}
.feed-side .discovery-sorts{flex-wrap:wrap;margin-top:4px}
.feed-side .discovery-search{margin-top:10px}
.feed-side .discovery-input{flex:1 1 auto;max-width:none}
.feed-side .discovery-popular{margin-top:12px}
@media(max-width:720px){.feed-2col{flex-direction:column}.feed-side{position:static;flex:none;width:100%;max-height:none}.feed-side .discovery-cats{flex-direction:row}}

/* LIVE（設計書 v1.3.1 §3）: 展示タブの右の欄 */
.feed-live{flex:0 0 250px;position:sticky;top:54px;max-height:calc(100vh - 66px);overflow-y:auto;border-left:1px solid rgba(128,128,128,.25);padding-left:12px}
.live-head{display:flex;align-items:center;gap:6px;margin-bottom:8px;font-size:14px}
.live-dot{width:8px;height:8px;border-radius:50%;background:#e5484d;box-shadow:0 0 0 3px rgba(229,72,77,.25);animation:livepulse 1.6s infinite}
@keyframes livepulse{0%{opacity:1}50%{opacity:.35}100%{opacity:1}}
.live-tabs{margin-left:auto;display:flex;gap:4px}
.live-tab{font-size:11px;padding:2px 8px;border-radius:10px;border:1px solid rgba(128,128,128,.4);background:transparent;color:inherit;cursor:pointer}
.live-tab.on{background:#5b8def;border-color:#5b8def;color:#fff}
.live-item{display:flex;gap:8px;align-items:flex-start;padding:7px 4px;border-bottom:1px solid rgba(128,128,128,.15);cursor:pointer;font-size:12.5px;line-height:1.45}
.live-item:hover{background:rgba(128,128,128,.1)}
.live-item img{width:44px;height:44px;object-fit:cover;border-radius:6px;flex:0 0 44px}
.live-text{min-width:0;word-break:break-word}
.live-ago{font-size:11px;margin-top:2px}
.live-empty{font-size:12px;padding:8px 2px}
@media(max-width:1100px){.feed-3col{flex-wrap:wrap}.feed-3col .feed-live{flex:1 1 100%;position:static;max-height:230px;border-left:none;border-bottom:1px solid rgba(128,128,128,.25);padding:0 0 6px;order:-1}}

/* 🔔 通知・🚫 ブロック（設計書 v1.3.1 §4・§5） */
.bell-wrap{position:relative;display:inline-block;margin-left:auto;margin-right:10px}
.bell-wrap + .auth{margin-left:0}
.bell-btn{background:transparent;border:1px solid rgba(128,128,128,.4);border-radius:16px;padding:2px 10px;font-size:15px;cursor:pointer;color:inherit;position:relative}
.bell-badge{position:absolute;top:-6px;right:-6px;background:#e5484d;color:#fff;font-size:10px;border-radius:9px;padding:1px 5px;min-width:16px;text-align:center}
.bell-panel{position:absolute;right:0;top:34px;width:320px;max-height:70vh;overflow-y:auto;background:#1b1e26;border:1px solid rgba(128,128,128,.35);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.4);z-index:50;padding:6px}
.bell-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 6px 8px;border-bottom:1px solid rgba(128,128,128,.2);font-size:13px}
.bell-toggle{font-size:11px;display:flex;align-items:center;gap:4px;cursor:pointer}
.bell-item{display:flex;gap:8px;align-items:center;padding:7px 6px;border-bottom:1px solid rgba(128,128,128,.12);cursor:pointer;font-size:12.5px}
.bell-item:hover{background:rgba(128,128,128,.1)}
.bell-item.unread{background:rgba(91,141,239,.12)}
.bell-item img{width:40px;height:40px;object-fit:cover;border-radius:6px;flex:0 0 40px}
.bell-msg{padding:12px 6px;font-size:12px}
.bell-foot{padding:6px;text-align:right}
.bell-link{background:transparent;border:none;color:#8fb0ff;cursor:pointer;font-size:12px}
.block-btn{margin-left:6px;font-size:12px;padding:3px 10px;border-radius:14px;border:1px solid #a04848;background:transparent;color:#ff9c9c;cursor:pointer}
.up-actions{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:6px 0}
.up-actions > button{width:auto;margin:0}

/* 🎯 今日のミッション・称号（設計書 v1.3.1 §6） */
.mis-box{border:1px solid rgba(128,128,128,.25);border-radius:10px;padding:8px 10px;margin-bottom:12px;background:rgba(91,141,239,.06)}
.mis-head{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-bottom:6px}
.mis-head .muted{font-size:11px}
.mis-row{margin:6px 0}
.mis-label{font-size:12px;display:flex;justify-content:space-between;gap:6px}
.mis-xp{color:#f5b041;font-size:11px;white-space:nowrap}
.mis-bar{height:5px;border-radius:3px;background:rgba(128,128,128,.25);margin-top:3px;overflow:hidden}
.mis-bar i{display:block;height:100%;background:#5b8def}
.mis-row.done .mis-bar i{background:#2f9e6e}
.mis-row.done .mis-label{opacity:.75}
.mis-cnt{font-size:10px;text-align:right}
.mis-title{margin-top:8px;font-size:11px;border-top:1px solid rgba(128,128,128,.2);padding-top:6px}
.title-chip{font-size:11px;padding:2px 8px;border-radius:10px;border:1px solid #c9a227;background:rgba(201,162,39,.12);color:#f3d27a;cursor:pointer}
.title-chip.small{margin-left:8px;cursor:default;vertical-align:middle}

/* 📖 キャラ図鑑（設計書 v1.3.1 §8） */
.chars{padding:12px 16px}
.chars-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.chars-bar h2{margin:0;font-size:18px}
.chars-bar .btn.primary{margin-left:auto}
.chars-count{font-size:12px;margin:2px 0 10px}
.char-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.char-grid.small{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.char-card{border:1px solid rgba(128,128,128,.25);border-radius:10px;overflow:hidden;cursor:pointer;background:rgba(255,255,255,.02)}
.char-card:hover{border-color:#5b8def}
.char-cover{aspect-ratio:1/1;background:#222 center/cover no-repeat;display:flex;align-items:center;justify-content:center;color:#777;font-size:12px}
.char-name{font-weight:700;font-size:13px;padding:6px 8px 0}
.char-meta{font-size:11px;padding:0 8px 8px}
.char-desc{font-size:13px;white-space:pre-wrap;line-height:1.6;margin:4px 0}
.up-chars{margin-top:10px}
.up-chars-head{font-weight:700;font-size:13px;margin-bottom:6px}
.cf-row{display:block;margin:10px 0;font-size:13px}
.cf-row input[type=text],.cf-row input:not([type]),.cf-row textarea{display:block;width:100%;margin-top:4px;box-sizing:border-box}
.cf-works{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:6px;margin-top:6px;max-height:320px;overflow-y:auto}
.cf-work{position:relative;aspect-ratio:1/1;background:#222 center/cover no-repeat;border-radius:6px;border:3px solid transparent;cursor:pointer;opacity:.55}
.cf-work.on{border-color:#5b8def;opacity:1}
.cf-star{position:absolute;top:2px;right:2px;background:rgba(0,0,0,.55);color:#f5c542;border:none;border-radius:10px;font-size:14px;cursor:pointer;padding:0 5px}
.cf-actions{margin-top:12px}
.up-head > .bell-link{align-self:flex-start;padding:0}
.cf-row input:not([type=radio]),.cf-row textarea{background:#232838;color:var(--fg);border:1px solid var(--line);border-radius:6px;padding:6px 8px;font:inherit}

/* ⚙ 機能フラグ・📜 監査ログ */
.flag-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.flag-name{min-width:220px;font-weight:600}
.flag-state{font-size:12px;padding:2px 8px;border-radius:10px}
.flag-state.on{background:rgba(47,158,110,.2);color:#7fe0b0}
.flag-state.off{background:rgba(128,128,128,.2);color:#aaa}
.flag-env{font-size:11px}
.audit-row{font-size:12px;font-family:ui-monospace,Consolas,monospace}

/* 通報の確認板: 作品の画像（2026-11-04） */
.admin-rep-post{display:flex;gap:12px;align-items:flex-start;margin:8px 0}
.admin-rep-thumb{width:120px;height:120px;object-fit:cover;border-radius:8px;border:1px solid #2a3444;background:#0b0f16;display:block}
.admin-rep-thumb.none{display:flex;align-items:center;justify-content:center;color:#8a94a6;font-size:12px}
.admin-rep-meta{display:flex;flex-direction:column;gap:4px;min-width:0}
/* 運営からのお知らせ */
.notice-box{max-width:520px}
.notice-row{border:1px solid #3a2a2a;background:rgba(229,72,77,.08);border-radius:10px;padding:10px 12px;margin:10px 0}
.notice-title{font-weight:700;margin-bottom:4px}
.notice-note{margin-top:6px;font-size:13px;white-space:pre-wrap}

/* 規約・ポリシーへのリンクを暗い背景でも読めるように（2b.0.51） */
.report-form a, .notice-box a, .muted a { color:#93c5fd; text-decoration:underline; }

/* 0件の案内・人気の作者は画像グリッドの1マス(190px)ではなく横幅いっぱいに（2026-11-06・急上昇の案内が見切れていた） */
.grid > p.muted, .grid > .popular-users { grid-column: 1 / -1; }
/* 左の欄のタグ検索: 入力欄が幅を取りすぎて「検索」ボタンが欄の外へはみ出していた（2026-11-06）。入力欄を縮められるように */
.feed-side .discovery-search{flex-wrap:wrap}
.feed-side .discovery-input{flex:1 1 0;min-width:0;width:100%;box-sizing:border-box}
.feed-side .discovery-search .btn{flex:0 0 auto}

/* 🔗 連携キー（スタックアトリエギャラリー→下書き箱・2026-11-07） */
.lk-overlay { position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:9000; display:flex; align-items:center; justify-content:center; padding:16px; }
.lk-overlay[hidden] { display:none !important; }
.lk-box { background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:18px 20px; width:min(520px,100%); max-height:90vh; overflow:auto; color:var(--fg); }
.lk-box h3 { margin:0 0 8px; font-size:16px; }
.lk-desc, .lk-steps, .lk-warn, .lk-state { font-size:13px; line-height:1.6; margin:6px 0; }
.lk-steps { padding-left:20px; }
.lk-warn { color:#f0b44b; }
.lk-state { font-weight:700; }
.lk-keyrow { display:flex; gap:6px; margin:8px 0; }
.lk-keyrow[hidden] { display:none !important; }
.lk-key { flex:1 1 0; min-width:0; font-family:monospace; font-size:12px; padding:6px 8px; background:var(--bg); color:var(--fg); border:1px solid var(--acc); border-radius:6px; }
.lk-btns { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.lk-btns button, .lk-copy { padding:6px 12px; border-radius:6px; border:1px solid var(--line); background:var(--bg); color:var(--fg); cursor:pointer; font-size:13px; }
.lk-issue { background:var(--acc) !important; border-color:var(--acc) !important; color:#fff !important; font-weight:700; }
.lk-revoke { color:#f07a7a !important; }
.lk-revoke[hidden] { display:none !important; }