/* Artworks: 検索と絞り込み（2026-09-19）。黒×ライム。常時は 種類/ジャンル/色、画風と雰囲気は折りたたみ */
.wx{--lime:#C6F91F}
.wx-panel{background:#0a0a0a;color:#fff;border-radius:6px;padding:22px 24px 18px;position:relative}
.wx-top{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.wx-search{flex:1 1 320px;display:flex;align-items:center;gap:10px;background:#1a1a1a;border:1px solid #333;border-radius:999px;padding:0 18px;height:48px}
.wx-search:focus-within{border-color:var(--lime)}
.wx-search svg{flex:none;opacity:.7}
.wx-search input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:#fff;font:700 15px/1 var(--jp)}
.wx-search input::placeholder{color:#8a8a8a;font-weight:500}
.wx-search button{border:0;background:transparent;color:#aaa;font-size:18px;cursor:pointer;padding:4px}
.wx-seg{display:inline-flex;background:#1a1a1a;border-radius:999px;padding:4px}
.wx-seg button{border:0;background:transparent;color:#bbb;font:700 13px/1 var(--jp);padding:10px 16px;border-radius:999px;cursor:pointer}
.wx-seg button[aria-pressed="true"]{background:#fff;color:#0a0a0a}
.wx-row{display:grid;grid-template-columns:72px 1fr;gap:12px;align-items:start;margin-top:16px}
.wx-row .wx-seg{justify-self:start}
.wx-row>b{font:800 11px/32px var(--en-nav);letter-spacing:.12em;color:#8a8a8a;text-transform:uppercase}
.wx-row>b:has(+.wx-seg){align-self:center}
.wx-chips{display:flex;flex-wrap:wrap;gap:6px}
.wx-chip{border:1px solid #3a3a3a;background:transparent;color:#e8e8e8;font:700 13px/1 var(--jp);padding:9px 14px;border-radius:999px;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.wx-chip:hover{border-color:#fff}
.wx-chip[aria-pressed="true"]{background:var(--lime);border-color:var(--lime);color:#0a0a0a}
.wx-chip:focus-visible,.wx-seg button:focus-visible,.wx-dot:focus-visible,.wx-more:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
.wx-dots{display:flex;flex-wrap:wrap;gap:8px;padding-top:3px}
.wx-dot{width:26px;height:26px;border-radius:50%;border:2px solid #0a0a0a;box-shadow:0 0 0 1px #444;cursor:pointer;padding:0}
.wx-dot[aria-pressed="true"]{box-shadow:0 0 0 2px var(--lime);transform:scale(1.12)}
.wx-more{margin-top:14px;border:0;background:transparent;color:#bbb;font:700 12px/1 var(--jp);cursor:pointer;padding:6px 0}
.wx-more::after{content:" ▾"}.wx-more[aria-expanded="true"]::after{content:" ▴"}
.wx-extra[hidden]{display:none}
.wx-status{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px;flex-wrap:wrap}
.wx-status p{font:800 13px/1.4 var(--en-nav);letter-spacing:.04em}
.wx-status p b{font-family:var(--en);font-size:28px;margin-right:6px}
.wx-clear{border:0;background:transparent;text-decoration:underline;text-underline-offset:4px;font:700 13px/1 var(--jp);cursor:pointer;color:var(--ink)}
.wx-clear[hidden]{display:none}
.wx-empty{padding:64px 0;text-align:center;font-weight:700;color:var(--ink-soft)}
.wx-empty[hidden]{display:none}
.wx .wgrid{margin-top:18px}
.wx .wcard2{cursor:zoom-in;border:0;padding:0;width:100%;text-align:left;font:inherit;color:inherit}
.wx .wcard2 .pal{display:flex;height:4px}.wx .wcard2 .pal i{flex:1}
.wx .wcard2 .tags{display:block;font-size:10.5px;font-weight:700;color:var(--ink-soft);margin-top:6px;letter-spacing:.02em}
/* その場で大きく開く */
.wx-lb{--lime:#C6F91F;border:0;padding:0;background:transparent;max-width:none;max-height:none;width:100vw;height:100dvh;color:#fff}
.wx-lb::backdrop{background:rgba(0,0,0,.9)}
.wx-lb .in{display:grid;grid-template-columns:minmax(0,1fr) 340px;height:100%}
.wx-lb .lbst{background:#050505;display:grid;place-items:center;padding:28px;min-height:0}
.wx-lb .lbst img,.wx-lb .lbst video{max-width:100%;max-height:calc(100dvh - 56px);object-fit:contain;display:block}
.wx-lb aside{background:#0f0f0f;border-left:1px solid #222;padding:64px 28px 28px;overflow:auto}
.wx-lb h2{font-size:20px;font-weight:800;line-height:1.5}
.wx-lb .by{display:inline-block;margin-top:10px;font-weight:700;font-size:14px;color:var(--lime);text-underline-offset:4px}
.wx-lb dl{margin:26px 0 0;display:grid;grid-template-columns:64px 1fr;gap:12px 10px;font-size:13px}
.wx-lb dt{font:800 10.5px/1.9 var(--en-nav);letter-spacing:.12em;color:#8a8a8a;text-transform:uppercase}
.wx-lb dd{margin:0;font-weight:700}
.wx-lb .lt{display:flex;flex-wrap:wrap;gap:6px}
.wx-lb .lt button{border:1px solid #3a3a3a;background:transparent;color:#eee;font:700 12px/1 var(--jp);padding:7px 11px;border-radius:999px;cursor:pointer}
.wx-lb .lt button:hover{background:var(--lime);border-color:var(--lime);color:#0a0a0a}
.wx-lb .lp{display:flex;height:28px;border-radius:4px;overflow:hidden}.wx-lb .lp i{flex:1}
.wx-lb .ext{display:inline-block;margin-top:26px;font-size:12px;font-weight:700;color:#bbb;text-underline-offset:4px}
.wx-lb .x,.wx-lb .lbn{position:fixed;border:0;background:rgba(255,255,255,.1);color:#fff;width:44px;height:44px;border-radius:50%;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}  /* grid だと reveal の印が付いた右矢印だけ中身が左へ 16px ずれた（2026-09-23 実測）。flex なら印があっても中央 */
.wx-lb .x{top:14px;right:14px;z-index:2}.wx-lb .lbn.p{left:14px;top:50%}.wx-lb .lbn.n{right:354px;top:50%}
.wx-lb .x:hover,.wx-lb .lbn:hover{background:var(--lime);color:#0a0a0a}
@media (max-width:900px){
  .wx-panel{padding:16px 14px 12px;border-radius:0;margin-inline:calc(var(--gutter) * -1)}
  .wx-row{grid-template-columns:1fr;gap:6px;margin-top:14px}.wx-row>b{line-height:1.4}
  .wx-chips{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}.wx-chips::-webkit-scrollbar{display:none}.wx-chip{flex:none}
  .wx-seg{width:100%}.wx-seg button{flex:1;padding-inline:6px}
  .wx-lb .in{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}
  .wx-lb aside{border-left:0;border-top:1px solid #222;padding:18px 18px 26px;max-height:42dvh}
  .wx-lb .lbst{padding:56px 10px 10px;grid-template:minmax(0,1fr)/minmax(0,1fr)}.wx-lb .lbst img,.wx-lb .lbst video{max-height:100%}
  .wx-lb .lbn.n{right:14px}.wx-lb .lbn.p,.wx-lb .lbn.n{top:30%}
}

/* ---------- Creators: その人の色（2026-09-19） ---------- */
.dna{display:flex;height:6px;border-radius:3px;overflow:hidden;background:#ddd}.dna i{display:block;min-width:3px}
.ccard .sig{display:block;margin-top:10px}.ccard .sigt{display:block;margin-top:7px;font-size:11px;font-weight:700;color:var(--ink-soft);line-height:1.5}
.ccard[hidden]{display:none!important}
.sty{padding-top:0}
.sty-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin-top:32px}
.sty-col small{display:block;font:800 11px/1 var(--en-nav);letter-spacing:.14em;color:var(--ink-soft);margin-bottom:14px}
.sty-bar{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:baseline;text-decoration:none;margin-bottom:16px;font-weight:800;font-size:15px}
.sty-bar i{grid-column:1/-1;display:block;height:6px;background:#dcdcdc;border-radius:3px;overflow:hidden}.sty-bar u{display:block;height:100%;background:#0a0a0a;transition:background .3s}
.sty-bar:hover u{background:#9BCB00}.sty-bar em{font:800 12px/1 var(--en-nav);font-style:normal;color:var(--ink-soft)}
.sty-col .dna{height:34px;border-radius:4px}.sty-c{margin-top:12px;font-size:12px;font-weight:700;color:var(--ink-soft);line-height:1.7}
.sty-links{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:32px}.sty-links .fbtn{text-decoration:none}
@media (max-width:860px){.sty-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 18px}}

/* ---------- 2026-09-19 夜: チカチカ対策。枠を先に確保 → 作品の色で下塗り → 読み込めたらふわっと ---------- */
.wx .wgrid{columns:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));grid-auto-rows:8px;gap:0 16px;align-items:start}
.wx .wcard2{margin:0 0 16px;display:block;contain:layout paint;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.wx .wcard2 .ph{display:block;width:100%;overflow:hidden}
.wx .wcard2 .ph img{width:100%;height:100%;min-height:0;aspect-ratio:auto;object-fit:cover;display:block;opacity:0;transition:opacity .45s ease-out;background:transparent}
.wx .wcard2 .ph img.ok{opacity:1}
.wx .wcard2 .meta{height:80px;overflow:hidden}
.wx .wcard2 .t{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;margin-top:0}
.wx .wcard2 .tags{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:640px){.wx .wgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 10px}.wx .wcard2{margin-bottom:10px}}
/* Creators: 432 枚。画面外のカードは描かずに置いておく（スクロールが軽くなる）。アイコンはふわっと */
#cxGrid .ccard{content-visibility:auto;contain-intrinsic-size:246px 400px}
#cxGrid .ccard.reveal{opacity:1;transform:none}
#cxGrid .cover img{opacity:0;transition:opacity .4s ease-out}#cxGrid .cover img.ok{opacity:1}
#wxGrid:empty{min-height:130vh} /* 作品が届くまで場所を空けておく（届いた瞬間にフッターが押し下げられるのを防ぐ） */

/* ===== 2026-09-19 深夜 2: 作品は「全部同じ大きさの横長タイル」の格子に（STΛCK 案 2）。並びが動く余地をゼロにする ===== */
.wx .wgrid{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:auto;gap:22px 16px}
.wx .wcard2{margin:0;background:transparent;contain:none}
.wx .wcard2:hover{transform:none}
.wx .wcard2 .ph{aspect-ratio:4/3;border-radius:10px}
.wx .wcard2 .ph img{object-position:50% 28%;transition:opacity .45s ease-out,transform .7s cubic-bezier(.2,.7,.2,1)}
.wx .wcard2:hover .ph img{transform:scale(1.05)}
.wx .wcard2 .kb{top:10px;left:10px}
.wx .wcard2 .meta{height:auto;padding:10px 2px 0}
@media (max-width:1100px){.wx .wgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.wx .wgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 10px}}
/* Creators のカードは全員同じ形: 正方形の表紙 → 名前 → 数 → その人の色。画面外の描画省略は位置ずれの原因になったのでやめる */
#cxGrid .ccard{content-visibility:visible;contain-intrinsic-size:auto;display:flex;flex-direction:column;height:100%}
#cxGrid{align-items:stretch}
#cxGrid .ccard .cover{display:block;aspect-ratio:1;overflow:hidden;background:#dedede}
#cxGrid .ccard .cover img{width:100%;height:100%;object-fit:cover;display:block}
#cxGrid .ccard .cover .cover-ini{display:grid;place-items:center;width:100%;height:100%;font:800 64px/1 var(--jp);color:#9a9a9a}
#cxGrid .ccard .body{flex:1}

/* ===== 個人ページ（2026-09-21）: 作品ページと同じ部品を埋め込む。道具は 1 行にまとめる ===== */
.cpx{padding-top:0}
.cpx-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:26px}
.cpx .wx-seg{background:var(--white)}.cpx .wx-seg button{color:var(--ink)}.cpx .wx-seg button[aria-pressed="true"]{background:#0a0a0a;color:#fff}
.cpx .wx-search{flex:1 1 220px;max-width:340px;height:42px;background:var(--white);border-color:var(--line)}.cpx .wx-search input{color:var(--ink);font-size:14px}.cpx .wx-search button{color:var(--ink-soft)}
.cpx-feat{margin-top:34px;padding-bottom:30px;border-bottom:1px solid var(--line)}.cpx-k{font:800 11px/1 var(--en-nav);letter-spacing:.14em;color:var(--ink-soft);margin-bottom:14px}
.cpx-feat .wgrid{margin-top:0;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px 10px}.cpx-feat .wcard2 .tags{display:none}
.cp-dl{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px 20px;margin-top:26px}
.cp-dl dt{font:800 11px/32px var(--en-nav);letter-spacing:.14em;color:var(--ink-soft);text-transform:uppercase}.cp-dl dd{margin:0;display:flex;flex-wrap:wrap;gap:6px}
.tchip{display:inline-block;background:var(--white);border-radius:999px;padding:8px 13px;font-size:13px;font-weight:800}.cp-none{font-size:13px;color:var(--ink-soft);line-height:32px}
.cp-prof{padding-bottom:0}.wx-chip small{font:800 10px/1 var(--en-nav);opacity:.6;margin-left:4px}
@media (max-width:900px){.cpx-feat .wgrid{grid-template-columns:repeat(3,minmax(0,1fr))}.cp-dl{grid-template-columns:1fr;gap:4px}}
.cp-prof + .sty{padding-top:64px}.cp-prof .note-s{margin-top:18px}
/* Creators のアイコンを統一（2026-09-21）: 元の画像が四角でも丸でも、同じ大きさの円にして同じ灰色の面の中央に置く。取れない人は 代表作 → 頭文字 を同じ円で */
#cxGrid .ccard .cover{display:grid;place-items:center;aspect-ratio:4/3;background:#E6E6E6}
#cxGrid .ccard .cover img,#cxGrid .ccard .cover .cover-ini{width:46%;height:auto;aspect-ratio:1;border-radius:50%;object-fit:cover;background:#fff;box-shadow:0 0 0 4px #fff}
#cxGrid .ccard .cover .cover-ini{display:grid;place-items:center;font:800 40px/1 var(--jp);color:#8a8a8a}
#cxGrid .ccard,#cxGrid .ccard:hover{transform:none!important}#cxGrid .ccard:hover .name{text-decoration:underline;text-underline-offset:4px}

.wx-rowhint{font-size:11px;color:#8a8a8a;margin-top:8px}
.wx-row[hidden]{display:none!important}

.tchip.strong{background:#0a0a0a;color:#fff}.cp-dl [hidden]{display:none}

/* ---- Creators v3: 左に絞り込み・右に顔タイル ---- */
.cx-lay{display:grid;grid-template-columns:260px minmax(0,1fr);gap:40px;align-items:start}
.cx-side{position:sticky;top:92px;max-height:calc(100vh - 110px);overflow:auto;background:var(--white);border-radius:14px;padding:18px}
.cx-fold>summary{list-style:none;font-weight:800;font-size:14px;cursor:default;margin-bottom:14px}.cx-fold>summary::-webkit-details-marker{display:none}
.cx-side .wx-search{margin:0 0 4px;width:100%}
.cx-k{font-size:12px;font-weight:800;margin:18px 0 8px}
.cx-gk{font-size:11px;font-weight:700;color:var(--ink-soft);margin:12px 0 6px}
.cx-side .wx-seg{display:flex;flex-wrap:wrap;gap:4px}.cx-side .wx-seg.col{flex-direction:column;align-items:stretch}.cx-side .wx-seg.col button{text-align:left}
.cx-side .wx-chips{gap:5px}.cx-side .wx-chip{font-size:12px;padding:6px 10px}
.cx-sec{border-top:1px solid #e4e4e4;margin-top:18px;padding-top:14px}
.cx-sec>summary{font-size:12px;font-weight:800;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center}.cx-sec>summary::-webkit-details-marker{display:none}
.cx-sec>summary::after{content:"＋";font-weight:700}.cx-sec[open]>summary::after{content:"－"}
.cx-check{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;margin-top:14px;cursor:pointer}.cx-check input{width:16px;height:16px;accent-color:#111}
.cx-main .wx-status{margin-top:0}
.cx-msg{background:var(--white);border-radius:10px;padding:12px 14px;font-size:13px;font-weight:700;margin:0 0 14px}.cx-msg a{margin-left:8px}
.cx-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 16px}
.cx-tile{position:relative;min-width:0}.cx-tile[hidden]{display:none!important}
.cx-a{display:block;text-decoration:none;color:inherit}
.cx-face{display:block;aspect-ratio:1;border-radius:14px;overflow:hidden;background:#dcdcdc}
.cx-face img{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity .35s ease-out}.cx-face img.ok{opacity:1}
.cx-face .cover-ini{display:grid;place-items:center;width:100%;height:100%;font:800 56px/1 var(--jp);color:#8f8f8f}
.cx-name{display:block;margin-top:10px;font-size:14px;font-weight:800;line-height:1.45;overflow-wrap:anywhere}
.cx-a:hover .cx-name{text-decoration:underline;text-underline-offset:4px}
.cx-sub{display:block;margin-top:3px;font-size:11px;font-weight:700;color:var(--ink-soft)}
.cx-clip{position:absolute;top:8px;right:8px;width:34px;height:34px;border-radius:50%;border:0;background:rgba(0,0,0,.72);color:#fff;font-size:16px;line-height:1;cursor:pointer;display:grid;place-items:center}
.cx-clip[aria-pressed="true"]{background:#C6F91F;color:#111}
.cx-pager{display:flex;justify-content:center;align-items:center;gap:18px;margin:36px 0 8px;font:800 14px/1 var(--en-nav)}
.cx-pg{width:44px;height:44px;border-radius:50%;border:0;background:#111;color:#fff;font-size:20px;cursor:pointer}.cx-pg:disabled{opacity:.25;cursor:default}
@media (max-width:1100px){.cx-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.cx-lay{grid-template-columns:minmax(0,1fr);gap:18px}.cx-side{position:static;max-height:none}.cx-fold>summary{cursor:pointer;margin:0;display:flex;justify-content:space-between}.cx-fold>summary::after{content:"＋"}.cx-fold[open]>summary{margin-bottom:14px}.cx-fold[open]>summary::after{content:"－"}.cx-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}}
/* 絞り込みの箱は作品ページと同じ黒（中の部品が黒地前提のため） */
.cx-side{background:#111;color:#fff}.cx-side .cx-gk,.cx-side .wx-rowhint{color:#a9a9a9}.cx-sec{border-top-color:#333}
.cx-side .wx-seg:not(.col){flex-wrap:nowrap}.cx-side .wx-seg:not(.col) button{flex:1;padding:8px 4px;font-size:12px}
.cx-side .wx-search{background:#222;border-radius:999px}
.wx-lb .lb-intent{white-space:pre-wrap;line-height:1.8;font-size:14px}

/* Creators: PC では画面の幅いっぱいに使う */
#cx > .wrap.cx-lay{max-width:none;padding-inline:clamp(20px,3vw,56px)}
.cx-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
@media (max-width:900px){.cx-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:901px) and (max-width:1100px){.cx-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}}

/* 拡大表示: ぼかした下敷き（小）→ 大きい画像がふわっと（2026-09-23） */
.wx-lb .lbst{position:relative}
.wx-lb .lbst img.lb-small{position:absolute;left:28px;top:28px;width:calc(100% - 56px);height:calc(100% - 56px);max-height:none;object-fit:contain;filter:blur(18px) brightness(.85);transform:scale(1.04);transition:opacity .5s ease}
.wx-lb .lbst.ready img.lb-small{opacity:0}
.wx-lb .lbst img.lb-big{position:relative;opacity:0;transition:opacity .45s cubic-bezier(.215,.61,.355,1)}
.wx-lb .lbst img.lb-big.ok{opacity:1}
.wx-lb .lb-page{display:inline-block;margin-top:18px;font-weight:800;font-size:13px;color:#fff;text-decoration:underline;text-underline-offset:4px}

/* hidden を display 指定より優先する（画像なのに「曲を聴く」が残っていた原因: .ext の display:inline-block が hidden に勝っていた。2026-09-23） */
.wx-lb [hidden]{display:none!important}

/* クリエイター一覧の左欄（2026-09-23 STΛCK「内側のスクロールは嫌。固定に。スマホはタグが多くて探しづらい」）
   PC: 固定（sticky）で内側スクロール無し。長い群（何に強いか・ツール）は閉じて出す。開いて画面より高くなったら固定を解く（JS）
   スマホ: 「条件で探す」を押すと下から引き出しが出る（画面の 84% まで、引き出しの中だけスクロール） */
.cx-side{max-height:none;overflow:visible}
.cx-side.unstick{position:static}
.cx-n{display:inline-block;margin-left:8px;min-width:20px;padding:2px 7px;border-radius:999px;background:#C6F91F;color:#0a0a0a;font:800 11px/1.4 var(--en-nav);text-align:center}
.cx-n[hidden]{display:none}
.cx-close,.cx-apply{display:none}
.wx-lb h2 a{color:inherit;text-decoration:none}.wx-lb h2 a:hover{text-decoration:underline;text-underline-offset:4px}
@media (max-width:900px){
  .cx-side{position:static;background:transparent;padding:0}
  .cx-fold>summary{display:flex;align-items:center;justify-content:space-between;background:#111;color:#fff;border-radius:999px;padding:12px 18px;font-size:14px;cursor:pointer;margin:0}
  .cx-fold>summary::after{content:"＋";font-weight:700}.cx-fold[open]>summary::after{content:"－"}
  .cx-fold[open]>.cx-body{position:fixed;left:0;right:0;bottom:0;z-index:40;max-height:84svh;overflow:auto;background:#111;color:#fff;border-radius:18px 18px 0 0;padding:52px 16px 0;box-shadow:0 -20px 60px rgba(0,0,0,.5)}
  .cx-fold[open]::before{content:"";position:fixed;inset:0;z-index:39;background:rgba(0,0,0,.55)}
  .cx-close{display:grid;place-items:center;position:absolute;right:14px;top:12px;width:36px;height:36px;border-radius:50%;border:0;background:#2a2a2a;color:#fff;font-size:18px;cursor:pointer}
  .cx-apply{display:flex;position:sticky;bottom:0;margin:22px -16px 0;width:calc(100% + 32px);justify-content:center;border-radius:0;padding:18px 18px calc(18px + env(safe-area-inset-bottom));font-size:15px}
  .cx-side .wx-chips{gap:6px;flex-wrap:wrap;overflow:visible;padding-bottom:0}.cx-side .wx-chip{font-size:13px;padding:9px 12px}
  .cx-side .wx-seg.col button{padding:12px 14px;font-size:14px}
}

/* 並び順（2026-09-23 STΛCK「後ろのエッジがおかしい丸になってる」）: 縦に並ぶ群は錠剤形でなく角丸の箱に */
.cx-side .wx-seg.col{background:#1a1a1a;border-radius:14px;padding:4px;gap:2px}
.cx-side .wx-seg.col button{border-radius:10px;padding:9px 12px}
/* 左欄 v2（2026-09-23 STΛCK「このスクロールは違和感で気持ち悪い。どこか固定するか、魅せ方を変える」）
   PC: ヘッダー直下から画面の下まで届く黒い柱として固定する（角丸なし・内側スクロールなし・フッターまで行っても動かない）。
   長い群（何に強いか・ツール）は柱の右に飛び出す小窓で開くので、柱の高さは変わらない。右側は柱の分だけ右へ寄せ、顔の格子は残りの幅いっぱいに並べる。
   画面が低い（660px 以下）ときだけ柱は固定せず、ページと一緒に流す */
@media (min-width:901px){
  .cx-side{padding:28px 24px 24px}
  .cx-fold>summary{pointer-events:none}  /* PC では見出し。押して畳めない（2026-09-24） */
  .cx-k{margin:16px 0 8px}
  .cx-sec{margin-top:14px;padding-top:12px;position:relative}
  .cx-check{margin-top:12px}
  .cx-pop{position:absolute;left:calc(100% + 24px);top:-15px;z-index:5;width:min(560px,calc(100vw - var(--cxw,300px) - 40px));background:#1a1a1a;color:#fff;border-radius:0 16px 16px 0;padding:18px 22px 22px;box-shadow:16px 0 48px rgba(0,0,0,.35)}
  .cx-pop::before{content:"";position:absolute;left:-24px;top:0;bottom:0;width:24px;background:#1a1a1a}
  .cx-pop .cx-gk:first-child{margin-top:0}
  .cx-pop .wx-chips{gap:6px}.cx-pop .wx-chip{font-size:12.5px;padding:7px 12px}
}
@media (min-width:901px) and (min-height:661px){
  body:has(#cx){--cxw:300px}
  #cx{padding-left:var(--cxw);padding-top:28px}
  #cx .wrap{max-width:none}
  body:has(#cx) > section,body:has(#cx) > footer{padding-left:var(--cxw)}  /* 見出し帯・JOIN の帯・フッターも柱の分だけ右へ */
  .cx-lay{grid-template-columns:minmax(0,1fr);gap:0}
  .cx-side{position:fixed;left:0;top:68px;bottom:0;width:var(--cxw);z-index:15;border-radius:0;overflow:visible}
  .cx-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
}
@media (min-width:901px) and (max-height:660px){.cx-side{position:static;max-height:none}}

/* アイコンが無い人の顔 = FunStack のロゴ（2026-09-23） */
.cx-face .cover-ini.logo{background:#0a0a0a}.cx-face .cover-ini.logo img{width:40%;height:auto;opacity:.9}  /* 2026-09-23 STΛCK「もう少し小さめに」58%→40% */

/* 拡大表示の前後ボタンは文字「‹ ›」でなく描いた矢印（2026-09-23 STΛCK「右の矢印ずれてる」= 文字幅の癖で中心から外れていた） */
.wx-lb .lbn svg{display:block}

/* resp2: タッチ操作の当たり判定。マウス端末の寸法は変えない。 */
@media (hover:none) and (pointer:coarse){
  .wx-chip,.wx-seg button,.wx-search button,.wx-more,.wx-clear,.wx-dot,
  .cx-clip,.cx-close,.cx-apply,.cx-pg,.cx-fold>summary,.cx-sec>summary,.cx-check,
  .wx-lb .lt button,.wx-lb .by,.wx-lb .ext,.wx-lb .lb-page{min-width:44px;min-height:44px}
  .wx-search input{min-height:44px}
  .wx-row>b:has(+.wx-chips),.wx-row>b:has(+.wx-dots){line-height:44px}
}

/* スマホ（2026-09-24 STΛCK） */
@media (max-width:900px){
  .cx-fold[open]>.cx-body{padding-top:64px}  /* × の段を確保（検索欄に被らない） */
  .cx-close{width:32px;height:32px;top:16px;right:16px;font-size:16px}
}
@media (max-width:640px){
  .wx.sec,.sec.wx,section.wx{padding-top:0}  /* 見出しと黒い絞り込みの間の灰色の帯を無くす */
  .wx-panel{margin-top:0}
}
/* 音声をその場で聴く（2026-09-24） */
.wx-lb .lbst img.lb-audio-cover{max-height:46dvh;position:static}
.wx-lb .lb-audio{width:min(100%,760px);margin-top:14px}
.wx-lb .lb-audio iframe,.cps-player iframe{display:block;width:100%;height:240px;border:0;border-radius:12px;background:#111}
.wx-lb .lb-audio audio,.cps-player audio{display:block;width:100%}
.lb-audio-wait{margin:0;font-size:12px;color:#aaa;text-align:center;padding:14px}
.lb-audio-out{display:inline-block;margin-top:8px;font-size:12px;font-weight:800;color:inherit;text-decoration:underline;text-underline-offset:4px}
.wx-lb .lbst{grid-auto-flow:row;align-content:center}

/* 拡大表示の下のリンクは 1 行ずつ（2026-09-24 STΛCK「ここ改行して」） */
.wx-lb .ext,.wx-lb .lb-page{display:block;width:fit-content}
.wx-lb .ext+.lb-page{margin-top:10px}
/* 個人ページで作品 0 の時は空のグリッドを出さない */
.cpx .wgrid:empty{display:none}
@media (max-width:900px){.cx-fold>summary{margin-top:18px}}  /* 「条件で探す」の上に余白（2026-09-24 STΛCK「詰まってる」） */

/* スマホの拡大表示（音声）: 大きいジャケットとプレイヤーが同じ枠に重なっていた → 縦に並べ、ジャケットはプレイヤーの中のもので足りるので隠す（2026-09-24 STΛCK） */
@media (max-width:900px){
  .wx-lb .lbst:has(.lb-audio){display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:10px;padding:56px 12px 12px}
  .wx-lb .lbst .lb-audio-cover{display:none}
  .wx-lb .lb-audio{width:100%;margin-top:0}
  .wx-lb .lb-audio iframe{height:200px}
}

/* 複数ページ作品: カードの枚数と、拡大表示内のページ/作品の移動を区別する。 */
.wcard2 .kb-pages{width:auto;min-width:36px;height:30px;padding:0 7px;border-radius:7px;display:flex;align-items:center;justify-content:center;gap:3px;font:800 12px/1 var(--en-nav)}
.wcard2 .kb-pages svg{display:block;flex:none}
.wx-lb .lb-pn{margin:16px 0 0;color:#eee;font:800 14px/1.4 var(--en-nav);letter-spacing:.08em}
.wx-lb .lb-worknav{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px;max-width:100%}
.wx-lb .lb-wnav{min-width:44px;min-height:44px;flex:1 1 120px;border:1px solid #555;border-radius:8px;padding:10px 12px;background:#202020;color:#fff;font:700 13px/1.4 var(--jp);cursor:pointer}
.wx-lb .lb-wnav:hover{border-color:var(--lime);color:var(--lime)}
.wx-lb .lb-wnav:focus-visible,.wx-lb .lbn:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
.wx-lb .lbn:disabled,.wx-lb .lbn:disabled:hover{opacity:.32;background:rgba(255,255,255,.1);color:#fff;cursor:default}
.wx-lb .lbst{touch-action:pan-y}
.wx-lb .lb-err{margin:0;text-align:center;color:var(--white);opacity:.6;font:700 14px/1.5 var(--jp)}
@media (max-width:900px){.wx-lb .lb-worknav{margin-top:16px}.wx-lb .lb-wnav{flex-basis:calc(50% - 4px)}}