/* ═══════════════════════════════════════════════════════════════════════════
   search-deck.css — 新・検索/アプリ一覧(SearchDeck)のスタイル(単一ソース)
   旧Spotlight(shadow DOM+391KBテンプレ)は全廃。右下の検索FABから開く
   ネイティブUI: ガラスの検索バー + 中央のアプリグリッド + 音楽/友達の結果。
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── オーバーレイ外殻(旧.search-ovのidを継承=既存コードの参照を壊さない) ── */
.search-ov{
  position: fixed;
  inset: 0;
  z-index: 9720;
  background: transparent;   /* ★色tint廃止=blurのみ・地球儀が透けて見える(ユーザ指示) */
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  opacity: 0;
  pointer-events: none;
  transform: scale(1.3);   /* ★閉じる時=1→1.3へscale-upしながら0.5sでフェードアウト(ユーザ指示) */
  transition: opacity .5s var(--gc-ease), transform .5s var(--gc-ease);   /* ★閉じる時=0.5s ease(ユーザ指示) */
}
.search-ov.show{
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
  z-index: 9850;
  transition: opacity .3s var(--gc-ease), transform .3s var(--gc-ease);   /* 開く時は速い(0.3s) */
}
.search-ov .search-host{ position:absolute; inset:0; }

/* ── デッキ本体: 上から12vh・全デバイスで水平中央 ── */
.sd-wrap{
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center;
  padding: max(7vh, calc(env(safe-area-inset-top,0px) + 44px)) max(16px, env(safe-area-inset-left,0px)) calc(env(safe-area-inset-bottom,0px) + 20px) max(16px, env(safe-area-inset-right,0px));   /* ★AE(ユーザ指示2026-07-21): 検索バーを今より上へ(12vh→7vh) */
  box-sizing: border-box;
}
.sd-col{ width: min(92vw, 560px); display:flex; flex-direction:column; min-height:0; }

/* 検索バー(ガラスピル) */
.sd-bar{
  display:flex; align-items:center; gap:9px;
  height: 52px; padding: 0 16px;
  border-radius: 26px;
  background: rgba(255,255,255,.14);
  -webkit-backdrop-filter: blur(28px) saturate(170%);
  backdrop-filter: blur(28px) saturate(170%);
  box-shadow: 0 14px 40px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.35), inset 0 0 0 .5px rgba(255,255,255,.22);
  flex: 0 0 auto;
}
.sd-bar .sd-mag{ width:20px; height:20px; opacity:.85; flex:0 0 auto; }
.sd-bar input{
  flex:1; min-width:0; height:100%;
  background:none; border:none; outline:none;
  font: 600 17px/1 -apple-system, BlinkMacSystemFont, "Hiragino Sans", sans-serif;
  color:#fff; caret-color:#7cc0ff;
}
.sd-bar input::placeholder{ color: rgba(255,255,255,.45); }
/* ★iOSの type=search が出す純正の✕を消す=独自の .sd-x と二重に出るバグの解消 */
.sd-bar input::-webkit-search-cancel-button,
.sd-bar input::-webkit-search-decoration,
.sd-bar input::-webkit-search-results-button{ -webkit-appearance:none; appearance:none; display:none; }
.sd-x{   /* ★SF Pro weight1・枠なし(背景丸を撤去)・+5px大きく・2px上へ(ユーザ指示2026-07-29) */
  flex:0 0 auto; width:33px; height:33px; border:none; border-radius:50%; padding:0;
  background:transparent; color:#fff;
  font:100 19px/1 -apple-system,'SF Pro Display','SF Pro Text',system-ui,sans-serif;
  transform:translateY(-2px);
  cursor:pointer; display:none; align-items:center; justify-content:center;
  -webkit-tap-highlight-color:transparent;
}
.sd-bar.has .sd-x{ display:flex; }

