/* Story Fluent — shared visual language, scoped to the two editorial popups. */
.story-fluent-panel {
  --fluent-ink:#183647; --fluent-muted:#637078; --fluent-line:#deded5;
  --fluent-paper:#fffef9; --fluent-accent:#b68b43;
  color:var(--fluent-ink); background:var(--fluent-paper);
  border:1px solid #b9c7ca; border-radius:16px;
  box-shadow:0 18px 56px #18364730,0 3px 10px #18364714;
  font:13px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif;
  box-sizing:border-box; isolation:isolate;
}
.story-fluent-panel *, .story-fluent-panel *::before {box-sizing:border-box}
.story-fluent-panel .sf-fluent-heading {min-width:0}
.story-fluent-panel .sf-fluent-eyebrow {display:block;color:#d9c595;font-size:9px;font-weight:700;letter-spacing:.15em;line-height:1.4}
.story-fluent-panel .sf-fluent-heading strong {display:block;color:#fffdf5;font:500 23px/1.2 Georgia,serif;letter-spacing:-.02em;margin:2px 0}
.story-fluent-panel .sf-fluent-heading small {display:block;color:#d6e0e1;font:11px/1.4 system-ui,sans-serif}
.story-fluent-panel button {font:600 12px/1.3 system-ui,sans-serif;cursor:pointer;touch-action:manipulation}
.story-fluent-panel button:focus-visible,.story-fluent-panel input:focus-visible,.story-fluent-panel [tabindex]:focus-visible {outline:3px solid #b68b43;outline-offset:2px}
.story-fluent-panel button:disabled {opacity:.45;cursor:not-allowed}
.story-fluent-panel :is(.sf-polish-original,.sf-rephrase-original) {white-space:pre-wrap;overflow-wrap:anywhere;overflow:auto;flex-shrink:0;margin:10px 14px 8px;padding:9px 11px;max-height:88px;border:1px solid #e4e3d9;border-radius:9px;background:#f3f2eb;color:#586269;font:13px/1.5 Georgia,serif}
.story-fluent-panel :is(.sf-polish-original,.sf-rephrase-original):empty {display:none}
.story-fluent-panel :is(.sf-polish-original,.sf-rephrase-original)::before {content:'SELECTED PASSAGE';display:block;margin-bottom:4px;font:700 9px/1.4 system-ui,sans-serif;letter-spacing:.12em;color:#637078}
.story-fluent-panel :is(.sf-polish-status,.sf-rephrase-status) {padding:18px 5px;color:var(--fluent-muted);font:13px/1.6 system-ui,sans-serif}
.story-fluent-panel :is(.sf-polish-option,.sf-rephrase-option) {margin:2px 0 10px;padding:12px;border:1px solid var(--fluent-line);border-radius:10px;background:#fff;overflow-wrap:anywhere}
.story-fluent-panel :is(.sf-polish-label,.sf-rephrase-label) {margin-bottom:7px;color:#8a6328;font:700 10px/1.4 system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase}
.story-fluent-panel :is(.sf-polish-text,.sf-rephrase-text) {white-space:pre-wrap;color:#203945;font:15px/1.6 Georgia,serif}
.story-fluent-panel :is(.sf-polish-actions,.sf-rephrase-actions) {display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.story-fluent-panel :is(.sf-polish-actions,.sf-rephrase-actions,.sf-polish-adjust) button,
.story-fluent-panel #ysSuggestionPickerActions button {padding:8px 11px;min-height:34px;border:1px solid #ccd4d3;border-radius:7px;background:#fff;color:#244556;white-space:nowrap}
.story-fluent-panel :is(.sf-polish-actions,.sf-rephrase-actions) button[data-action="replace"],
.story-fluent-panel #ysSuggestionPickerActions .primary-btn {background:#183e50;color:#fff;border-color:#183e50}
.story-fluent-panel :is(.sf-polish-actions,.sf-rephrase-actions,.sf-polish-adjust) button:hover,
.story-fluent-panel #ysSuggestionPickerActions button:hover {filter:brightness(.95)}
.story-fluent-panel :is(.sf-polish-note,.sf-rephrase-note) {margin:7px 14px 10px;color:#637078;font:10px/1.45 system-ui,sans-serif;flex-shrink:0}
.sf-polish-panel.ys-polish-premium {position:fixed;z-index:10035;display:none;width:min(450px,calc(100vw - 24px));height:min(340px,calc(100vh - 24px));min-width:min(300px,calc(100vw - 16px));min-height:min(260px,calc(100vh - 16px));max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);padding:0;overflow:hidden}
.sf-polish-panel.ys-polish-premium.show {display:flex;flex-direction:column}
.story-fluent-panel .sf-polish-head {display:flex;justify-content:space-between;align-items:center;gap:10px;flex-shrink:0;margin:0;padding:12px 14px;background:#183e50;border-bottom:2px solid #c5a265;cursor:grab;user-select:none;touch-action:none}
.story-fluent-panel .sf-polish-head:active {cursor:grabbing}
.story-fluent-panel .ys-polish-window {display:flex;gap:5px;align-self:flex-start}
.story-fluent-panel .ys-polish-window button {display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid #ffffff45;border-radius:7px;background:#ffffff0c;color:#fff;font-size:18px}
.story-fluent-panel .ys-polish-window button:hover {background:#ffffff24}
.story-fluent-panel #sfPolishResults {flex:1;min-height:0;padding:2px 14px;overflow:auto;overscroll-behavior:contain}
.story-fluent-panel .sf-polish-option.selected:not(.ys-picked-suggestion) {border-color:#c7a668}
.story-fluent-panel .ys-picked-suggestion {background:#fbf8ef}
.story-fluent-panel .sf-polish-adjust {display:flex;gap:7px;flex-shrink:0;margin:0 14px;padding-top:9px;border-top:1px solid var(--fluent-line)}
.story-fluent-panel .sf-polish-adjust input {min-width:0;flex:1;padding:8px 10px;border:1px solid #ccd4d3;border-radius:7px;background:#fff;color:#203945;font:12px/1.4 system-ui,sans-serif}
.story-fluent-panel #ysSuggestionPickerBar {position:static;flex-shrink:0;margin:0 14px;padding:8px 0 0;border:0;background:var(--fluent-paper)}
.story-fluent-panel #ysSuggestionPickerActions {gap:6px}
.story-fluent-panel #ysSuggestionPickerActions button {min-height:34px}
.story-fluent-panel .ys-polish-resize {position:absolute;z-index:30;background:transparent;touch-action:none}
.story-fluent-panel .ys-pr-n {left:12px;right:12px;top:0;height:5px;cursor:n-resize}
.story-fluent-panel .ys-pr-s {left:12px;right:12px;bottom:0;height:5px;cursor:s-resize}
.story-fluent-panel .ys-pr-e {top:12px;bottom:12px;right:0;width:5px;cursor:e-resize}
.story-fluent-panel .ys-pr-w {top:12px;bottom:12px;left:0;width:5px;cursor:w-resize}
.story-fluent-panel :is(.ys-pr-ne,.ys-pr-se,.ys-pr-sw,.ys-pr-nw) {width:12px;height:12px}
.story-fluent-panel .ys-pr-ne {top:0;right:0;cursor:ne-resize}
.story-fluent-panel .ys-pr-se {bottom:0;right:0;cursor:se-resize}
.story-fluent-panel .ys-pr-sw {bottom:0;left:0;cursor:sw-resize}
.story-fluent-panel .ys-pr-nw {top:0;left:0;cursor:nw-resize}
#ysPolishRestoreTab {position:fixed;right:18px;bottom:18px;z-index:10038;display:none;align-items:center;gap:8px;min-height:40px;padding:0 12px;border:1px solid #536f79;border-bottom:2px solid #c5a265;border-radius:10px;background:#183e50;color:#fff;box-shadow:0 6px 22px #18364730;font:600 12px system-ui,sans-serif;cursor:pointer}
#ysPolishRestoreTab .ys-p-brand {color:#d9c595}
#ysPolishRestoreTab .ys-p-label {flex:1}
#ysPolishRestoreTab:focus-visible {outline:3px solid #b68b43;outline-offset:2px}
@media(max-width:620px) {
  .story-fluent-panel .sf-polish-head {padding:10px 12px}
  .story-fluent-panel :is(.sf-polish-original,.sf-rephrase-original) {margin-left:10px;margin-right:10px}
  .story-fluent-panel #sfPolishResults {padding-left:10px;padding-right:10px}
  .story-fluent-panel :is(.sf-polish-adjust,#ysSuggestionPickerBar) {margin-left:10px;margin-right:10px}
  .story-fluent-panel #ysSuggestionPickerActions {gap:5px}
  .story-fluent-panel #ysSuggestionPickerActions button {padding:8px}
}

/* One workflow: selected passage, style choice, suggested revisions. */
.story-fluent-panel .sf-fluent-modes {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;flex-shrink:0;margin:4px 14px 0;padding:4px;border:1px solid #d9dfdb;border-radius:10px;background:#eef1ed}
.story-fluent-panel .sf-fluent-modes button {min-width:0;min-height:36px;padding:7px 5px;border:1px solid transparent;border-radius:7px;background:transparent;color:#244556;font-size:12px}
.story-fluent-panel .sf-fluent-modes button:hover:not(:disabled):not([aria-pressed="true"]) {background:#fff}
.story-fluent-panel .sf-fluent-modes button[aria-pressed="true"] {background:#183e50;color:#fff;border-color:#183e50;box-shadow:0 2px 5px #18364718}
.story-fluent-panel .sf-fluent-mode-hint {flex-shrink:0;margin:6px 16px 9px;color:#637078;font:11px/1.4 system-ui,sans-serif}
.story-fluent-panel .sf-polish-option[role="radio"] {cursor:pointer}
@media(max-width:620px) {.story-fluent-panel .sf-fluent-modes {margin-left:10px;margin-right:10px}.story-fluent-panel .sf-fluent-mode-hint {margin-left:12px;margin-right:12px}}


/* Compact floating layout. Only the suggestions can scroll; chrome stays fixed. */
.story-fluent-panel {border-radius:12px}
.story-fluent-panel .sf-polish-head {padding:5px 8px;gap:6px}
.story-fluent-panel .sf-fluent-heading {display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:baseline}
.story-fluent-panel .sf-fluent-eyebrow {grid-column:2;grid-row:1;font-size:8px;letter-spacing:.1em;line-height:1.2}
.story-fluent-panel .sf-fluent-heading strong {grid-column:1;grid-row:1;font-size:18px;line-height:22px;margin:0}
.story-fluent-panel .sf-fluent-heading small {grid-column:1 / -1;grid-row:2;font-size:9px;line-height:12px}
.story-fluent-panel .ys-polish-window {gap:4px;align-self:center}
.story-fluent-panel .ys-polish-window button {width:25px;height:25px;font-size:16px}
.story-fluent-panel .sf-polish-original {margin:5px 8px 3px;padding:3px 6px;max-height:40px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;border-radius:6px;font-size:12px;line-height:16px}
.story-fluent-panel .sf-polish-original::before {margin-bottom:1px;font-size:8px;line-height:10px}
.story-fluent-panel .sf-fluent-modes {margin:2px 8px 0;padding:2px;gap:3px;border-radius:7px}
.story-fluent-panel .sf-fluent-modes button {min-height:25px;padding:3px 5px;font-size:11px;border-radius:5px}
.story-fluent-panel .sf-fluent-mode-hint {margin:3px 10px 4px;font-size:10px;line-height:12px}
.story-fluent-panel #sfPolishResults {flex:1 1 0;min-height:0;padding:1px 8px;overflow-x:hidden;overflow-y:auto}
.story-fluent-panel .sf-polish-status {padding:7px 2px;font-size:12px;line-height:1.4}
.story-fluent-panel .sf-polish-option {margin:1px 0 5px;padding:6px 8px;border-radius:7px}
.story-fluent-panel .sf-polish-label {margin-bottom:3px;font-size:9px;line-height:12px}
.story-fluent-panel .sf-polish-text {font-size:13px;line-height:1.4}
.story-fluent-panel .sf-polish-adjust {margin:0 8px;padding-top:4px;gap:5px}
.story-fluent-panel .sf-polish-adjust input {padding:4px 6px;font-size:11px;line-height:16px}
.story-fluent-panel .sf-polish-adjust button,.story-fluent-panel #ysSuggestionPickerActions button {min-height:26px;padding:4px 7px;font-size:11px;line-height:16px}
.story-fluent-panel #ysSuggestionPickerBar {margin:0 8px;padding-top:4px}
.story-fluent-panel #ysSuggestionPickerActions {gap:4px}
.story-fluent-panel .sf-polish-note {margin:3px 8px 5px;font-size:9px;line-height:12px}

/* Respond to the popup's own resized dimensions, not only to the viewport. */
.sf-polish-panel.ys-polish-premium {container-type:size;container-name:story-fluent}
.story-fluent-panel #sfPolishResults {min-width:0;flex:1 1 0%;position:relative}
.story-fluent-panel .sf-polish-adjust,.story-fluent-panel #ysSuggestionPickerBar {position:static;flex:0 0 auto;min-width:0}
.story-fluent-panel #ysSuggestionPickerActions {flex-wrap:wrap}
@container story-fluent (max-height:320px) {
 .story-fluent-panel .sf-polish-head {padding:3px 6px;gap:4px}
 .story-fluent-panel .sf-fluent-heading strong {font-size:16px;line-height:19px}
 .story-fluent-panel .sf-fluent-heading small {font-size:8px;line-height:10px}
 .story-fluent-panel .sf-polish-original {margin:3px 6px 2px;padding:2px 5px;max-height:32px;font-size:11px;line-height:14px}
 .story-fluent-panel .sf-polish-original::before {font-size:7px;line-height:9px;margin-bottom:0}
 .story-fluent-panel .sf-fluent-modes {margin:1px 6px 0;padding:1px;gap:2px}
 .story-fluent-panel .sf-fluent-modes button {min-height:23px;padding:2px 4px;font-size:10px;line-height:15px}
 .story-fluent-panel .sf-fluent-mode-hint {margin:2px 8px;font-size:9px;line-height:11px}
 .story-fluent-panel #sfPolishResults {padding:1px 6px}
 .story-fluent-panel .sf-polish-option {padding:4px 6px;margin:1px 0 3px}
 .story-fluent-panel .sf-polish-label {margin-bottom:1px;font-size:8px;line-height:10px}
 .story-fluent-panel .sf-polish-text {font-size:12px;line-height:1.35}
 .story-fluent-panel .sf-polish-adjust {margin:0 6px;padding-top:3px;gap:4px}
 .story-fluent-panel .sf-polish-adjust input {padding:2px 5px;font-size:10px;line-height:15px}
 .story-fluent-panel .sf-polish-adjust button,.story-fluent-panel #ysSuggestionPickerActions button {min-height:23px;padding:3px 5px;font-size:10px;line-height:15px}
 .story-fluent-panel #ysSuggestionPickerBar {margin:0 6px;padding-top:3px}
 .story-fluent-panel #ysSuggestionPickerActions {gap:3px}
 .story-fluent-panel .sf-polish-note {margin:2px 6px 3px;font-size:8px;line-height:10px}
}
@container story-fluent (max-width:360px) {
 .story-fluent-panel .sf-fluent-heading {column-gap:5px}
 .story-fluent-panel .sf-fluent-eyebrow {font-size:7px;letter-spacing:.04em}
 .story-fluent-panel #ysSuggestionPickerActions {gap:3px}
 .story-fluent-panel #ysSuggestionPickerActions button {padding-left:5px;padding-right:5px;font-size:10px}
}
