@charset "UTF-8";



/* ── 恥ずいんで閲覧禁止でお願いしゃす！ ── */



/* ───────── 文字 ───────── */
@import url('https://fonts.googleapis.com/css2?family=Zen+Kurenaido&display=swap');

/* 伏字 */
@font-face {
  font-family: 'ink';
  src: url("https://dl.dropboxusercontent.com/scl/fi/lbke04ahf2dhmrrqy7hpe/trg_gutya.woff?rlkey=r7qtlbc7jdj1yeilmxnebxpgi&st=qx6glctw&dl=0") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* ───────── 吹き出し ───────── */
.hako {
  position: relative;

  /* 白寄せしつつ、透過は少しだけ */
background-color: rgba(230, 228, 220, 0.85);

  /* チェック線を少し濃くする */
  background-image:
    repeating-linear-gradient(
      0deg,
      rgba(40, 40, 40, 0.35),   /* ← 黒の濃度を0.35に */
      rgba(40, 40, 40, 0.35) 10px,
      transparent 10px,
      transparent 20px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(40, 40, 40, 0.35),
      rgba(40, 40, 40, 0.35) 10px,
      transparent 10px,
      transparent 20px
    );

  /* blendは normal で自然に */
  background-blend-mode: normal;

  padding: 10px 10px;
  border-radius: 0;
  width: 100%;
  max-width: 270px;
  margin: 10px auto;

  color: #8f2a24 !important;
  font-size: 9.5px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.1em;

  max-height: 150px;
  overflow-y: auto;
  overflow-x: hidden;

  border: none;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);

  scrollbar-width: thin;
  scrollbar-color: #a42f28 rgba(0, 0, 0, 0.05);

  filter: none !important;
  z-index: 0;
}

/* ───────── 吹き出し本体 ───────── */
.kzh_r,
.kzh_l,
.trg_r,
.trg_l {
  position: relative;
  display: inline-block;

  max-width: 80%;
  padding: 6px 8px 6px 10px;
  margin: 6px 0;

font-size: 9px;
  line-height: 1.4;
  word-break: break-word;

  border-radius: 16px;
  color: #1C1A1F !important;
}

