/* よくあるSNSの3列：左メニュー／真ん中タイムライン／右の案内。スマホでは真ん中だけ＋下のメニュー */
:root{
  --bg:#fcfbff; --surface:#f4f1fb; --hover:#f1ecfa; --ink:#1c1626; --muted:#6e6680; --line:#e7e2f0;
  --accent:#6b3fd4; --accent-ink:#ffffff; --accent-soft:#efe8ff;
  --like:#d6336c; --like-soft:#fde8f0; --danger:#c62a2a; --warn:#9a5b00; --chip:#efeaf7;
  /* X と同じく、その端末の標準の文字（iPhone・Mac はヒラギノ、Windows は Segoe UI とメイリオ、Android は Roboto）を使う */
  --f-body:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Hiragino Sans","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  --f-display:var(--f-body);
  --f-mono:var(--f-body);
  --f-logo:"Reggae One",var(--f-body);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root{
  --bg:#0f0c14; --surface:#1a1622; --hover:#1d1826; --ink:#ece7f5; --muted:#9d94ad; --line:#2a2433;
  --accent:#a98bff; --accent-ink:#160d2b; --accent-soft:#251c3a;
  --like:#ff6f9d; --like-soft:#3a1a29; --danger:#ff8a80; --warn:#f2b552; --chip:#221c2c; color-scheme:dark}}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg)}
body{color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.6}
[hidden]{display:none!important}
a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
svg{width:24px;height:24px;flex:none}

.shell{display:grid;grid-template-columns:240px minmax(0,600px) 320px;justify-content:center;min-height:100vh;
  padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}

/* 左メニュー */
.side{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:6px;padding:12px 16px 20px 8px}
.logo{font-family:var(--f-logo);font-size:26px;line-height:1;color:var(--accent);text-decoration:none;padding:12px}
.menu{display:flex;flex-direction:column;gap:2px;margin-top:4px}
.menu a{display:flex;align-items:center;gap:16px;padding:12px;border-radius:999px;color:var(--ink);text-decoration:none;font-size:19px}
.menu a:hover{background:var(--hover)}
.menu a[aria-current="page"]{font-weight:700}
.menu a[aria-current="page"] svg{stroke-width:2.6}
.big{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;padding:14px;font-size:17px}

/* 真ん中 */
.col{border-left:1px solid var(--line);border-right:1px solid var(--line);min-width:0;padding-bottom:80px}
.colhead{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--bg) 85%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.colhead-row{display:flex;align-items:center;gap:12px;padding:calc(10px + env(safe-area-inset-top,0px)) 16px 4px}
.colhead h1{font-size:20px;font-weight:800;margin:0;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.small-logo{display:none;font-size:22px;padding:0}
.account{display:flex;gap:12px;align-items:center;font-size:13px}
.tabs{display:flex}
.tab{flex:1;text-align:center;padding:12px 0 0;font-weight:700;font-size:15px}
.tab.on::after{content:"";display:block;width:56px;height:4px;border-radius:2px;background:var(--accent);margin:10px auto 0}

.composer{display:flex;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line)}
.composer-body{flex:1;min-width:0;display:grid;gap:6px}
.who{font-size:13px;color:var(--muted)}
.composer textarea{border:0;background:transparent;font-size:19px;padding:4px 0;min-height:56px;resize:none}
.composer textarea:focus{outline:none}
.composer-foot{border-top:1px solid var(--line);padding-top:10px}
.avatar{width:40px;height:40px;border-radius:50%;flex:none;display:grid;place-items:center;font-weight:700;font-size:16px;color:#fff;background:var(--accent)}

textarea,input,select{width:100%;font:inherit;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.row input{flex:1;min-width:0;width:auto}
.count{font-family:var(--f-mono);font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums;margin-right:auto}
.count.over{color:var(--danger)}
button{font:inherit;cursor:pointer;border:0;border-radius:999px;padding:8px 18px;font-weight:700}
button:disabled{opacity:.45;cursor:not-allowed}
.primary{background:var(--accent);color:var(--accent-ink)}
.primary:hover:not(:disabled){filter:brightness(1.08)}
.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.danger{background:var(--danger);color:var(--bg)}
.link{background:none;padding:0;color:var(--accent);font-weight:700}
.link.u{text-decoration:underline;text-underline-offset:3px;color:var(--ink);font-weight:500}
.who-pick{border:0;padding:0;margin:0;display:grid;gap:6px}
.who-pick legend{padding:0;margin-bottom:4px}
.rep-area{display:grid;gap:10px}
.msg{font-size:13.5px;border-left:3px solid var(--danger);padding:6px 10px;background:var(--surface);border-radius:0 8px 8px 0}
.msg.ok{border-color:var(--accent)} .msg.care{border-color:var(--warn)}

/* 投稿 */
.post{padding:12px 16px;border-bottom:1px solid var(--line);cursor:pointer}
.post.post-big{cursor:default}
.post-row{display:flex;gap:12px}
.post:hover{background:var(--hover)}
.post .content{flex:1;min-width:0}
.post .meta{display:flex;gap:4px;align-items:baseline;font-size:14.5px;color:var(--muted);flex-wrap:wrap}
.post .name{color:var(--ink);font-weight:700}
.post .sub{font-family:var(--f-mono);font-size:13px}
.badge{display:inline-grid;place-items:center;width:16px;height:16px;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-size:10px;font-weight:700;align-self:center}
.post .body{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15.5px;margin-top:2px}
.post .acts{display:flex;justify-content:space-between;max-width:400px;margin-top:6px;margin-left:-8px}
.act{display:flex;align-items:center;gap:4px;background:transparent;color:var(--muted);padding:4px 8px;font-weight:500;font-size:13px}
.act svg{width:18px;height:18px}
/* 押した直後の送信中も、見た目とカーソルは変えない（二重押しだけ防ぐ） */
.act:disabled{opacity:1;cursor:pointer}
.act:hover{color:var(--accent);background:var(--accent-soft)}
.act.like:hover,.act.like.on{color:var(--like)}
.act.like:hover{background:var(--like-soft)}
.act.like.on svg path{fill:currentColor}
.act .n{font-family:var(--f-mono);font-variant-numeric:tabular-nums}

/* ルール・運営画面 */
.page{padding:0 16px 24px}
section h2{font-weight:800;font-size:20px;margin:24px 0 8px;text-wrap:balance}
section h3{font-size:15px;margin:16px 0 6px}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cols>div{min-width:0}
ul.list{margin:0;padding-left:1.2em} ol.steps{padding-left:1.4em;margin:0}
.yes h3{color:var(--accent)} .no h3{color:var(--danger)}
.queue{display:grid;gap:12px;margin-top:8px}
.ticket{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px;display:grid;gap:6px;min-width:0}
.ticket.urgent{border-left:4px solid var(--danger)}
.chip{display:inline-block;font-size:12px;font-weight:700;padding:1px 9px;border-radius:999px;background:var(--chip);color:var(--muted)}
.chip.urgent{background:var(--danger);color:var(--bg)}
.quote{border-left:3px solid var(--line);padding-left:10px;white-space:pre-wrap;overflow-wrap:anywhere}
.small{font-size:12.5px;color:var(--muted)}
.pad{padding:16px} .center{text-align:center}
.btns{display:flex;flex-wrap:wrap;gap:6px}
.btns button{padding:6px 12px;font-size:13px}
.tablewrap{overflow-x:auto;margin-top:8px}
table{border-collapse:collapse;width:100%;font-size:12.5px;font-family:var(--f-mono);font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
th{color:var(--muted);font-weight:500}

/* 右 */
.right{position:sticky;top:0;height:100vh;overflow:auto;padding:12px 16px 20px 24px;display:flex;flex-direction:column;gap:16px}
.card{background:var(--surface);border-radius:16px;padding:14px 16px;display:grid;gap:6px;justify-items:start}
.card h2{font-size:18px;margin:0}
.card p{margin:0}
.tag{font-weight:700}
footer{font-size:12.5px;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px 12px;padding:0 4px}
footer a{color:var(--muted)}

/* スマホの下のメニューと投稿ボタン */
.bottom{display:none}
.fab{display:none}

/* モーダル・お知らせ */
.scrim{position:fixed;inset:0;background:rgba(20,12,36,.55);display:grid;place-items:center;z-index:20;padding:16px}
.modal{background:var(--bg);color:var(--ink);border-radius:18px;max-width:460px;width:100%;padding:20px;display:grid;gap:10px;max-height:100%;overflow:auto}
.modal h2{font-weight:800;font-size:20px;margin:0}
label.f{display:grid;gap:4px;font-size:13.5px;font-weight:700}
.check{display:flex;gap:8px;align-items:flex-start;font-size:14px}
.check input{width:auto;margin-top:5px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(76px + env(safe-area-inset-bottom,0px));background:var(--accent);color:var(--accent-ink);padding:8px 16px;border-radius:999px;font-size:14px;z-index:30}

@media (max-width:1100px){
  .shell{grid-template-columns:88px minmax(0,600px)}
  .right{display:none}
  .menu a span,.big span{display:none}
  .menu a{justify-content:center}
  .logo{font-size:15px;padding:12px 0;text-align:center}
  .big{padding:14px 0}
}
@media (max-width:700px){
  .shell{display:block}
  .side{display:none}
  .col{border:0}
  .small-logo{display:block}
  .colhead h1{display:none}
  .account{margin-left:auto}
  .cols{grid-template-columns:1fr}
  .bottom{display:flex;position:fixed;inset:auto 0 0;z-index:10;background:var(--bg);border-top:1px solid var(--line);
    justify-content:space-around;padding:8px max(16px,env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
  .bottom a{color:var(--muted);padding:6px 20px}
  .bottom a[aria-current="page"]{color:var(--ink)}
  .fab{display:grid;place-items:center;position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(72px + env(safe-area-inset-bottom,0px));
    width:56px;height:56px;padding:0;z-index:11;box-shadow:0 4px 14px rgba(60,20,120,.35)}
  .post .acts{max-width:none}
}

/* 画像を選ぶ */
.icon-btn{background:transparent;color:var(--accent);padding:6px;border-radius:50%;display:grid;place-items:center}
.icon-btn:hover:not(:disabled){background:var(--accent-soft)}
.icon-btn svg{width:22px;height:22px}
.picked{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.thumb{position:relative;aspect-ratio:1;max-width:100%;border-radius:12px;overflow:hidden;background:var(--surface)}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb-x{position:absolute;top:4px;right:4px;width:26px;height:26px;padding:0;border-radius:50%;background:rgba(15,10,25,.75);color:#fff;font-size:16px;line-height:1}
/* 投稿の画像（1〜4枚） */
.media{display:grid;gap:2px;margin-top:10px;border-radius:16px;overflow:hidden;border:1px solid var(--line);max-width:100%}
.media.n1{grid-template-columns:1fr}
.media.n2{grid-template-columns:1fr 1fr;aspect-ratio:16/9}
.media.n3{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;aspect-ratio:16/9}
.media.n3 .media-item:first-child{grid-row:span 2}
.media.n4{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;aspect-ratio:16/9}
.media-item{padding:0;border-radius:0;background:var(--surface);min-height:0;overflow:hidden}
.media-item img{width:100%;height:100%;object-fit:cover;display:block}
.media.n1 .media-item img{max-height:510px;height:auto}
.modal.viewer{max-width:min(960px,100%);background:var(--bg);justify-items:center}
.modal.viewer img{max-width:100%;max-height:75vh;border-radius:12px}
/* プロフィール */
.plink{color:inherit;text-decoration:none}
.plink:hover .name{text-decoration:underline}
.prof-head{padding:16px;border-bottom:1px solid var(--line);display:grid;gap:4px}
.prof-top{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.avatar.big{width:96px;height:96px;font-size:40px}
.avatar.empty{background:var(--chip)!important;border:2px dashed var(--line)}
.prof-name{font-size:20px;font-weight:800;display:flex;align-items:center;gap:4px}
.prof-name.muted{color:var(--muted)}
.prof-head .sub{color:var(--muted);font-size:15px}
.prof-facts{display:flex;gap:16px;color:var(--muted);font-size:14px;margin-top:6px;flex-wrap:wrap}
.prof-note{color:var(--muted);margin:6px 0 10px}

/* 投稿の右上「…」・返信・リポスト */
.post-head{display:flex;align-items:flex-start;gap:8px}
.post-head .meta{flex:1;min-width:0}
.more{background:transparent;color:var(--muted);padding:4px;border-radius:50%;margin:-4px -6px 0 0;display:grid;place-items:center}
.more svg{width:18px;height:18px}
.more:hover{color:var(--accent);background:var(--accent-soft)}
.menu-pop{position:absolute;z-index:25;background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 28px rgba(40,20,80,.22);padding:6px 0;min-width:200px}
.menu-item{display:flex;align-items:center;gap:12px;width:100%;background:transparent;color:var(--ink);border-radius:0;padding:10px 16px;font-weight:700;text-align:left}
.menu-item svg{width:18px;height:18px}
.menu-item:hover{background:var(--hover)}
.danger-text{color:var(--danger)}
.repost-note{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--muted);margin:-4px 0 4px 32px}
.repost-note svg{width:16px;height:16px}
.repost-note a{color:inherit;text-decoration:none}
.reply-to{font-size:14px;color:var(--muted)}
.act.repost:hover,.act.repost.on{color:var(--accent)}
.post.post-big .body{font-size:18px}
.up-link{display:block;padding:10px 16px;font-size:14px;color:var(--accent);text-decoration:none;border-bottom:1px solid var(--line)}
.reply-bar{display:block;width:100%;text-align:left;background:transparent;color:var(--muted);font-weight:500;border-radius:0;padding:16px;border-bottom:1px solid var(--line);font-size:16px}
.reply-bar:hover{background:var(--hover)}
.reply-quote{border-left:3px solid var(--line);padding-left:10px;white-space:pre-wrap;overflow-wrap:anywhere}

/* 本文のリンクと動画の埋め込み */
.tlink{color:var(--accent);text-decoration:none;word-break:break-all}
.tlink:hover{text-decoration:underline}
.video{position:relative;margin-top:10px;border-radius:16px;overflow:hidden;border:1px solid var(--line);aspect-ratio:16/9;max-width:100%;background:#000}
.video.tall{aspect-ratio:9/16;max-width:min(325px,100%)}
.video iframe{width:100%;height:100%;border:0;display:block}
.video-play{position:absolute;inset:0;width:100%;height:100%;padding:0;border-radius:0;background:#111;display:grid;place-items:center}
.video-play img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.video-label{color:#fff;font-weight:800;font-size:20px}
.video-tri{position:relative;width:64px;height:64px;border-radius:50%;background:rgba(107,63,212,.92)}
.video-tri::after{content:"";position:absolute;left:26px;top:20px;border-left:18px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent}

/* reCAPTCHA の右下のマークは隠し、代わりに決まりの文を画面に出す（Google が認めている方法） */
.grecaptcha-badge{visibility:hidden}
.rc-note{font-size:11.5px;color:var(--muted);line-height:1.5}
.rc-note a{color:inherit}

/* 投稿の一時停止のお知らせ */
.notice{margin:12px 16px 0;padding:10px 14px;border-radius:12px;background:var(--like-soft);color:var(--ink);font-size:14px;font-weight:700;border-left:4px solid var(--danger)}

/* 登録していない人への控えめな案内（ヘッダーの下） */
.keep-note{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 16px 6px;padding:6px 10px;border-radius:10px;background:var(--accent-soft);color:var(--muted);font-size:12.5px}
.keep-note span{flex:1;min-width:0}
.keep-note .link.u{font-size:12.5px;color:var(--accent);font-weight:700}
.keep-x{background:transparent;color:var(--muted);padding:0 4px;font-size:16px;line-height:1}
/* アイコンの色選び */
.palette{display:grid;grid-template-columns:repeat(7,28px);gap:8px;flex:1;min-width:0}
.swatch{width:28px;height:28px;border-radius:50%;padding:0;border:2px solid transparent}
.swatch.on{border-color:var(--ink);box-shadow:0 0 0 2px var(--bg) inset}

/* 運営画面：運営アカウント */
.sk-recent{display:grid;gap:4px}
.sk-post{border-left:3px solid var(--line);padding-left:8px;overflow-wrap:anywhere}
#sakura textarea{min-height:56px}
#sakura details{font-size:13px}

/* 検索 */
.search-box{display:flex;align-items:center;gap:8px;margin:12px 16px 8px;padding:0 14px;border-radius:999px;background:var(--accent-soft);border:1px solid transparent}
.search-box:focus-within{border-color:var(--accent);background:transparent}
.search-box svg{width:18px;height:18px;color:var(--muted);flex:none}
.search-box input{flex:1;border:0;background:transparent;padding:10px 0;font-size:15px;outline:none;color:inherit;min-width:0}
.search-opts{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:0 16px 12px;border-bottom:1px solid var(--line)}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.seg button{background:transparent;color:var(--muted);padding:6px 12px;font-size:13px;font-weight:600;border-radius:0}
.seg button.on{background:var(--accent);color:var(--accent-ink)}
.search-opts select{padding:6px 10px;border-radius:999px;border:1px solid var(--line);background:transparent;color:inherit;font-size:13px}
.prof-bio{margin:10px 0 0;white-space:pre-wrap;word-break:break-word;line-height:1.5}
/* 拍手の連打 */
.act.like{touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.act.like.pop svg{animation:likepop .18s ease-out}
@keyframes likepop{0%{transform:scale(1)}50%{transform:scale(1.35)}100%{transform:scale(1)}}
/* ---------- 拍手：投稿のどこを押しても増える ---------- */
.post{position:relative;user-select:none;-webkit-user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.act.like{gap:6px;font-weight:700}
.act.like .clap{font-size:17px;line-height:1;display:inline-block;transform-origin:50% 80%;filter:grayscale(1);opacity:.55}
.act.like:not(.t0) .clap{filter:none;opacity:1}
.act.like .clap.go{animation:clap .32s ease-out}
@keyframes clap{0%{transform:scale(1) rotate(0)}20%{transform:scale(1.35) rotate(-14deg)}40%{transform:scale(.9) rotate(10deg)}60%{transform:scale(1.2) rotate(-8deg)}80%{transform:scale(.97) rotate(4deg)}100%{transform:scale(1) rotate(0)}}
/* 数の段階で色が変わる */
.act.like.t0 .n{color:var(--muted)}
.act.like.t1 .n{color:#8a63e8}
.act.like.t2 .n{color:#d6336c}
.act.like.t3 .n{color:#e8590c}
.act.like.t4 .n{color:#d4a017}
.act.like.t5 .n{color:#2f9e44}
.act.like.t6 .n{color:#1c7ed6}
.act.like.t7 .n{background:linear-gradient(90deg,#ff4d4d,#ffb84d,#ffe14d,#4dff88,#4dc3ff,#9a4dff,#ff4dc4);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:rainbow 2.4s linear infinite}
@keyframes rainbow{to{background-position:300% 0}}
.act.like:hover{background:transparent}
/* キラキラと +1 */
.clap-fx{position:absolute;width:0;height:0;pointer-events:none;z-index:5}
.clap-fx .spark{position:absolute;left:0;top:0;transform:translate(-50%,-50%);font-size:13px;animation:spark .65s ease-out forwards;color:#8a63e8}
.clap-fx.t2 .spark{color:#d6336c}.clap-fx.t3 .spark{color:#e8590c}.clap-fx.t4 .spark{color:#d4a017}.clap-fx.t5 .spark{color:#2f9e44}.clap-fx.t6 .spark{color:#1c7ed6}
.clap-fx.t7 .spark:nth-child(7n+1){color:#ff4d4d}.clap-fx.t7 .spark:nth-child(7n+2){color:#ffb84d}.clap-fx.t7 .spark:nth-child(7n+3){color:#e6c800}.clap-fx.t7 .spark:nth-child(7n+4){color:#2fbf5f}.clap-fx.t7 .spark:nth-child(7n+5){color:#4dc3ff}.clap-fx.t7 .spark:nth-child(7n+6){color:#9a4dff}.clap-fx.t7 .spark:nth-child(7n){color:#ff4dc4}
@keyframes spark{0%{opacity:1;transform:translate(-50%,-50%) scale(.4)}70%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(1.15) rotate(90deg)}}
.clap-fx .plus{position:absolute;left:0;top:0;transform:translate(-50%,-50%);font-weight:800;font-size:14px;color:var(--accent);animation:plus .75s ease-out forwards;white-space:nowrap}
@keyframes plus{0%{opacity:0;transform:translate(-50%,-30%) scale(.8)}20%{opacity:1}100%{opacity:0;transform:translate(-50%,-260%) scale(1.1)}}
@media (prefers-reduced-motion:reduce){.act.like .clap.go,.clap-fx .spark,.clap-fx .plus,.act.like.t7 .n{animation:none}.clap-fx{display:none}}
/* 拍手ボタンは右寄せ。キラキラと +1 はボタンの中の拍手マークから出す */
.post .acts{justify-content:flex-end}
.act.like{position:relative;overflow:visible}
.act.like .clap.go{animation:none}
.clap-fx .plus{animation:plus2 .7s ease-out forwards}
@keyframes plus2{0%{opacity:0;transform:translate(-50%,-40%) scale(.7)}15%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--px,0px)),-320%) scale(1.05)}}
/* 拍手はアイコンの下（縦に並べる） */
.post-left{display:flex;flex-direction:column;align-items:center;gap:2px;flex:none;width:40px}
.post-left .act.like{flex-direction:column;gap:0;padding:4px 0 2px;min-width:40px;justify-content:center;font-size:12px}
.post-left .act.like .clap{font-size:18px}
.post-left .act.like .n{font-size:12px;line-height:1.2;max-width:56px;white-space:nowrap}
.post.post-big .post-left{width:48px}
/* スマホのヘッダーを低く */
@media (max-width:700px){
  .colhead-row{padding:calc(6px + env(safe-area-inset-top,0px)) 12px 6px}
  .keep-note{margin:0 12px 6px;padding:4px 8px;font-size:12px}
  .post{padding:10px 12px}
}

/* ---------- 念仏：数珠を持った手。押すとすりすりして、お経の文字が上へ流れる ---------- */
.act.like .hands{position:relative;display:inline-block;font-size:19px;line-height:1;transform-origin:50% 90%}
.act.like .hands .palm{display:inline-block}
.act.like .hands .juzu{position:absolute;left:50%;top:58%;transform:translate(-50%,-50%) scale(.62);font-size:19px;pointer-events:none}
.act.like.t0 .hands{filter:grayscale(1);opacity:.6}
.clap-fx .sutra{position:absolute;left:0;top:0;transform:translate(-50%,-50%);font:700 15px/1 "Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif;color:var(--accent);animation:sutra 1.4s ease-out forwards;white-space:nowrap;text-shadow:0 0 6px var(--bg)}
.clap-fx .sutra.chain{color:#b07a00}
@keyframes sutra{0%{opacity:0;transform:translate(-50%,-30%)}12%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--sx,0px)),-90px)}}
/* 成仏した投稿：ほのかに金色に光る */
.post.jobutsu{box-shadow:inset 3px 0 0 #e0b84a;background:linear-gradient(90deg,rgba(224,184,74,.10),transparent 60%)}
.post{position:relative}
.jobutsu-fx{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:6}
.jobutsu-fx .rays{position:absolute;inset:-40%;background:conic-gradient(from 0deg,transparent 0 8%,rgba(255,215,110,.35) 10%,transparent 12% 20%,rgba(255,215,110,.35) 22%,transparent 24% 33%,rgba(255,215,110,.3) 35%,transparent 37% 46%,rgba(255,215,110,.35) 48%,transparent 50% 58%,rgba(255,215,110,.3) 60%,transparent 62% 71%,rgba(255,215,110,.35) 73%,transparent 75% 83%,rgba(255,215,110,.3) 85%,transparent 87%);animation:rays 2.4s ease-out forwards}
@keyframes rays{0%{opacity:0;transform:rotate(0) scale(.6)}25%{opacity:1}100%{opacity:0;transform:rotate(40deg) scale(1.2)}}
.jobutsu-fx .jobutsu-word{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font:800 34px/1 "Hiragino Mincho ProN","Yu Mincho","Noto Serif JP",serif;color:#c99400;text-shadow:0 0 12px #fff3c4,0 0 24px #ffe08a;animation:word 2.4s ease-out forwards}
@keyframes word{0%{opacity:0;transform:translate(-50%,-30%) scale(.8)}20%{opacity:1;transform:translate(-50%,-50%) scale(1.05)}70%{opacity:1}100%{opacity:0;transform:translate(-50%,-110%) scale(1)}}
.jobutsu-fx .mote{position:absolute;bottom:-10px;color:#e0b84a;font-size:12px;animation:mote 1.8s ease-out forwards;opacity:0}
@keyframes mote{0%{opacity:0;transform:translateY(0)}20%{opacity:1}100%{opacity:0;transform:translateY(-160px)}}
@media (prefers-reduced-motion:reduce){.clap-fx .sutra,.jobutsu-fx *{animation-duration:.01s}}
/* 右上の共有・通報 */
.post-head .more+.more{margin-left:2px}
.more.flag:hover{color:var(--danger);background:var(--like-soft)}
/* 通報の画面 */
.rep-pick{display:grid;gap:8px;margin:8px 0}
.rep-opt{padding:10px 12px;border:1px solid var(--line);border-radius:12px;cursor:pointer}
.rep-opt:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.rep-opt b{display:block}
.rep-opt .small{display:block;color:var(--muted)}
.linkish{background:none;border:0;padding:6px 0;color:var(--muted);text-decoration:underline;cursor:pointer;margin-top:6px}
/* 通知 */
.notice-item{display:flex;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);color:inherit;text-decoration:none}
.notice-item:hover{background:var(--chip)}
.notice-ic{font-size:22px;line-height:1}
.notice-q{color:var(--muted);margin-top:4px;overflow-wrap:anywhere}
a .dot{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--like);margin-left:-6px;margin-top:-10px}