/* ── あいことば（src/aikotoba.js）：村の メニューの「あいことば」・タイトルの「あいことばで もどす」 ─────────
   氷墨の 面（.panel / .card / .btn）の 上に 置く。タイトル（z 90）・デモの 一覧（95）より 上。
   ことばの 札は 白い 大きな 字（書きとめやすい ように）・番号は 左上。字の 色は SPEC の 変数だけ（4.5:1 いじょう）。 */
#akPanel{z-index:96}
#akPanel.hidden{display:none}
#akBody{display:flex;flex-direction:column;gap:10px}
#akBody .btn{width:100%;flex:0 0 auto}
.akLead{font-size:13.5px;font-weight:500;line-height:1.75;color:var(--ui-text);text-align:center;word-break:keep-all;overflow-wrap:anywhere}
.akHead{display:flex;align-items:center;gap:10px;margin-top:4px;font-size:12px;font-weight:700;color:var(--ui-sub);letter-spacing:.12em;word-break:keep-all;overflow-wrap:anywhere}
.akHead::before,.akHead::after{content:'';flex:1 1 auto;height:1px;background:var(--ui-line)}
/* ことばの 札（2×2・ならびの 番号つき）。字は えらんで 写せる */
.akWords{display:grid;grid-template-columns:1fr 1fr;gap:8px;-webkit-user-select:text;user-select:text}
.akW{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;min-height:66px;padding:12px 8px 8px;border-radius:14px;
  background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.26);animation:akTile .38s var(--e-in) both}
.akW:nth-child(2){animation-delay:.05s} .akW:nth-child(3){animation-delay:.1s} .akW:nth-child(4){animation-delay:.15s}
@keyframes akTile{0%{opacity:0;transform:translateY(8px) scale(.96)}100%{opacity:1;transform:none}}
.akW i{position:absolute;left:9px;top:6px;font-style:normal;font-family:var(--font-num);font-weight:700;font-size:12px;line-height:1;color:var(--ui-sub)}
.akW b{font-family:var(--font);font-weight:900;font-size:clamp(19px,6.4vw,26px);line-height:1.25;letter-spacing:.04em;color:#fff;white-space:nowrap}
.akWords.sm .akW{min-height:50px;padding:10px 6px 6px}
.akWords.sm .akW b{font-size:clamp(16px,5vw,20px)}
.akNote{font-size:13px;font-weight:700;line-height:1.6;color:var(--t-gold);text-align:center;word-break:keep-all;overflow-wrap:anywhere}
.akMeta{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 14px;font-size:12px;font-weight:700;color:var(--ui-sub);font-variant-numeric:tabular-nums;word-break:keep-all}
/* 入れる 欄（2行の textarea・ことば 4つが 1行に 入らない ので 折りかえして 全部 見せる。iPhone は 16px より 小さいと ひろがる ので 18px） */
.akIn{display:block;width:100%;min-height:80px;padding:12px 14px;border:0;outline:0;border-radius:14px;line-height:1.5;resize:none;overflow:hidden;
  background:rgba(255,255,255,.09);box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);color:#fff;caret-color:var(--c-buff);
  font-family:var(--font);font-weight:700;font-size:18px;letter-spacing:.04em;-webkit-user-select:text;user-select:text;-webkit-appearance:none;appearance:none}
.akIn::placeholder{color:var(--ui-sub);opacity:1;font-weight:500}
.akIn:focus{box-shadow:inset 0 0 0 2px var(--c-buff)}
.akHint{font-size:12px;font-weight:500;line-height:1.6;color:var(--ui-sub);text-align:center;word-break:keep-all;overflow-wrap:anywhere}
/* みつかった データの 要約（いま この スマホの データは 下に 小さく） */
.akSum{display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px 14px;align-items:baseline;padding:12px 14px;border-radius:14px;
  background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
.akSum dt{font-size:12px;font-weight:700;color:var(--ui-sub);white-space:nowrap}
.akSum dd{font-size:14.5px;font-weight:700;color:var(--ui-text);text-align:right;font-variant-numeric:tabular-nums;word-break:keep-all;overflow-wrap:anywhere}
.akSum.now{padding:9px 14px;background:rgba(255,255,255,.03);box-shadow:inset 0 0 0 1px var(--ui-line)}
.akSum.now dd{font-size:13px;color:var(--ui-sub)}
.akWarn{font-size:13px;font-weight:700;line-height:1.65;color:var(--t-atk);text-align:center;word-break:keep-all;overflow-wrap:anywhere}
.akMsg{font-size:13px;font-weight:700;line-height:1.6;color:var(--ui-text);text-align:center;word-break:keep-all;overflow-wrap:anywhere}
.akMsg:empty{display:none}
.akMsg.err{color:var(--t-atk)}
.akMsg.ok{color:var(--t-heal)}
/* 下の 帯：長い ボタンは たてに 1つずつ（2つ ならべると 字が 切れる） */
#akBtns.akCol{flex-direction:column}
#akBtns.akCol .btn{flex:0 0 auto;width:100%}
@media (prefers-reduced-motion:reduce){ .akW{animation:none} }
