#modal.ff-story-modal{width:min(1040px,calc(100vw - 32px));max-width:none;max-height:94dvh;background:#efeee8;color:#273c2f;border:0;border-radius:17px;padding:28px;overflow:auto}
#modal.ff-story-modal .modal-heading{align-items:center;margin-bottom:24px}
#modal.ff-story-modal .modal-heading h2{color:#294232;font:600 28px/1.1 var(--sans);letter-spacing:-.04em}
#modal.ff-story-modal .icon-button{color:#405d47;background:#e2e8dc;border:0;border-radius:50%}
.ff-story-editor{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:35px}
.ff-story-preview-wrap{padding:20px;background:#d7dfd1;border-radius:12px;text-align:center}
.ff-story-preview{width:100%;aspect-ratio:9/16;max-width:350px;margin:auto;background:#233a2c;display:grid;place-items:center;position:relative;box-shadow:0 15px 30px #15312130;border-radius:4px;overflow:hidden}
.ff-story-preview>img{width:100%;height:100%;display:block;object-fit:contain}
.ff-story-preview>img[hidden],.ff-story-loading[hidden]{display:none}
.ff-story-preview[aria-busy=true]>img{opacity:.55}
.ff-story-loading{font:14px/1.7 var(--sans);color:#d7e8d1;padding:25px}
.ff-story-preview-wrap>span{display:block;margin-top:18px;font:8px var(--mono);letter-spacing:.08em;color:#7b8d6f}
.ff-story-tools{padding:15px 5px}
.ff-story-tools>.eyebrow{color:#72916b;font-size:9px}
.ff-story-tools h3{color:#2b4a32;font:550 37px/1.06 var(--sans);letter-spacing:-.05em;margin:20px 0 17px;max-width:320px}
.ff-story-tools>p{font:14px/1.7 var(--sans);color:#7b906f;margin:0 0 23px}
.ff-story-themes{padding:0;margin:25px 0;border:0;display:flex;gap:10px}
.ff-story-themes legend{font:500 13px var(--sans);color:#4d6b45;margin-bottom:12px}
.ff-story-themes label{display:block;flex:1;cursor:pointer}
.ff-story-themes input{position:absolute;opacity:0;pointer-events:none}
.ff-story-themes span{display:block;border:1px solid #c1d1b8;background:#f8f9ef;border-radius:7px;padding:13px;text-align:center;font:500 14px var(--sans);color:#718e63}
.ff-story-themes input:checked+span{background:#2d553a;border-color:#2d553a;color:#f0f5e6}
.ff-story-themes input:focus-visible+span{outline:3px solid #7fe3cf;outline-offset:3px}
.ff-story-tools .form-field>span{color:#4c6946;font-size:13px}.ff-story-tools .form-field small{font-weight:400;color:#8a9b7c;margin-left:5px}
.ff-story-tools textarea{background:#fafaf1;color:#2d4e34;border:1px solid #c4d3b8;border-radius:7px;font:15px/1.6 var(--sans);padding:13px;resize:vertical}
.ff-story-name{display:flex;align-items:center;gap:10px;font:13px var(--sans);color:#5e7a52;margin:18px 0 25px;cursor:pointer;min-height:34px}
.ff-story-name input{height:18px;width:18px;accent-color:#356c49}
.ff-story-tools .btn{border-radius:7px;font:500 14px var(--sans);padding:14px;min-height:48px;margin-top:10px}
.ff-story-tools .btn.mint{background:#7fe3cf;color:#173f30;border:0}
.ff-story-tools .btn.outline{background:transparent;color:#4d7448;border-color:#b7ceb0}
.ff-story-tools .btn:disabled{opacity:.45;cursor:wait}
.ff-story-tools .subtle-link{font:13px var(--sans);color:#658b5b;margin-top:20px;min-height:36px}
.ff-story-tools .ff-story-share-status{font-size:12px;color:#457642;margin-top:17px;margin-bottom:12px;min-height:18px}
.ff-story-tools .ff-story-help{font-size:12px;line-height:1.8;color:#899b79;margin-bottom:0}
.progress-share-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:flex-end}.progress-share-actions>button{font:13px var(--sans)}
#training-progress .progress-share-actions [data-story]{color:#396442}
.saved-card-actions [data-story]{background:#7fe3cf;color:#173f30;border:0}
#modal .badge-detail [data-story]{margin-top:15px}.mission-result .result-actions [data-story]{font-size:14px;color:#bdedcc}
@media(max-width:700px){#modal.ff-story-modal{padding:24px 19px;width:calc(100vw - 16px);max-height:96dvh;border-radius:13px}#modal.ff-story-modal .modal-heading h2{font-size:24px;max-width:240px}.ff-story-editor{grid-template-columns:1fr;gap:20px}.ff-story-preview-wrap{padding:15px}.ff-story-preview{max-width:220px}.ff-story-preview-wrap>span{font-size:7px;margin-top:14px}.ff-story-tools{padding:8px 3px}.ff-story-tools h3{font-size:32px;margin-top:14px}.ff-story-tools>p{font-size:14px}.ff-story-tools .btn{font-size:15px;min-height:51px}.progress-share-actions{align-items:flex-end;flex-direction:column;gap:4px;max-width:105px;flex-shrink:0}.progress-share-actions>button{font-size:11px;text-align:right;min-height:33px}}

/* Keep posting controls visible while the preview and options scroll. */
#modal.ff-story-modal[open]{display:flex;flex-direction:column;overflow:hidden}
#modal.ff-story-modal>.modal-heading{flex-shrink:0}
.ff-story-editor{grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:0;overflow:auto;overscroll-behavior:contain;flex:1;padding-bottom:16px}
.ff-story-preview-wrap,.ff-story-tools{min-width:0}
.ff-story-themes label{position:relative}
.ff-story-themes input{width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip-path:inset(50%)}
.ff-story-bottom{flex-shrink:0;padding:17px 0 0;border-top:1px solid #c8d4bd;background:#efeee8}
.ff-story-bottom>div{display:flex;gap:12px}
.ff-story-bottom .btn{border-radius:7px;font:500 14px/1.4 var(--sans);padding:14px;min-height:49px;flex:1;width:auto}
.ff-story-bottom .btn.mint{background:#7fe3cf;color:#173f30;border:0}
.ff-story-bottom .btn.outline{background:transparent;color:#4d7448;border-color:#b7ceb0}
.ff-story-bottom .btn:disabled{opacity:.45;cursor:wait}
.ff-story-bottom .ff-story-share-status{font:12px/1.6 var(--sans);color:#457642;margin:10px 0 0;min-height:19px}
@media(max-width:700px){.ff-story-editor{grid-template-columns:minmax(0,1fr);padding-bottom:20px}.ff-story-preview{max-width:170px}.ff-story-bottom{padding-top:13px}.ff-story-bottom>div{gap:8px}.ff-story-bottom .btn{font-size:13px;min-height:51px;padding:12px 10px}.ff-story-bottom .btn.mint{flex:1.35}.ff-story-bottom .ff-story-share-status{font-size:11px}}