/* スクロール領域(グリッド/結果) */
.sd-scroll{ flex:1 1 auto; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; margin-top:18px; padding-bottom:calc(env(safe-area-inset-bottom,0px) + 76px); overscroll-behavior:contain; }   /* ★検索の下が見切れない=最下段(MBTI曲/appsの最終行)がホームインジケータに隠れないよう十分な余白 */
.sd-scroll::-webkit-scrollbar{ display:none; }

/* ── アプリ配列: Vision Pro風=円形アイコン・中央寄せの蜂の巣(短い行は中央=3 4 3の見え方) ── */
.sd-apps{
  display:flex; flex-wrap:wrap; justify-content:center; align-content:flex-start;
  gap:18px 10px;
  padding: 6px 4%;
}
.sd-app{
  display:flex; flex-direction:column; align-items:center; gap:7px;
  border:none; background:none; padding:0; cursor:pointer;
  flex:0 0 auto; width:calc(25% - 9px); max-width:86px;   /* ★4/行=短い行は中央寄せ(Vision Pro風の3 4 3の見え方) */
  -webkit-tap-highlight-color:transparent;
  opacity:0; transform:translateY(14px) scale(.92);
}
.search-ov.show .sd-app{ animation: sdAppIn .5s cubic-bezier(.16,1,.3,1) forwards; }
@keyframes sdAppIn{ to{ opacity:1; transform:none; } }
/* ★検索で1行になった時: 右から1個ずつ0.3sでスライドイン(JSがstagger delayを付与) */
@keyframes sdAppSlideX{ from{ opacity:0; transform:translateX(30px); } to{ opacity:1; transform:none; } }
.sd-app .ic{
  width:62px; height:62px; border-radius:55px; object-fit:cover;   /* ★Vision Pro風=円形アイコン(radius55px) */
  background:rgba(255,255,255,.1);
  box-shadow: 0 8px 22px rgba(0,0,0,.35), inset 0 0 0 .5px rgba(255,255,255,.18);
}
.sd-app img.ic[src*="camera"]{ box-shadow:none; background:none; }   /* ★カメラアイコンの枠(inset border/影)は廃止(ユーザ指示) */
.sd-app .nm{
  font: 500 11px/1.25 -apple-system, BlinkMacSystemFont, "Hiragino Sans", sans-serif;
  color:#fff; text-shadow:0 1px 6px rgba(0,0,0,.6); text-align:center;
  max-width:76px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
}
.sd-app:active .ic{ transform:scale(.9); transition:transform .12s; }
/* ★2本指ピンチ: 広げる=拡大モード(名前がフェードで消えアイコン大きめ・4/行のまま) / つまむ=元に戻る */
.sd-app{ transition:width .35s var(--gc-ease), max-width .35s var(--gc-ease); }
.sd-app .ic{ transition:width .35s var(--gc-ease), height .35s var(--gc-ease); }
.sd-app .nm{ transition:opacity .3s var(--gc-ease); }
.search-ov.sd-zoom:not(.sd-searching) .sd-app{ width:calc(25% - 9px); max-width:100px; }
.search-ov.sd-zoom:not(.sd-searching) .sd-app .ic{ width:74px; height:74px; }
.search-ov.sd-zoom:not(.sd-searching) .sd-app .nm{ opacity:0; height:0; margin:0; overflow:hidden; }
.sd-app.hide{ display:none; }
.sd-app.sd-gone{ display:none !important; }   /* gone()=完全非表示(ミュージック/翻訳の条件落ち) */
/* ── 友達: app一覧の下の「左右スワイプの1行」(ユーザ指示)。タイルはアプリと同じ・横スクロールで全員出る ── */
.sd-frs{
  display:flex; flex-wrap:nowrap; justify-content:flex-start; align-items:flex-start;
  gap:18px;
  width:100vw; margin-left:calc(50% - 50vw);   /* full-bleed=画面いっぱいで左右スワイプ */
  padding:14px max(16px,env(safe-area-inset-right)) 6px max(16px,env(safe-area-inset-left));
  overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch;
  touch-action:pan-x !important;   /* ★bodyのtouch-action:pan-yを上書き=指で左右スクロールできる */
  scroll-snap-type:none;
}
/* ★Phase3: 中央揃え(auto margin)は「あふれた時に先頭/末尾の友達がスクロールで端まで届かず見切れる」原因になる
   (flex+overflowでmargin-left/right:autoが余白を食い、最初/最後のタイルがスクロール外に隠れる)→撤去。
   justify-content:flex-start(上で指定済み)で左詰め＝左右スワイプで全員を端まで見れる(ユーザ指示: 左右の幅制限を消す)。 */