.trg_r,
.trg_l {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* 配置 */
.kzh_r,
.trg_r { float: right; clear: both; }
.kzh_l,
.trg_l { float: left;  clear: both; }

/* 背景色 */
.kzh_r,
.kzh_l { background: #ACA7BB; }

.trg_r,
.trg_l { background: #d3381c; }

/* ───────── ちょろり ───────── */
.kzh_r::after,
.kzh_l::after,
.trg_r::after,
.trg_l::after {
  content: "";
  position: absolute;

  width: 14px;
  height: 14px;
  bottom: 0;

  /* 形は共通 */
  border-radius: 0 0 14px 0 / 0 0 10px 0;
}

/* 左：そのまま */
.kzh_l::after {
  left: -5px;
  box-shadow: -11px 2px 0 -3px #ACA7BB inset;
}

.trg_l::after {
  left: -5px;
  box-shadow: -11px 2px 0 -3px #d3381c inset;
}

/* 右：鏡写し */
.kzh_r::after {
  right: -5px;
  transform: scaleX(-1);
  box-shadow: -11px 2px 0 -3px #ACA7BB inset;
}

.trg_r::after {
  right: -5px;
  transform: scaleX(-1);
  box-shadow: -11px 2px 0 -3px #d3381c inset;
}

/* ── 吹き出し視認性アップ（強制） ── */
.kzh_r,
.kzh_l,
.trg_r,
.trg_l {
  position: relative;
}

.kzh_r::before,
.kzh_l::before,
.trg_r::before,
.trg_l::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 18px;
  z-index: -1;

  /* 背景半透明 + 影 */
  background: rgba(0,0,0,0.2);
  box-shadow: 0 2px 6px rgba(0,0,0,0.25);
}

/* ───────── ブロック ───────── */
.ublock {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/* ───────── lmフォント ───────── */
@font-face {
  font-family: 'lm';
  src: url("https://dl.dropboxusercontent.com/scl/fi/6n0pcjv89ax9eljcluyau/crowns.woff?rlkey=ithvla4t57truf8bz8an8y9ay&st=4n4kwcdf&dl=0")
 format("woff");
  font-display: swap;
}

/* ───────── kgr フォント読み込み ───────── */
@font-face {
  font-family: 'kgr';
  src: url("https://dl.dropboxusercontent.com/scl/fi/420z7f34dmezys1pnvua9/Entypo.woff?rlkey=nc8zm0a321ya7wo06sd1y458d&st=asff6q8w&dl=0") format("woff");
  font-display: swap;
}

/* ───────── 区切り ───────── */
.kgr {
  display: block;                  /* ブロックで中央表示 */
  width: fit-content;              /* 幅は文字に合わせる */
  margin: 6px auto;               /* 上下余白＋左右中央 */

  font-family: 'kgr', sans-serif !important;
  font-size: 35px !important;
  font-weight: 100 !important;     /* 極細 */

  color: #df0139 !important;
  opacity: 0.8 !important;

  letter-spacing: 6px !important;
  user-select: none !important;
  text-align: center;              /* 念のため中央揃え */
}

/* ───────── ピンフォント ───────── */
@font-face {
  font-family: 'pin';
  src: url("https://dl.dropboxusercontent.com/scl/fi/25lhp4rlzna3svcibu4qx/Map-Symbols.woff?rlkey=suxft8ob7meb1oap30aodlf5q&st=ycncy0zh&dl=0") format("woff");
  font-display: swap;
}

.pin {
  font-family: 'pin', serif !important;
  font-size: 13px !important;
  color: #000000;
  display: block;
  text-align: left;
  margin-bottom: 0.5px;
}

/* ───────── lm ───────── */
.lm {
  display: block;
  width: fit-content;
  margin: 0 auto 2px;
  font-family: 'lm', serif !important;
  font-size: 60px !important;
  color: #282827 !important;
  position: relative;

  filter: blur(0px);
  /* 既存そのまま */
  transform: rotate(0deg);
}

/* 背景 lm */
.lm-bg {
  position: absolute;
  inset: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  font-family: 'lm', serif !important;
  font-size: 60px !important;
  color: #282827 !important;

  filter: blur(0px);
  transform: rotate(0deg);

  pointer-events: none; /* 操作を邪魔しない */
  z-index: 0;
}

/* 箱の中身 */
.content {
  position: relative;
  z-index: 1;
  filter: blur(1px);
}

.lose-char {
  color: #ff0033 !important;
  -webkit-text-fill-color: #ff0033 !important;

  /* 輪郭側にだけ赤を広げる */
  -webkit-text-stroke: 0.12px rgba(255, 0, 51, 0.6);
}


/* ───────── 英字 ───────── */
@font-face {
  font-family: 'eig';
  src: url("https://dl.dropboxusercontent.com/scl/fi/en8rx2ymfoh7rb12ed9tr/Guniper.woff?rlkey=n1olzqhmjrwzabl8qa7rmavgr&st=xuquxocx&dl=0") format("woff");
  font-display: swap;
}

.eig3 {
  font-family: 'eig', serif !important;
  font-size: 10px !important;

  color:#737372 !important;
  -webkit-text-fill-color: #737372;

  display: inline-block;
  font-weight: 700;
  line-height: -1;

  text-align: left;
  margin: 0px 0 5px;

}

.eig2 {
  font-family: 'eig', serif !important;
  font-size: 16px !important;

  color: #737372 !important;
  -webkit-text-fill-color: #737372;
  font-weight: 700;

  display: inline-block;
  line-height: 1.3;
  text-align: left;
  margin: 8px 0 5px;

  position: relative;
}

.eig2::after {
  content: "";
  position: absolute;
  left: -0.25em;        /* ← 文字より少しはみ出させる */
  right: -1.65em;       /* ← 長めに見せるポイント */
  bottom: -0.08em;      /* ← 文字との距離（微調整） */

  height: 0.5px;        /* 極細 */
  background-color: currentColor;
  opacity: 0.8;         /* ほんのり弱めたい場合 */
}

/* ───────── 全体共通 ───────── */
* {
  margin: 0;
  padding: 0;
  border: none !important;
font-family: 'Zen Kurenaido', serif;
  font-weight: 350;
  font-size: 10px;
  box-sizing: border-box;
  color: #737372 !important;
  line-height: 1.2;
  letter-spacing: 0.08em;
}

a {
  text-decoration: none;
  color: #737372 !important;
}

/* ───────── 背景 ───────── */
html, body {
  height: 100%;
  min-height: 100%;
  margin: 0;
  padding: 0;
  padding-bottom: env(safe-area-inset-bottom);

  background-color: #F2F1ED;

  /* 念のため全レイヤー無効化 */
  background-image: none;
  background-repeat: no-repeat;
  background-size: auto;
  background-attachment: scroll;
}

/* ───────── 単一ボックス（kzh / trg / htr 共通） ───────── */
.kzh,
.trg,
.htr {
  /* 上下を削って、左右はそのまま */
  margin: 24px 24px;
  padding: 30px 25px;

  position: relative;
  background: transparent;

  border: none;
  box-shadow: none;
  border-radius: 0;

  font-size: 10px;
  line-height: 1.9em;
  letter-spacing: 0.03em;

  /* ← 確実に勝たせる */
  color: #282827 !important;
}

.trg {
  background-image: linear-gradient(
    to bottom,
    transparent calc(100% - 0.5px),
    rgba(184, 183, 179, 0.6) calc(100% - 0.5px)
  );

  /* line-height と完全一致 */
  background-size: 100% 1.9em;

  background-repeat: repeat-y;
  background-origin: content-box;
  background-clip: content-box;
}

/* details内では下線を消す */
details .trg {
  background-image: none !important;
}


/* 本文 */
.kzh p,
.trg p,
.htr p {
  margin: 0;
  padding: 0;

  /* ← ここも確実に */
  color: #282827 !important;
}

/* ───────── mk：文字背景ハイライト ───────── */

/* 共通 */
.kzhmk,
.trgmk {
  display: inline;
  padding: 0.08em 0 0.04em;
  margin: 0;

  line-height: 1;
  vertical-align: baseline;

  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;

  color: #282827 !important;
}

/* グレー系 */
.kzhmk {
  background:
    linear-gradient(
      to top,
      rgba(172, 167, 187, 0.55) 0%,
      rgba(172, 167, 187, 0.55) 25%,
      transparent 45%,
      transparent 100%
    );
}

/* 赤系 */
.trgmk {
  background:
    linear-gradient(
      to top,
      rgba(211, 56, 28, 0.55) 0%,
      rgba(211, 56, 28, 0.55) 25%,
      transparent 45%,
      transparent 100%
    );
}

/* ───────── 折り畳み ───────── */
summary {
  display: block;
  cursor: pointer;
  position: relative;
  list-style: none;
}

/* summary内の「アイコン以外の本文」を確実に指定 */
summary,
summary * {
  color: #282827 !important;
}

summary::-webkit-details-marker {
  display: none;
}

/* ───────── 折り畳みアイコン ───────── */
summary::before {
  font-family: 'pin';
  content: 'E';
  font-size: 17px;
  font-weight: 700;

  /* 閉じている時：深い深紅 */
  color: #c81f3a;
  opacity: 0.8;

  display: inline-block;

  transition:
    color 0.5s ease,
    transform 0.5s ease;
}

/* 開いた時 */
details[open] summary::before {
  /* 中身（背景と同色） */
  color: #d9002a;
  -webkit-text-fill-color: #d9002a;

  /* 縁だけ赤 */
  -webkit-text-stroke: 0.01px #d9002a;

  /* ネオン完全排除 */
  text-shadow: none;
  filter: none;
  opacity: 1;
}

/* ───────── 折り畳まれる本文 ───────── */
.details-body {
  font-size: 10px;
  line-height: 1.9em;
  letter-spacing: 0.08em;
  color: #282827 !important;

  margin: 0;
  padding: 0;
}

/* 開いた瞬間のアニメーション */
details[open] .details-body {
  animation: slideDownSlow 1.6s cubic-bezier(.16,1,.3,1) both;
}

@keyframes slideDownSlow {
  0% {
    opacity: 0;
    transform: translateY(-20px);
    filter: blur(3px);
  }
  60% {
    opacity: 1;
    transform: translateY(6px);
    filter: blur(1px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

/* ───────── 音楽 ───────── */
.nwpl{
  background:rgba(179, 58, 42, 0.9);
  overflow:hidden;
  white-space:nowrap;
  padding:3px 14px;
  width:15%;
  border-radius:8px;
  margin:0 auto;
  transition:width 0.4s ease;
  position:relative;
}

/* ♩バッジ */
.nwpl::before{
  content:"♩";
  position:absolute;
  left:-14px;
  top:50%;
  transform:translateY(-50%);
  font-size:10px;
  color:#737372;
  background:#F2F1ED;
  border-radius:50%;
  width:14px;
  height:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
}

/* タップ後 */
.nwpl:focus{
  width:68%;
}

.nw{
  display:inline-block;
  font-size:10px;
  color:#F2F1ED !important;
  padding-left:100%;
  animation:nwflow 20s linear infinite;
}

@keyframes nwflow{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-100%); }
}