/* ===== 押した反応（玄関・会議など静的ページ共通）=====
   正本はこのファイル1つ。index.html と meetings/index.html が同じものを読む
   （2026-08-25 に index.html の直書きから移した＝2ページに同じCSSを持たせない）。

   🚨 2026-08-25 t.j. iPhone 実機「タイルを押しても、ぐるぐるマークが出ない」。
      押した反応は 2026-08-23 から入っていたが、タイルの遷移は**文書ごと入れ替わる**ので、
      押した直後にページが凍ると 100ms/500ms 後に出す物は1フレームも描かれない。
      → busy.js 側で「出す物を全部その場で出し、1フレーム描かせてから飛ぶ」形に変えた。
      合わせて t.j.「ぐるぐるをもっと分かりやすく大きく」＝各部を一回り大きくした。 */
@keyframes itk-spin { to { transform: rotate(360deg) } }
@keyframes itk-bar { 0% { transform: translateX(-100%) } 100% { transform: translateX(160%) } }

.itk-bar{position:fixed;top:0;left:0;right:0;height:4px;z-index:9999;overflow:hidden;
  pointer-events:none;opacity:0;transition:opacity .15s ease;
  background:color-mix(in oklab, var(--primary) 16%, transparent)}
html[data-itk-busy] .itk-bar{opacity:1}
.itk-bar>span{display:block;height:100%;width:45%;border-radius:0 4px 4px 0;
  background:var(--primary);animation:itk-bar 1.1s cubic-bezier(.45,0,.25,1) infinite}

.itk-pill{position:fixed;top:16px;left:0;right:0;margin:0 auto;width:max-content;
  max-width:calc(100vw - 32px);z-index:9999;pointer-events:none;
  display:flex;align-items:center;gap:10px;padding:10px 19px 10px 16px;border-radius:999px;
  background:var(--card);color:var(--fg);border:1px solid var(--border);
  box-shadow:0 8px 24px rgb(0 0 0 / .18);font-size:15px;font-weight:700;line-height:1;
  opacity:0;transform:translateY(-8px);transition:opacity .18s ease,transform .18s ease}
html[data-itk-busy="full"] .itk-pill{opacity:1;transform:none}
.itk-pill::before{content:"";width:19px;height:19px;border-radius:50%;flex:0 0 auto;
  border:2.5px solid currentColor;border-right-color:transparent;
  animation:itk-spin .7s linear infinite}

/* 押されたタイル：矢印をくるくるに差し替え、押し直しを受け付けない */
a[data-busy="true"]{pointer-events:none}
a.tile[data-busy="true"]{border-color:var(--primary);
  background:color-mix(in oklab, var(--primary) 8%, var(--card))}
a.tile[data-busy="true"] .arrow{font-size:0;position:relative;width:22px;height:22px}
a.tile[data-busy="true"] .arrow::after{content:"";position:absolute;inset:0;border-radius:50%;
  border:3px solid var(--primary);border-right-color:transparent;
  animation:itk-spin .7s linear infinite}
/* タイル以外のリンク（今日やることの「開く」・会議ページの戻り等）：末尾にくるくるを足す */
a[data-busy="true"]:not(.tile){opacity:.6}
a[data-busy="true"]:not(.tile)::after{content:"";display:inline-block;width:1.1em;height:1.1em;
  margin-left:.45em;vertical-align:-.2em;border:2.5px solid currentColor;
  border-right-color:transparent;border-radius:50%;animation:itk-spin .7s linear infinite}

/* 指で触った瞬間の反応（マウスの無い端末だけ） */
@media (hover:none){ a:active, button:active { opacity:.6 } }
@media (prefers-reduced-motion: reduce){
  .itk-bar>span{animation-duration:2.6s}
  .itk-pill::before{animation-duration:1.8s}
}