/* Love Oracle Tool */
.lot-wrap{max-width:1100px;margin:20px auto;padding:16px;border:1px solid #e5e5e5;border-radius:12px;background:#fff}
.lot-title{font-size:20px;font-weight:700;margin:0 0 8px}
.lot-note{margin:0 0 14px;opacity:.85}
.lot-controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:10px 0 16px}
.lot-btn{display:inline-block;padding:10px 14px;border-radius:10px;border:1px solid #ddd;background:#f7f7f7;cursor:pointer}
.lot-btn:hover{background:#f0f0f0}
.lot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:860px){.lot-grid{grid-template-columns:1fr}}
.lot-card{border:1px solid #ececec;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.lot-card-head{padding:12px 12px 10px;border-bottom:1px solid #f0f0f0}
.lot-slot{font-weight:800;font-size:14px;margin:0 0 6px}
.lot-genre{display:inline-block;font-size:12px;font-weight:700;padding:4px 8px;border-radius:999px;margin-right:6px}
.lot-name{font-size:16px;font-weight:800;margin:6px 0 0}
.lot-sub{font-size:12px;opacity:.8;margin:4px 0 0}
.lot-img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:#fafafa}
.lot-body{padding:12px}
.lot-pos{font-weight:800;margin:0 0 8px}
.lot-lines{margin:0;padding-left:18px}
.lot-lines li{margin:4px 0}
.lot-loading{opacity:.75}
.lot-genre-気持ち{background:#ffe4ee;color:#8a1443}
.lot-genre-関係性{background:#e8f1ff;color:#0b3a78}
.lot-genre-課題{background:#fff4e0;color:#7a4500}
.lot-genre-進展{background:#e7fff0;color:#0b5b2f}

.lot-summary{margin-top:14px;padding:12px;border:1px dashed #ddd;border-radius:12px;background:#fafafa}
.lot-summary-title{font-weight:800;margin:0 0 6px}
.lot-summary-text{margin:0;line-height:1.7}

.lot-overlay{pointer-events:none;position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.78);backdrop-filter:blur(2px);border-radius:12px;z-index:50}
.lot-wrap{position:relative}
.lot-overlay-inner{padding:14px;border:1px solid #e6e6e6;border-radius:14px;background:#fff;box-shadow:0 8px 24px rgba(0,0,0,.08)}
.lot-overlay-gif{width:min(520px, 86vw);height:auto;display:block}

.lot-out{margin-top:10px}
.lot-out{scroll-margin-top:120px}

.lot-out{position:relative}

/* --- Loading indicator safety ---
   Some themes/plugins add pseudo-elements to aria-busy elements.
   On certain fonts/devices this can appear as garbled characters.
   Force-hide any pseudo content while loading.
*/
.lot-out[aria-busy="true"]::before,
.lot-out[aria-busy="true"]::after,
.lot-loading::before,
.lot-loading::after{
  content:"" !important;
  display:none !important;
}

/* Also ensure the shuffle overlay can't render stray text nodes */
.lot-overlay,
.lot-overlay-inner{font-size:0;line-height:0}


/* === Shuffle stage (visual only / warm & exciting) === */
.lot-overlay{background:rgba(255,255,255,.62);backdrop-filter:blur(6px);}
.lot-shuffle-aurora{
  position:absolute; inset:-20px;
  filter: blur(24px);
  opacity:.9;
  background:
    radial-gradient(circle at 20% 30%, rgba(255,182,193,.55), transparent 55%),
    radial-gradient(circle at 75% 35%, rgba(186,255,233,.55), transparent 55%),
    radial-gradient(circle at 55% 80%, rgba(210,190,255,.55), transparent 60%);
  animation: lotAurora 2.6s ease-in-out infinite alternate;
  border-radius:18px;
}
@keyframes lotAurora{
  from{transform:translate3d(0,0,0) scale(1);}
  to{transform:translate3d(0,-6px,0) scale(1.03);}
}
.lot-shuffle-stage{
  position:relative;
  width:min(520px, 90vw);
  height:min(220px, 52vw);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
}
.lot-sh-card{
  width:min(140px, 26vw);
  height:min(190px, 36vw);
  border-radius:22px;
  background:
    linear-gradient(135deg, rgba(255,214,230,.95), rgba(214,240,255,.95));
  box-shadow:
    0 16px 30px rgba(0,0,0,.10),
    inset 0 1px 0 rgba(255,255,255,.85);
  position:relative;
  transform:translate3d(0,0,0);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.65);
}
.lot-sh-card::before{
  content:"";
  position:absolute; inset:-40%;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.85), transparent 58%);
  transform:rotate(18deg);
  opacity:.55;
}
.lot-sh-card::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,.65) 45%, transparent 65%);
  transform:translateX(-120%);
  animation: lotShine 1.35s ease-in-out infinite;
  opacity:.75;
}
@keyframes lotShine{
  0%{transform:translateX(-140%);}
  55%{transform:translateX(140%);}
  100%{transform:translateX(140%);}
}
.lot-sh-card.c1{background:linear-gradient(135deg, rgba(255,223,236,.95), rgba(255,244,210,.95)); animation: lotFloat1 1.25s ease-in-out infinite;}
.lot-sh-card.c2{background:linear-gradient(135deg, rgba(210,245,255,.95), rgba(225,214,255,.95)); animation: lotFloat2 1.25s ease-in-out infinite;}
.lot-sh-card.c3{background:linear-gradient(135deg, rgba(214,255,233,.95), rgba(255,214,246,.95)); animation: lotFloat3 1.25s ease-in-out infinite;}
@keyframes lotFloat1{0%,100%{transform:translate3d(-8px,6px,0) rotate(-3deg);}50%{transform:translate3d(-14px,-2px,0) rotate(-5deg);}}
@keyframes lotFloat2{0%,100%{transform:translate3d(0,-4px,0) rotate(1deg);}50%{transform:translate3d(0,6px,0) rotate(-1deg);}}
@keyframes lotFloat3{0%,100%{transform:translate3d(8px,6px,0) rotate(3deg);}50%{transform:translate3d(14px,-2px,0) rotate(5deg);}}
/* Ensure no stray glyphs from themes */
.lot-overlay, .lot-shuffle-stage{font-size:0; line-height:0;}