.sd-frs::-webkit-scrollbar{ display:none; }
.sd-frs:empty{ display:none; }   /* 中身が丸ごと空の時だけ行を出さない */
/* ★ユーザ指示2026-07-25: 「検索では友達がいなくても＋は出ること」。
   最初の画面(非検索)では友達タイルと｜区切りだけを隠し、＋(カメラ=QR読み取り/投稿)と案内は必ず出す。
   ＋しか無い時は中央に置く。 */
.search-ov:not(.sd-searching) .sd-frs{ justify-content:center; position:relative; }
/* ★＋を画面の左右中央にきっちり合わせる(ユーザ指示2026-07-28)。
   旧: 友達0人の時に「←友達のQR読み取って👀」の案内が同じ行の幅を食うので、
       justify-content:center が「＋と案内の2つ分」を中央に寄せ、＋自体は左へズレていた。
   → 非検索時は案内だけを絶対配置にして幅を食わせない = ＋がちょうど真ん中に来る。 */
.search-ov:not(.sd-searching) .sd-frs > .sd-frhint{
  position:absolute; left:50%; top:14px; margin-left:47px;   /* ＋(62px)の右隣・16pxあけ */
  max-width:calc(50% - 58px); overflow:hidden; text-overflow:ellipsis; pointer-events:none;
}
.search-ov:not(.sd-searching) .sd-frs > .sd-app[data-fr],
.search-ov:not(.sd-searching) .sd-frs > .sd-sep{ display:none !important; }
/* ★友達1行の左端=＋(カメラ=投稿)と | バー(常時・ユーザ指示) */
.sd-cam{ flex:0 0 auto; width:62px; height:62px; border:none; border-radius:55px; padding:0; cursor:pointer;
  background:rgba(255,255,255,.1); box-shadow:none;   /* ★＋(カメラ)のshadowは廃止(ユーザ指示2026-07-18) */
  display:flex; align-items:center; justify-content:center; -webkit-tap-highlight-color:transparent; }
