/* Editor de Story do T-FEED: isolado para não alterar as demais telas do T-FIT. */
body.tfeed-story-editor-open { overflow: hidden; }

.tfeed-story-editor {
  position: fixed;
  inset: 0;
  z-index: 220;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-height: 100dvh;
  color: #f7f9ff;
  background:
    radial-gradient(circle at 20% 4%, rgba(120, 73, 255, .34), transparent 34%),
    radial-gradient(circle at 84% 80%, rgba(0, 232, 181, .20), transparent 36%),
    #040713;
  font-family: inherit;
}

.tfeed-story-editor *, .tfeed-story-editor *::before, .tfeed-story-editor *::after { box-sizing: border-box; }
.tfeed-story-editor button, .tfeed-story-editor input, .tfeed-story-editor textarea, .tfeed-story-editor select { font: inherit; }

.tfeed-story-editor__topbar {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  min-height: calc(62px + env(safe-area-inset-top));
  padding: env(safe-area-inset-top) 14px 8px;
  border-bottom: 1px solid rgba(175, 198, 255, .13);
  background: rgba(3, 7, 20, .78);
  backdrop-filter: blur(18px);
}
.tfeed-story-editor__topbar h2 { margin: 0; font-size: 1rem; text-align: center; letter-spacing: .01em; }
.tfeed-story-editor__icon-button, .tfeed-story-editor__publish, .tfeed-story-editor__tool, .tfeed-story-editor__filter, .tfeed-story-editor__tag-result, .tfeed-story-editor__audio-play, .tfeed-story-editor__emoji {
  border: 0;
  cursor: pointer;
  color: inherit;
}
.tfeed-story-editor__icon-button {
  width: 44px; height: 44px; display: grid; place-items: center;
  border-radius: 14px; font-size: 1.45rem; background: rgba(255,255,255,.07);
}
.tfeed-story-editor__publish {
  min-height: 40px; padding: 0 15px; border-radius: 12px;
  color: #061116; font-weight: 800; background: linear-gradient(135deg, #12e6ba, #4c9dff);
  box-shadow: 0 8px 25px rgba(0, 219, 181, .22);
}
.tfeed-story-editor__publish:disabled { opacity: .56; cursor: wait; }

