/* 피드 플래너 스타일 — 라이트모드 기준. app-feed-planner.js 전용. */
.fplan-overlay { position: fixed; inset: 0; z-index: 100200; background: rgba(28, 22, 24, .38);
  display: flex; align-items: flex-end; justify-content: center; opacity: 0; transition: opacity .26s ease; }
.fplan-overlay.is-open { opacity: 1; }
.fplan { width: 100%; max-width: 520px; max-height: 92vh; background: #F8F2EC; border-radius: 22px 22px 0 0;
  padding: 8px 16px calc(20px + env(safe-area-inset-bottom)); display: flex; flex-direction: column;
  transform: translateY(24px); transition: transform .26s cubic-bezier(.22,1,.36,1); box-shadow: 0 -8px 40px rgba(0,0,0,.18); }
.fplan-overlay.is-open .fplan { transform: translateY(0); }

.fplan__head { display: flex; align-items: center; gap: 10px; padding: 10px 2px 8px; }
.fplan__close { width: 40px; height: 40px; border: 0; background: transparent; color: #6B5A56; border-radius: 12px; cursor: pointer; display: grid; place-items: center; }
.fplan__close:active { background: #EFE6DE; }
.fplan__ttl { flex: 1; text-align: center; line-height: 1.25; }
.fplan__ttl b { display: block; font-size: 16px; color: #3A2E2A; font-weight: 700; }
.fplan__ttl span { font-size: 12px; color: #A08E88; }
.fplan__save { border: 0; background: #C4707E; color: #fff; font-weight: 700; font-size: 14px; padding: 9px 18px; border-radius: 12px; min-height: 40px; cursor: pointer; }
.fplan__save:active { transform: scale(.97); }

.fplan__hint { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; padding: 10px 14px; margin: 4px 2px 12px;
  border-radius: 14px; background: #EFE6DE; color: #8A756E; }
.fplan__hint .fplan__dot { width: 9px; height: 9px; border-radius: 50%; background: #C3B3AC; flex: none; }
.fplan__hint.is-ok { background: #E7F3EC; color: #2E7D57; }
.fplan__hint.is-ok .fplan__dot { background: #3DBB86; }
.fplan__hint.is-warn { background: #FBEEE6; color: #B5673C; }
.fplan__hint.is-warn .fplan__dot { background: #E39058; }

.fplan__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; overflow: auto; border-radius: 14px; padding: 3px; background: #EDE3DA; }
.fplan__cell { position: relative; aspect-ratio: 1 / 1; background-size: cover; background-position: center; border-radius: 4px;
  touch-action: none; user-select: none; -webkit-user-select: none; cursor: grab; transition: transform .12s ease, box-shadow .12s ease; }
.fplan__cell--ph { background: #E3D7CD; cursor: default; }
.fplan__cell.fplan__lift { opacity: .35; }
.fplan__cell.fplan__over { box-shadow: inset 0 0 0 3px #C4707E; transform: scale(.96); }
.fplan__badge { position: absolute; top: 6px; left: 6px; background: #C4707E; color: #fff; font-size: 10px; font-weight: 700; padding: 2px 7px; border-radius: 8px; letter-spacing: .3px; }
.fplan__grip { position: absolute; right: 5px; bottom: 5px; width: 18px; height: 18px; opacity: .85;
  background: radial-gradient(circle, #fff 1.4px, transparent 1.6px) 0 0 / 6px 6px; border-radius: 4px; mix-blend-mode: overlay; }
.fplan__ghost { position: fixed; z-index: 100210; transform: translate(-50%, -50%) scale(1.06); pointer-events: none;
  border-radius: 8px; box-shadow: 0 12px 30px rgba(0,0,0,.32); opacity: .96; background-size: cover; background-position: center; }
.fplan__tip { font-size: 11.5px; color: #A99A93; text-align: center; margin: 12px 0 0; }

/* 미리보기 단계 진입 버튼 (_feedPreview 하단) */
.wsfeed__plan { width: 100%; margin-top: 10px; border: 1.5px solid #E3CBD1; background: #FCF5F1; color: #B0596A;
  font-weight: 700; font-size: 13.5px; padding: 11px; border-radius: 14px; min-height: 44px; cursor: pointer; }
.wsfeed__plan:active { transform: scale(.99); background: #F6E9E4; }

@media (width >= 768px) {
  .fplan-overlay { align-items: center; }
  .fplan { border-radius: 22px; max-width: 460px; }
}