.sd-cam .sd-cam-ic{ color:#fff; font:100 38px/1 -apple-system,'SF Pro Display',sans-serif; transform:translateY(-1px); }
.sd-cam:active{ transform:scale(.9); transition:transform .12s; }
/* ★検索中(1行)の＋: shadowなし・极細0.1pxのborderのみ(ユーザ指示2026-07-18) */
.search-ov.sd-searching .sd-cam{ box-shadow:none; background:none; border:.1px solid rgba(255,255,255,.55); }
.sd-sep{ flex:0 0 auto; width:2px; height:44px; margin-top:9px; border-radius:2px; background:rgba(255,255,255,.32); }
/* ★友達0人の案内: ＋の右に「←友達のQR読み取って👀」(枠なし・ユーザ指示2026-07-18) */
.sd-frhint{ flex:0 0 auto; display:flex; align-items:center; height:62px; color:rgba(255,255,255,.78);
  font:500 13.5px/1.3 -apple-system,'Hiragino Sans',sans-serif; text-shadow:0 1px 6px rgba(0,0,0,.55); white-space:nowrap; }
.sd-frs .sd-app{ flex:0 0 auto; width:62px !important; max-width:62px !important; }   /* ★1行=折り返さない(ピンチ拡大時も1行の寸法を維持) */
.sd-frs .sd-app .nm{ -webkit-line-clamp:1; max-width:62px; opacity:1 !important; height:auto !important; }
.sd-app{ -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
/* 編集モード(長押し)中: iOSホーム風ジグル・掴んだ元タイルは薄く */
/* ★編集中は全タイルを強制表示=出現アニメ(sdAppIn forwards)がジグルに置き換わってopacity:0へ戻る不具合の根治 */
.sd-apps.sd-editing .sd-app, .sd-frs.sd-editing .sd-app{ opacity:1; transform:none; }
.sd-apps.sd-editing .sd-app:not(.sd-ph), .sd-frs.sd-editing .sd-app:not(.sd-ph){ animation: none; }   /* ★長押し移動中のジグル(ブレ)を撤去=移動中はブレない(ユーザ指示) */
@keyframes sdJiggle{ from{ transform:rotate(-1.4deg); } to{ transform:rotate(1.4deg); } }
.sd-app.sd-ph, .sd-apps.sd-editing .sd-app.sd-ph, .sd-frs.sd-editing .sd-app.sd-ph{ opacity:0; animation:none !important; transition:opacity .5s var(--gc-ease); }   /* ★並び替えで掴んだタイルが消えるのは0.5s(編集中も) */
.sd-ghost .nm{ text-shadow:0 2px 10px rgba(0,0,0,.7); }
/* ★×バッジ(友達タイルの中央下・前面): 編集モードで0.3sで出る。押すと「振って削除」UIへ */
.sd-app{ position:relative; }
.sd-min{ position:absolute; left:50%; bottom:2px; z-index:6; width:31px; height:31px; border-radius:50%; border:none; padding:0;   /* ★×=少しデカく(26→31px)・さらに少し下(12→2px)=🚩と離して押しやすく(ユーザ指示2026-07-29) */
  background:#fff; color:#111; font:300 20px/1 -apple-system,'SF Pro Display',sans-serif;
  display:flex; align-items:center; justify-content:center; box-shadow:none;
  cursor:pointer; -webkit-tap-highlight-color:transparent; pointer-events:auto;
  opacity:0; transform:translateX(-50%) scale(.8); transition:opacity .5s ease, transform .5s ease; }   /* ★白丸(borderなし)+黒文字の×・出る=scale0.8→1/消える=1→0.8(0.5s ease) */
.sd-apps.sd-editing .sd-min, .sd-frs.sd-editing .sd-min{ opacity:1; transform:translateX(-50%) scale(1); }
.sd-min.sd-min-out{ opacity:0; transform:translateX(-50%) scale(.8); }
/* ★V(2026-08-01): 友達タイルの ×/🚩 を「•••」1つに集約。×の位置(下)・少し大きめ=押しやすい。•••→ 削除/ブロック/通報/シェア/非表示・再表示メニュー */
.sd-more{ width:36px; height:36px; font:700 15px/1 -apple-system,'SF Pro Display',sans-serif; letter-spacing:1.4px; padding-bottom:2px; }
/* ★T10-1 通報バッジ(🚩)=×の反対側(アイコン丸の上)。編集モードで×と一緒に出る。押すと「どんな内容で通報?」 */
.sd-flag{ position:absolute; left:50%; top:-8px; z-index:6; width:29px; height:29px; border-radius:50%; border:none; padding:0;   /* ★🚩=アイコンより上へ(2→-8px)=×(下)と離して押しやすく(ユーザ指示2026-07-29) */
  background:#fff; color:#111; font:400 15px/1 -apple-system,'SF Pro Display',sans-serif;
  display:flex; align-items:center; justify-content:center; box-shadow:none;
  cursor:pointer; -webkit-tap-highlight-color:transparent; pointer-events:auto;
  opacity:0; transform:translateX(-50%) scale(.8); transition:opacity .5s ease, transform .5s ease; }
.sd-apps.sd-editing .sd-flag, .sd-frs.sd-editing .sd-flag{ opacity:1; transform:translateX(-50%) scale(1); }
/* ★ドラッグ中の第2ドロップ先: 画面下の友達レール(＋/カメラ除く)。
   slideup/リフトは廃止=フェードのみ(トランジション重複と他要素との干渉を防ぐ・ユーザ指示)。かざすとユーザー色リングが0.3sで出る/離れると消える */
/* ★友達をドックに置くとき=下に「枠なり」で出る。出る=scaleup(0.3s)/消える=scaledown ease。dockより下・中央 */
/* ★友達一覧のバーがスライドアップ=枠なし(bg/border無し・ユーザ指示)。scaleupで出る・かざすとユーザー色リング */
#sdRailDrop{ position:fixed; left:50%; bottom:calc(env(safe-area-inset-bottom,0px) + 6px); z-index:9857; display:flex; gap:12px; align-items:center;
  max-width:94vw; overflow-x:auto; -webkit-overflow-scrolling:touch;
  padding:10px 16px;
  border-radius:22px; background:none; border:none;
  transform:translate(-50%,0) scale(.82); transform-origin:center bottom; opacity:0; pointer-events:none;
  transition:opacity .3s var(--gc-ease), transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s var(--gc-ease); }
#sdRailDrop.show{ opacity:1; transform:translate(-50%,0) scale(1); }   /* ★scaleupで出る */
#sdRailDrop.sd-rd-over{ box-shadow:0 0 0 3px var(--gc-user,#62d8ff), 0 0 22px var(--gc-user,#62d8ff); border-radius:26px; }
#sdRailDrop::-webkit-scrollbar{ display:none; }
.sd-rd-it{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; }
.sd-rd-av{ width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:20px; color:#fff; overflow:hidden; background-size:cover; background-position:center;
  box-shadow:0 0 0 2px rgba(255,255,255,.5); }

/* ── 結果リスト(友達/音楽): 枠なし・slideupで出る ── */
.sd-cat{
  font: 700 12px/1 -apple-system, BlinkMacSystemFont, sans-serif;
  color:rgba(255,255,255,.6); letter-spacing:.06em;
  margin: 14px 4px 8px;
}
.sd-rows{ display:flex; flex-direction:column; gap:4px; }
.sd-row{
  display:flex; align-items:center; gap:12px;
  padding: 8px 6px; border-radius:14px;
  background: none;   /* ★枠(カード)を廃止 */
  cursor:pointer; border:none; width:100%; text-align:left;
  -webkit-tap-highlight-color:transparent;
  opacity:0; transform:translateY(22px);
  transition: transform .5s cubic-bezier(.16,1,.3,1), opacity .5s, background .2s;
}
.sd-row.in{ opacity:1; transform:none; }
.sd-row:active{ background:rgba(255,255,255,.10); }
.sd-row .rart{
  width:44px; height:44px; border-radius:10px; flex:0 0 auto; object-fit:cover;
  background:rgba(255,255,255,.12);
  display:flex; align-items:center; justify-content:center; font-size:22px; color:#fff;
}
.sd-row .rmeta{ min-width:0; flex:1; display:flex; flex-direction:column; gap:2px; }
.sd-row .rt{ font:600 15px/1.25 -apple-system,BlinkMacSystemFont,"Hiragino Sans",sans-serif; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sd-row .rs{ font:400 12.5px/1.25 -apple-system,BlinkMacSystemFont,"Hiragino Sans",sans-serif; color:rgba(255,255,255,.62); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sd-row .sd-heart{
  flex:0 0 auto; width:34px; height:34px; border:none; border-radius:50%; background:none;
  color:rgba(255,255,255,.38); font-size:20px; line-height:1; padding:0; cursor:pointer;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",sans-serif; -webkit-tap-highlight-color:transparent;
  transition:transform .3s cubic-bezier(.16,1,.3,1), color .2s;
}
.sd-row .sd-heart.on{ color:#ff375f; transform:scale(1.12); }
.sd-empty{ text-align:center; color:rgba(255,255,255,.55); font:500 14px/1.6 -apple-system,BlinkMacSystemFont,sans-serif; padding:26px 0 8px; }
/* ★読込スピナー: 出る/消えるは0.3s=高さが伸縮してinput+appsが上下に動き、スピナー自身もscale/opacityでトランジション */
.sd-spin{ display:flex; justify-content:center; align-items:center; overflow:hidden;
  max-height:0; opacity:0; padding:0; transform:scale(.5);
  transition:max-height .3s var(--gc-ease), opacity .3s var(--gc-ease), padding .3s var(--gc-ease), transform .3s var(--gc-spring); }
.sd-spin.in{ max-height:76px; opacity:1; padding:18px 0; transform:scale(1); }   /* 34pxスピナー+上下padding36px+余白=見切れない */

/* ── 検索中: 結果はinputの上・input+appsは0.5sで下へ(文字を消すと0.5sで上に戻る) ── */
.sd-res{ max-height:0; opacity:0; overflow-y:auto; -webkit-overflow-scrolling:touch; width:100%;
  transition:max-height .5s var(--gc-ease), opacity .4s var(--gc-ease), margin-bottom .5s var(--gc-ease); }
/* ★検索中: app一覧(1行のドック)は検索結果より前(上)に出す(ユーザ指示)。順序=apps → バー → 結果 */
.search-ov.sd-searching .sd-scroll{ order:-2; flex:0 0 auto; }
/* ★検索バーの下にdockが入る余白を確保=検索バー(上)とも結果(下)とも干渉しない(ユーザ指示)。
   余白はdockの実高さ+上下18pxずつをJS(_dockPlace)が --sd-dock-reserve に反映=dockが高くても重ならない。未計測時は92pxで代替 */
.search-ov.sd-searching .sd-bar{ order:-1; margin-bottom:var(--sd-dock-reserve, 92px); transition:margin-bottom .3s var(--gc-ease); }
/* ★友達タイル(emojiアバター)の丸: アプリアイコンと同じ枠 */
.sd-app div.ic{ width:62px; height:62px; border-radius:55px; box-shadow:0 8px 22px rgba(0,0,0,.35), inset 0 0 0 .5px rgba(255,255,255,.18); }
.sd-res::-webkit-scrollbar{ display:none; }
.search-ov.sd-searching .sd-res{ max-height:54vh; opacity:1; margin-bottom:12px; }
.sd-bar, .sd-scroll{ transition:transform .5s var(--gc-ease), opacity .4s var(--gc-ease); }
/* ★検索中: アプリ一覧を「横スクロールの1行」に0.5sで畳む。文字を消すと4列グリッドへ0.5sで戻る。
   半透明(控えめ)にはしない=結果の後ろでアプリが二重に透けて見えるバグの解消。 */
.sd-apps{ max-height:1400px; transition:max-height .5s var(--gc-ease), gap .5s var(--gc-ease), padding .5s var(--gc-ease); }
.search-ov.sd-searching .sd-scroll{ opacity:1; margin-top:8px; overflow:visible; padding-bottom:0; }   /* 1行appsが画面いっぱいに出られるよう縦clipを外す。★AD(ユーザ指示2026-07-21): appsとinputの間の余白(padding-bottom 76px)を消す */
.search-ov.sd-searching .sd-apps{
  display:flex !important; flex-wrap:nowrap; justify-content:flex-start; align-items:flex-start;
  gap:18px; max-height:120px;
  /* ★横幅で制限しない=画面いっぱい(full-bleed)で左右スクロール。1行でも見切れない */
  width:100vw; margin-left:calc(50% - 50vw);
  padding:6px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));
  overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch;
  touch-action:pan-x !important;   /* ★bodyのtouch-action:pan-yを上書き=指で左右スクロールできる */
  scroll-snap-type:none;
}
.search-ov.sd-searching .sd-apps::-webkit-scrollbar{ display:none; }
.search-ov.sd-searching .sd-app{ flex:0 0 auto; width:62px; }
.search-ov.sd-searching .sd-app .nm{ -webkit-line-clamp:1; max-width:62px; }
/* ★検索中(入力あり)はQR/MBTI別の曲セクションを0.5sフェードで畳む(ユーザ指示2026-07-18)=結果のスペースを確保 */
.gc-mbti-songs{ max-height:420px; overflow:hidden; transition:max-height .5s var(--gc-ease), opacity .5s var(--gc-ease), margin .5s var(--gc-ease), transform .5s var(--gc-ease); }
.search-ov.sd-searching .gc-mbti-songs{ max-height:0; opacity:0; margin-top:0; margin-bottom:0; transform:translateY(8px); pointer-events:none; }

/* ── 翻訳結果: 枠なし・スライドアップ・タップでコピー ── */
.sd-tr{
  border:none; background:none; padding:6px 4px; width:100%; text-align:left; cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  opacity:0; transform:translateY(20px);
}
.sd-tr.in{ animation: sdTrUp .55s cubic-bezier(.16,1,.3,1) forwards; }
@keyframes sdTrUp{ to{ opacity:1; transform:none; } }
.sd-tr .trt{ font:600 19px/1.4 -apple-system,BlinkMacSystemFont,"Hiragino Sans",sans-serif; color:#fff; text-shadow:0 1px 8px rgba(0,0,0,.5); word-break:break-word; }
.sd-tr .trs{ font:400 12.5px/1.4 -apple-system,BlinkMacSystemFont,"Hiragino Sans",sans-serif; color:rgba(255,255,255,.55); margin-top:3px; }

/* ── グラフ: canvasを1sで左→右に描画(復帰) ── */
.sd-graph{
  border-radius:18px; padding:10px 4px 8px;
  background: rgba(255,255,255,.08);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  backdrop-filter: blur(20px) saturate(160%);
  box-shadow: inset 0 0 0 .5px rgba(255,255,255,.14);
  display:flex; flex-direction:column; align-items:center; gap:6px;
}
.sd-graph canvas{ animation: sdGraphIn 1s ease both; max-width:100%; }
@keyframes sdGraphIn{ from{ clip-path: inset(0 100% 0 0); } to{ clip-path: inset(0 0 0 0); } }
.sd-graph-cap{ font:500 12px/1.3 ui-monospace,Menlo,monospace; color:rgba(255,255,255,.6); }

/* ── 出入りのモーション: バーが0.3sで降りてきて、appsもそれに合わせて下へ動く(閉じる時も0.3sで戻る) ── */
.search-ov .sd-bar{ transform:translateY(-18px); opacity:0; transition:transform .3s var(--gc-ease), opacity .3s var(--gc-ease); }
.search-ov.show .sd-bar{ transform:none; opacity:1; }
.search-ov .sd-scroll{ transform:translateY(-14px); transition:transform .3s var(--gc-ease); }
.search-ov.show .sd-scroll{ transform:none; }

/* ★空のまま検索キー: バーが左右に震える(3回hapticと同時・ユーザ指示) */
@keyframes sdBarShake{ 0%,100%{ transform:translateX(0); } 15%{ transform:translateX(-9px); } 35%{ transform:translateX(8px); } 55%{ transform:translateX(-6px); } 75%{ transform:translateX(4px); } 90%{ transform:translateX(-2px); } }
.sd-bar.sd-shake{ animation:sdBarShake .55s ease both; }

/* 検索中はホームの虫眼鏡FABを隠す(旧仕様維持) */
body.gc-searching .gc-fab.gc-search{ opacity:0 !important; pointer-events:none !important; }

/* ★作ったAppも含めてタイルは左右中央そろえ(ユーザ指示2026-07-26)。最終行が左に寄らない。 */
.sd-apps{ justify-content:center; }
.sd-apps > .sd-app{ margin-left:auto; margin-right:auto; }
.sd-frs{ justify-content:center; }