.tfeed-story-editor__workspace {
  min-height: 0;
  display: grid;
  place-items: center;
  padding: 12px 16px 10px;
  overflow: hidden;
}
.tfeed-story-editor__stage {
  position: relative;
  width: min(100%, 390px);
  height: min(100%, 610px);
  aspect-ratio: 9 / 16;
  overflow: hidden;
  border: 1px solid rgba(158, 211, 255, .42);
  border-radius: 24px;
  background: linear-gradient(150deg, #101b35, #050814 57%, #112843);
  box-shadow: 0 0 0 1px rgba(111, 57, 255, .16), 0 20px 44px rgba(0,0,0,.45), 0 0 36px rgba(62,158,255,.13);
}
.tfeed-story-editor__media-host, .tfeed-story-editor__overlay-host { position: absolute; inset: 0; }
.tfeed-story-editor__media-host { display: grid; place-items: center; }
.tfeed-story-editor__media-host img, .tfeed-story-editor__media-host video { width: 100%; height: 100%; object-fit: cover; }
.tfeed-story-editor__media-host[data-filter="vibrant"] img, .tfeed-story-editor__media-host[data-filter="vibrant"] video { filter: saturate(1.42) contrast(1.09); }
.tfeed-story-editor__media-host[data-filter="warm"] img, .tfeed-story-editor__media-host[data-filter="warm"] video { filter: sepia(.22) saturate(1.18) contrast(1.03) hue-rotate(-8deg); }
.tfeed-story-editor__media-host[data-filter="cool"] img, .tfeed-story-editor__media-host[data-filter="cool"] video { filter: saturate(1.12) contrast(1.07) hue-rotate(12deg) brightness(1.04); }
.tfeed-story-editor__media-host[data-filter="mono"] img, .tfeed-story-editor__media-host[data-filter="mono"] video { filter: grayscale(1) contrast(1.17); }
.tfeed-story-editor__media-host[data-filter="neon"] img, .tfeed-story-editor__media-host[data-filter="neon"] video { filter: saturate(1.8) contrast(1.16) hue-rotate(24deg) brightness(1.08); }
.tfeed-story-editor__empty {
  display: grid; place-items: center; align-content: center; gap: 12px; width: 100%; height: 100%;
  color: #bdcbe7; text-align: center; padding: 28px;
}
.tfeed-story-editor__empty strong { color: #fff; font-size: 1.1rem; }
.tfeed-story-editor__choose-media {
  min-height: 48px; padding: 0 18px; border: 0; border-radius: 15px; color: #07121a; font-weight: 800;
  cursor: pointer; background: linear-gradient(135deg, #19ebbf, #55a5ff);
}
.tfeed-story-editor__overlay-host { pointer-events: none; }
.tfeed-story-editor__sticker {
  position: absolute; left: calc(var(--x) * 100%); top: calc(var(--y) * 100%);
  transform: translate(-50%, -50%); max-width: 80%; pointer-events: auto; touch-action: none;
  user-select: none; cursor: grab;
}
.tfeed-story-editor__sticker:active { cursor: grabbing; }
.tfeed-story-editor__text-sticker {
  padding: 8px 12px; border-radius: 13px; color: white; background: rgba(3, 8, 22, .62);
  box-shadow: 0 4px 18px rgba(0,0,0,.28); font-size: clamp(1rem, 4.8vw, 1.45rem); font-weight: 800; line-height: 1.14; text-align: center;
  overflow-wrap: anywhere;
}
.tfeed-story-editor__tag-sticker {
  padding: 7px 11px; border: 1px solid rgba(120, 255, 229, .78); border-radius: 999px;
  color: #eafffa; background: rgba(0, 72, 83, .80); box-shadow: 0 0 17px rgba(0,238,187,.29); font-size: .82rem; font-weight: 800;
}
.tfeed-story-editor__status {
  position: absolute; right: 10px; bottom: 10px; z-index: 3; max-width: calc(100% - 20px);
  padding: 7px 10px; border: 1px solid rgba(134, 190, 255, .27); border-radius: 10px;
  color: #d4e1ff; background: rgba(4, 10, 27, .74); font-size: .76rem;
}
.tfeed-story-editor__status.is-error { border-color: rgba(255, 110, 139, .72); color: #ffe1e8; }
.tfeed-story-editor__media-input, .tfeed-story-editor__audio-input { display: none; }

.tfeed-story-editor__bottom {
  padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
  border-top: 1px solid rgba(175, 198, 255, .13);
  background: rgba(4, 8, 22, .93);
  backdrop-filter: blur(18px);
}
.tfeed-story-editor__tools { display: flex; gap: 8px; overflow-x: auto; padding: 0 0 9px; scrollbar-width: none; }
.tfeed-story-editor__tools::-webkit-scrollbar { display: none; }
.tfeed-story-editor__tool {
  flex: 0 0 auto; min-height: 44px; padding: 0 14px; border: 1px solid rgba(146, 177, 239, .18); border-radius: 14px;
  color: #d9e5ff; background: rgba(255,255,255,.05); font-size: .83rem; font-weight: 750;
}
.tfeed-story-editor__tool.is-active { border-color: rgba(81, 218, 255, .67); color: #fff; background: linear-gradient(135deg, rgba(50, 122, 255, .55), rgba(117, 54, 245, .48)); box-shadow: 0 0 18px rgba(86,118,255,.2); }
.tfeed-story-editor__sheet {
  min-height: 116px; max-height: min(30dvh, 240px); overflow: auto; padding: 2px 1px 0;
}
.tfeed-story-editor__section-title { margin: 5px 0 8px; color: #aebddc; font-size: .76rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.tfeed-story-editor__filter-list, .tfeed-story-editor__emoji-list { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 5px; }
.tfeed-story-editor__filter {
  flex: 0 0 auto; min-width: 70px; min-height: 48px; border: 1px solid rgba(151, 182, 255, .17); border-radius: 13px;
  color: #dce8ff; background: linear-gradient(145deg, #17223d, #0a1023); font-size: .75rem; font-weight: 800;
}
.tfeed-story-editor__filter.is-active { color: white; border-color: #32e4c0; box-shadow: inset 0 0 0 1px rgba(22,235,190,.45), 0 0 18px rgba(28,235,192,.16); }
.tfeed-story-editor__field { display: grid; gap: 6px; color: #aebddc; font-size: .78rem; font-weight: 700; }
.tfeed-story-editor__field + .tfeed-story-editor__field { margin-top: 9px; }
.tfeed-story-editor__field textarea, .tfeed-story-editor__field input, .tfeed-story-editor__field select {
  width: 100%; min-height: 42px; border: 1px solid rgba(145, 180, 255, .18); border-radius: 12px;
  outline: none; color: #f7faff; background: rgba(255,255,255,.065); padding: 10px 12px;
}
.tfeed-story-editor__field textarea { min-height: 62px; resize: vertical; }
.tfeed-story-editor__field textarea:focus, .tfeed-story-editor__field input:focus, .tfeed-story-editor__field select:focus { border-color: #32dabe; box-shadow: 0 0 0 3px rgba(28,219,184,.12); }
.tfeed-story-editor__emoji { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 12px; background: rgba(255,255,255,.07); font-size: 1.22rem; }
.tfeed-story-editor__tag-results { display: grid; gap: 6px; margin-top: 8px; }
.tfeed-story-editor__tag-result { display: grid; grid-template-columns: 33px minmax(0, 1fr); align-items: center; gap: 8px; width: 100%; min-height: 46px; padding: 6px; border-radius: 13px; text-align: left; background: rgba(255,255,255,.055); }
.tfeed-story-editor__tag-result img { width: 33px; height: 33px; border-radius: 50%; object-fit: cover; }
.tfeed-story-editor__tag-result strong, .tfeed-story-editor__tag-result small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tfeed-story-editor__tag-result small { color: #aab8d6; margin-top: 2px; }
.tfeed-story-editor__selected-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.tfeed-story-editor__selected-tag { display: inline-flex; align-items: center; gap: 5px; padding: 6px 9px; border: 1px solid rgba(41,229,188,.43); border-radius: 999px; color: #d8fff5; background: rgba(9, 128, 111, .24); font-size: .78rem; }
.tfeed-story-editor__selected-tag button { border: 0; padding: 0; color: inherit; cursor: pointer; background: transparent; font-size: 1rem; line-height: 1; }
.tfeed-story-editor__audio-card { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 9px; align-items: center; padding: 10px; border: 1px solid rgba(128, 165, 255, .17); border-radius: 13px; background: rgba(255,255,255,.05); }
.tfeed-story-editor__audio-play { width: 38px; height: 38px; border-radius: 50%; color: #06181a; background: #25e2bf; font-weight: 900; }
.tfeed-story-editor__audio-card strong, .tfeed-story-editor__audio-card small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tfeed-story-editor__audio-card small { color: #adbad5; margin-top: 3px; }
.tfeed-story-editor__check { display: flex; align-items: flex-start; gap: 8px; color: #c4d0e8; font-size: .76rem; line-height: 1.25; }
.tfeed-story-editor__check input { margin-top: 2px; accent-color: #21dcb9; }
.tfeed-story-editor__publish-options { display: grid; gap: 8px; }
.tfeed-story-editor__hint { margin: 7px 0 0; color: #99a8c7; font-size: .72rem; line-height: 1.35; }

/* Mesmo renderer usado pelo visualizador de Story. */
.tfeed-story-media { position: relative; overflow: hidden; }
.tfeed-story-visual { width: 100%; height: 100%; }
.tfeed-story-visual img, .tfeed-story-visual video { width: 100%; height: 100%; object-fit: cover; }
.tfeed-story-visual.tfeed-story-filter--vibrant img, .tfeed-story-visual.tfeed-story-filter--vibrant video { filter: saturate(1.42) contrast(1.09); }
.tfeed-story-visual.tfeed-story-filter--warm img, .tfeed-story-visual.tfeed-story-filter--warm video { filter: sepia(.22) saturate(1.18) contrast(1.03) hue-rotate(-8deg); }
.tfeed-story-visual.tfeed-story-filter--cool img, .tfeed-story-visual.tfeed-story-filter--cool video { filter: saturate(1.12) contrast(1.07) hue-rotate(12deg) brightness(1.04); }
.tfeed-story-visual.tfeed-story-filter--mono img, .tfeed-story-visual.tfeed-story-filter--mono video { filter: grayscale(1) contrast(1.17); }
.tfeed-story-visual.tfeed-story-filter--neon img, .tfeed-story-visual.tfeed-story-filter--neon video { filter: saturate(1.8) contrast(1.16) hue-rotate(24deg) brightness(1.08); }
.tfeed-story-render-overlays { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.tfeed-story-render-sticker { position: absolute; left: calc(var(--x) * 100%); top: calc(var(--y) * 100%); transform: translate(-50%, -50%); max-width: 76%; padding: 7px 10px; border-radius: 12px; color: white; background: rgba(4, 8, 22, .60); font-weight: 800; line-height: 1.13; text-align: center; overflow-wrap: anywhere; }
.tfeed-story-render-mention { pointer-events: auto; border: 1px solid rgba(115,255,225,.76); color: #effffb; background: rgba(0, 65, 79, .82); text-decoration: none; }
.tfeed-story-audio-control { position: absolute; top: 12px; right: 12px; z-index: 4; min-height: 38px; padding: 0 11px; border: 1px solid rgba(155, 201, 255, .46); border-radius: 999px; color: #fff; background: rgba(3,9,24,.72); cursor: pointer; font-size: .76rem; font-weight: 800; }
.tfeed-story-audio-control.is-playing { color: #061a18; border-color: #2ee5bf; background: #2ee5bf; }

@media (min-width: 820px) {
  .tfeed-story-editor { grid-template-columns: minmax(0, 1fr) 360px; grid-template-rows: auto minmax(0, 1fr); }
  .tfeed-story-editor__topbar { grid-column: 1 / -1; }
  .tfeed-story-editor__workspace { padding: 20px; }
  .tfeed-story-editor__bottom { grid-column: 2; grid-row: 2; align-self: stretch; border-top: 0; border-left: 1px solid rgba(175, 198, 255, .13); padding: 18px; }
  .tfeed-story-editor__tools { flex-wrap: wrap; overflow: visible; }
  .tfeed-story-editor__sheet { max-height: none; }
  .tfeed-story-editor__stage { max-height: calc(100dvh - 106px); }
}

@media (max-height: 680px) and (max-width: 819px) {
  .tfeed-story-editor__workspace { padding-top: 7px; padding-bottom: 6px; }
  .tfeed-story-editor__sheet { min-height: 91px; max-height: 24dvh; }
  .tfeed-story-editor__bottom { padding-top: 7px; }
  .tfeed-story-editor__tools { padding-bottom: 6px; }
}
/* Story composer v2: ferramentas flutuantes e gaveta compacta, inspiradas no fluxo de criação social. */
.tfeed-story-editor {
  grid-template-rows: auto minmax(0, 1fr);
  background: radial-gradient(circle at 50% -12%, rgba(93, 70, 255, .45), transparent 42%), #02040c;
}
.tfeed-story-editor__topbar {
  position: relative;
  z-index: 8;
  border-bottom: 0;
  background: linear-gradient(180deg, rgba(2, 4, 12, .86), rgba(2, 4, 12, 0));
}
.tfeed-story-editor__topbar h2 { font-size: .94rem; font-weight: 850; }
.tfeed-story-editor__icon-button { width: 40px; height: 40px; border-radius: 50%; background: rgba(3, 8, 22, .58); border: 1px solid rgba(255,255,255,.16); }
.tfeed-story-editor__publish { min-height: 36px; border-radius: 999px; padding: 0 14px; font-size: .8rem; }
.tfeed-story-editor__workspace { position: relative; padding: 0 16px 155px; }
.tfeed-story-editor__stage { width: min(100%, 410px); height: min(100%, 680px); border-radius: 28px; border-color: rgba(255,255,255,.22); background: #0a1020; box-shadow: 0 24px 58px rgba(0,0,0,.58), 0 0 50px rgba(73,97,255,.18); }
.tfeed-story-editor__empty { gap: 13px; background: radial-gradient(circle at 50% 25%, rgba(78, 128, 255, .2), transparent 42%), linear-gradient(155deg, #16284c, #060b18 65%); }
.tfeed-story-editor__empty span { max-width: 250px; font-size: .83rem; line-height: 1.4; }
.tfeed-story-editor__choose-media { border-radius: 999px; box-shadow: 0 12px 25px rgba(35, 197, 255, .2); }
.tfeed-story-editor__bottom { display: contents; }
.tfeed-story-editor__tools {
  position: fixed; z-index: 16; top: calc(76px + env(safe-area-inset-top)); right: 13px;
  display: grid; gap: 8px; padding: 7px; overflow: visible;
  border: 1px solid rgba(212, 229, 255, .18); border-radius: 23px;
  background: rgba(3, 8, 21, .67); box-shadow: 0 12px 34px rgba(0,0,0,.35); backdrop-filter: blur(18px);
}
.tfeed-story-editor__tool { display: grid; width: 43px; min-height: 43px; place-items: center; padding: 0; border-radius: 50%; font-size: 0; background: rgba(255,255,255,.055); }
.tfeed-story-editor__tool::before { font-size: 18px; line-height: 1; }
.tfeed-story-editor__tool[data-story-editor-panel="filters"]::before { content: '✦'; }
.tfeed-story-editor__tool[data-story-editor-panel="text"]::before { content: 'Aa'; font-size: 14px; font-weight: 900; }
.tfeed-story-editor__tool[data-story-editor-panel="emoji"]::before { content: '☺'; }
.tfeed-story-editor__tool[data-story-editor-panel="tags"]::before { content: '@'; font-size: 17px; font-weight: 900; }
.tfeed-story-editor__tool[data-story-editor-panel="music"]::before { content: '♫'; }
.tfeed-story-editor__tool[data-story-editor-panel="publish"]::before { content: '⋯'; font-size: 21px; }
.tfeed-story-editor__tool.is-active { color: #07101c; border-color: rgba(141,255,235,.9); background: linear-gradient(145deg, #2ce9c1, #77a7ff); box-shadow: 0 0 20px rgba(46,229,193,.32); }
.tfeed-story-editor__sheet {
  position: fixed; z-index: 15; right: 0; bottom: 0; left: 0;
  min-height: 0; max-height: min(33dvh, 292px); margin: 0; padding: 14px 16px calc(15px + env(safe-area-inset-bottom));
  overflow: auto; border-top: 1px solid rgba(191, 215, 255, .2); border-radius: 25px 25px 0 0;
  background: linear-gradient(155deg, rgba(20,30,55,.96), rgba(4,8,20,.98) 68%);
  box-shadow: 0 -14px 36px rgba(0,0,0,.37); backdrop-filter: blur(24px);
}
.tfeed-story-editor__sheet::before { content: ''; display: block; width: 34px; height: 4px; margin: 0 auto 10px; border-radius: 999px; background: rgba(255,255,255,.28); }
.tfeed-story-editor__filter-list { gap: 7px; }
.tfeed-story-editor__filter { min-width: 76px; min-height: 42px; border-radius: 14px; }
.tfeed-story-editor__field textarea { min-height: 54px; }
.tfeed-story-editor__music-heading { display: flex; align-items: center; gap: 10px; margin-bottom: 11px; }
.tfeed-story-editor__music-heading > span { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 50%; color: #061220; background: linear-gradient(145deg, #30e7c0, #77a7ff); font-size: 20px; box-shadow: 0 0 18px rgba(49, 230, 194, .25); }
.tfeed-story-editor__music-heading strong, .tfeed-story-editor__music-heading small { display: block; }
.tfeed-story-editor__music-heading strong { font-size: .91rem; }
.tfeed-story-editor__music-heading small { margin-top: 2px; color: #9dadcf; font-size: .71rem; }
.tfeed-story-editor__music-search { display: flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 12px; border: 1px solid rgba(145,180,255,.22); border-radius: 14px; color: #b8c9ee; background: rgba(255,255,255,.055); }
.tfeed-story-editor__music-search input { width: 100%; min-width: 0; border: 0; outline: 0; color: #fff; background: transparent; font-size: .82rem; }
.tfeed-story-editor__music-results { display: grid; gap: 6px; margin-top: 10px; }
.tfeed-story-editor__track { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 9px; align-items: center; width: 100%; min-height: 49px; padding: 6px 9px; border: 1px solid rgba(149,183,255,.14); border-radius: 14px; color: #eaf2ff; background: rgba(255,255,255,.04); text-align: left; cursor: pointer; }
.tfeed-story-editor__track.is-selected { border-color: rgba(48,231,192,.7); background: rgba(24,184,153,.14); }
.tfeed-story-editor__track-art { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 11px; color: #051323; background: linear-gradient(145deg, #38e8c4, #7c8fff); font-size: 17px; }
.tfeed-story-editor__track strong, .tfeed-story-editor__track small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tfeed-story-editor__track strong { font-size: .78rem; }
.tfeed-story-editor__track small { margin-top: 2px; color: #aab9d7; font-size: .67rem; }
.tfeed-story-editor__track em { font-style: normal; color: #67f2d2; font-size: .68rem; font-weight: 850; }
.tfeed-story-editor__music-empty { margin: 8px 0; color: #aab9d7; font-size: .78rem; }
.tfeed-story-editor__audio-card { grid-template-columns: auto minmax(0, 1fr) auto; margin-top: 10px; }
.tfeed-story-editor__audio-remove { width: 30px; height: 30px; border: 0; border-radius: 50%; color: #ffdce5; background: rgba(236,73,108,.18); cursor: pointer; font-size: 19px; line-height: 1; }
.tfeed-story-editor__own-audio { width: auto; min-height: 37px; margin-top: 9px; padding: 0 13px; border-radius: 12px; color: #c9d7f2; font-size: .74rem; }
.tfeed-story-editor__own-audio::before { content: '＋'; margin-right: 5px; font-size: 15px; }
.tfeed-story-editor__audio-rights, .tfeed-story-editor__volume { margin-top: 9px; }
.tfeed-story-editor__status { z-index: 5; }
@media (min-width: 820px) {
  .tfeed-story-editor { grid-template-columns: none; grid-template-rows: auto minmax(0, 1fr); }
  .tfeed-story-editor__bottom { display: contents; }
  .tfeed-story-editor__sheet { left: auto; width: min(430px, 42vw); border: 1px solid rgba(191,215,255,.2); border-radius: 24px 0 0 0; }
  .tfeed-story-editor__workspace { padding-bottom: 35px; }
}
@media (max-width: 380px) {
  .tfeed-story-editor__workspace { padding-right: 10px; padding-left: 10px; }
  .tfeed-story-editor__tools { right: 8px; padding: 5px; gap: 6px; }
  .tfeed-story-editor__tool { width: 38px; min-height: 38px; }
}