#social-media{--sm-line:#E4E4E9;--sm-muted:#5C5C66}
.sm-intro{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(220px,1fr);gap:40px;margin:32px 0}
.sm-intro h2{font-size:36px;line-height:1.3;font-weight:600;letter-spacing:-.03em}.sm-intro p{margin-top:16px;color:var(--sm-muted);line-height:1.85}.sm-intro aside{border-left:2px solid #FF8200;padding-left:24px;align-self:end}.sm-intro aside b{display:block;font-size:16px}.sm-intro aside p{font-size:13px;margin-top:8px}
.sm-jump{display:flex;gap:24px;flex-wrap:wrap;padding:16px 0;border-block:1px solid var(--sm-line);margin-bottom:32px}.sm-jump a{font-size:13px;min-height:44px;display:flex;align-items:center;text-decoration:underline;text-underline-offset:5px}
.sm-module{margin-top:48px;scroll-margin-top:120px}.sm-module>h3{font-size:24px;font-weight:600;line-height:1.4}.sm-module>p{color:var(--sm-muted);margin-top:12px;line-height:1.8}
.sm-reference{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}.sm-reference figure{margin:0;min-width:0}.sm-reference img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain}.sm-reference figcaption{padding-top:14px;font-size:13px;color:var(--sm-muted);line-height:1.8}.sm-reference b{display:block;font-size:15px;color:#131316;margin-bottom:5px}
.sm-types{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0}.sm-types button{padding:10px 18px;min-height:44px;border:1px solid #CFCFD6;background:#FFFFFF;border-radius:24px;color:#34343B;font-size:13px}.sm-types button[aria-pressed=true]{background:#0B0B0B;color:white;border-color:#0B0B0B}.sm-types button:hover{background:#E4E4E9;color:#131316}.sm-types button[aria-pressed=true]:hover{background:#34343B;color:#FFFFFF}
.sm-workbench{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(260px,1fr);gap:28px;align-items:start}.sm-stage{background:#E4E4E9;padding:20px;min-width:0;display:grid;place-items:center;position:relative}.sm-stage canvas{width:100%;height:auto;display:block;max-height:680px;object-fit:contain}.sm-stage[data-portrait=true] canvas{width:auto;max-width:100%;max-height:680px;height:auto}.sm-stage[data-portrait=true]{min-height:440px}.sm-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-top:14px}.sm-toolbar label{display:flex;align-items:center;gap:8px;font-size:13px;min-height:44px}.sm-toolbar input{accent-color:#FF8200;width:18px;height:18px}.sm-toolbar select{padding:8px 36px 8px 12px;min-height:44px;border:1px solid #CFCFD6;border-radius:6px;background:#FFFFFF;font-size:13px}.sm-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.sm-actions .site-btn{min-height:44px;font-size:13px;padding-inline:18px}.sm-caption{color:var(--sm-muted);font-size:12px;line-height:1.8;margin-top:14px}.sm-status{font-size:13px;min-height:24px;margin-top:10px;color:#34343B}.sm-status[data-error=true]{color:#A93232}
.sm-brief h4{font-size:20px;line-height:1.4;font-weight:600}.sm-brief>p{color:var(--sm-muted);margin-top:12px;font-size:13px;line-height:1.85}.sm-brief dl{margin:20px 0 0}.sm-brief dl>div{border-top:1px solid var(--sm-line);padding:12px 0}.sm-brief dt{font-size:12px;color:var(--sm-muted);margin-bottom:5px}.sm-brief dd{font-size:13px;margin:0;line-height:1.8}.sm-brief a{text-decoration:underline;text-underline-offset:4px}
.sm-prompt-panel{margin-top:24px;border:1px solid #CFCFD6;border-radius:8px;padding:18px 20px}.sm-prompt-panel summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:600}.sm-prompt-panel pre,.sm-template{white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal;font-family:var(--ox-font);font-size:13px;line-height:1.9;color:#34343B;margin:16px 0}.sm-prompt-panel .site-btn{min-height:44px;font-size:13px}.sm-prompt-meta{font-size:12px;color:var(--sm-muted);line-height:1.8;padding-top:16px;border-top:1px solid var(--sm-line)}
.sm-table{margin-top:24px}.sm-table table{width:100%;border-collapse:collapse;font-size:13px;line-height:1.8}.sm-table th,.sm-table td{text-align:left;vertical-align:top;padding:14px 16px;border-bottom:1px solid var(--sm-line)}.sm-table th{font-weight:600;background:#F7F7F7}.sm-table td:first-child{font-weight:600}.sm-table caption{text-align:left;font-size:15px;font-weight:600;padding-bottom:12px}.sm-table code{font-size:12px;overflow-wrap:anywhere}.sm-table-wrap{overflow-x:auto}
.sm-sequence{list-style:none;padding:0;counter-reset:sm-step;margin:24px 0 0}.sm-sequence li{counter-increment:sm-step;display:grid;grid-template-columns:36px minmax(0,1fr);gap:16px;padding:20px 0;border-top:1px solid var(--sm-line)}.sm-sequence li:before{content:counter(sm-step,decimal-leading-zero);color:#6E6E79;font-size:13px}.sm-sequence b{display:block;font-size:15px}.sm-sequence p{margin-top:6px;color:var(--sm-muted);font-size:13px;line-height:1.85}
.sm-template{background:#F7F7F7;border-left:3px solid #FF8200;padding:24px}.sm-notes{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:24px}.sm-notes>div{border-top:1px solid var(--sm-line);padding-top:18px}.sm-notes h4{font-size:16px;font-weight:600}.sm-notes p{margin-top:8px;color:var(--sm-muted);font-size:13px;line-height:1.85}.sm-footer-links{display:flex;gap:24px;flex-wrap:wrap;margin-top:24px}.sm-footer-links a{font-size:13px;text-decoration:underline;text-underline-offset:4px;min-height:44px;display:flex;align-items:center}
@media(max-width:1000px){.sm-workbench{grid-template-columns:1fr}.sm-brief dl{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}}
@media(max-width:767px){.sm-intro{grid-template-columns:1fr;gap:24px}.sm-intro h2{font-size:28px}.sm-intro aside{padding-left:16px}.sm-reference,.sm-notes{grid-template-columns:1fr;gap:24px}.sm-brief dl{display:block}.sm-module{margin-top:36px}.sm-module>h3{font-size:21px}.sm-stage{padding:12px}.sm-stage canvas{max-height:600px}.sm-stage[data-portrait=true] canvas{max-height:600px}.sm-stage[data-portrait=true]{min-height:0}.sm-prompt-panel{padding:12px 16px}.sm-types button{padding:10px 14px}.sm-table th,.sm-table td{padding:12px;min-width:140px}.sm-table td:first-child,.sm-table th:first-child{min-width:112px}.sm-jump{gap:8px 24px}.sm-template{padding:16px}.sm-toolbar{align-items:flex-start}.sm-caption{font-size:12px}}
@media print{.sm-types,.sm-actions,.sm-toolbar,.sm-prompt-panel button,.sm-jump{display:none}.sm-workbench{display:block}.sm-stage{background:none}.sm-module{break-inside:avoid}.sm-stage canvas{max-height:500px}.sm-reference{grid-template-columns:1fr 1fr}.sm-prompt-panel{border-color:#CFCFD6}}

.sm-ip-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:24px}.sm-ip-gallery figure{margin:0}.sm-ip-gallery img{display:block;width:100%;height:240px;object-fit:contain;background:#F4F4F6}.sm-ip-gallery figcaption{font-size:15px;line-height:1.6;margin-top:8px}.sm-ip-gallery a{text-decoration:underline}.sm-intro h2,.sm-module>h3,.sm-brief h4,.sm-notes h4{font-weight:800}@media(max-width:767px){.sm-ip-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.sm-ip-gallery img{height:180px}}

.sm-copy-editor{margin:20px 0;padding:20px;border:1px solid #CFCFD6;border-radius:8px}.sm-copy-editor h4{font-size:18px;font-weight:800}.sm-copy-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:14px}.sm-copy-fields label{font-size:15px;font-weight:600}.sm-copy-fields textarea{display:block;width:100%;box-sizing:border-box;margin-top:8px;padding:12px;border:1px solid #CFCFD6;border-radius:6px;font:16px/1.5 var(--ox-font);resize:vertical}.sm-copy-editor p{font-size:14px;line-height:1.7;margin-top:12px;color:#5C5C66}@media(max-width:767px){.sm-copy-fields{grid-template-columns:1fr}}
.sm-adapt-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;margin-top:24px}.sm-adapt-grid>div{min-width:0}.sm-adapt-grid label{display:block;font-size:14px;font-weight:600;margin:18px 0 8px}.sm-adapt-grid input,.sm-adapt-grid select,.sm-adapt-grid textarea{display:block;box-sizing:border-box;width:100%;min-height:44px;padding:12px;border:1px solid #CFCFD6;border-radius:6px;background:#FFF;font:14px/1.6 var(--ox-font);color:#131316}.sm-adapt-grid select{padding-right:36px}.sm-adapt-grid textarea{resize:vertical}.sm-adapt-grid input[type=file]{font-size:13px}.sm-adapt-grid input:focus-visible,.sm-adapt-grid select:focus-visible,.sm-adapt-grid textarea:focus-visible{outline:1px solid var(--ox-focus,#9B9BA6);outline-offset:3px}.sm-adapt-grid figure{margin:16px 0}.sm-adapt-grid figure img{display:block;max-width:100%;max-height:300px;object-fit:contain;margin-inline:auto}.sm-adapt-grid figcaption{font-size:12px;overflow-wrap:anywhere;margin-top:8px;color:#5C5C66}.sm-adapt-grid .site-btn{font-size:13px;min-height:44px}.sm-adapt-grid #sm-adapt-current{margin-top:16px}.sm-prompt-panel[hidden],.sm-adapt-grid [hidden]{display:none!important}
@media(max-width:767px){.sm-adapt-grid{grid-template-columns:1fr;gap:12px}}

/* A focused workspace: preview first, production detail on demand. */
#social-media .sm-module[hidden],.sm-types-legacy[hidden]{display:none!important}
#social-media .sm-module{margin-top:36px}
.sm-jump{gap:24px;margin:24px 0 36px;padding:0;border-top:0;border-bottom:1px solid var(--sm-line)}
.sm-jump :is(a,button){position:relative;display:inline-flex;align-items:center;min-height:48px;padding:12px 0;border:0;border-radius:0;background:transparent;font:600 14px/1.5 var(--ox-font);color:#6E6E79;text-decoration:none;cursor:pointer}
.sm-jump :is(a,button):hover{color:#131316;background:transparent}
.sm-jump [aria-selected=true]{color:#131316}
.sm-jump [aria-selected=true]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#131316}
.sm-jump :is(a,button):focus-visible,.sm-sample-control select:focus-visible,.sm-more-link:focus-visible{outline:1px solid var(--ox-focus,#9B9BA6);outline-offset:3px}
.sm-panel-header{margin-bottom:16px}
.sm-panel-header h3{margin:0;font-size:24px;font-weight:800;line-height:1.4}
.sm-panel-header p{margin:8px 0 0;font-size:14px;line-height:1.7;color:var(--sm-muted)}
.sm-sample-control{min-width:0;font-size:12px;line-height:1.5;color:var(--sm-muted)}
.sm-sample-control select{box-sizing:border-box;width:100%;min-height:44px;padding:10px 36px 10px 12px;border:1px solid #CFCFD6;border-radius:6px;background:#FFF;color:#131316;font:14px/1.5 var(--ox-font)}
.sm-workbench{grid-template-columns:minmax(0,2.2fr) minmax(250px,1fr);grid-template-areas:"toolbar ." "preview case";gap:16px 24px;align-items:start}
.sm-preview-column{grid-area:preview;min-width:0}
.sm-toolbar{grid-area:toolbar;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,220px) auto;margin:0;gap:16px;align-items:center}
.sm-toolbar label{min-width:0;min-height:44px;gap:8px;font-size:13px;color:#5C5C66;white-space:nowrap}
.sm-toolbar select{box-sizing:border-box;min-width:0;width:100%;height:44px;font:14px/1.5 var(--ox-font);max-width:100%;background:#FFF}
.sm-toolbar .sm-guide-switch{white-space:nowrap}
.sm-stage{padding:16px;background:#F4F4F6}
.sm-stage canvas{width:100%;height:auto;max-height:none}
.sm-stage[data-portrait=true]{min-height:0}
.sm-stage[data-portrait=true] canvas{width:auto;max-width:100%;height:auto;max-height:660px}
.sm-preview-column>.sm-status{min-height:20px;margin:8px 0 0;font-size:12px;line-height:1.6;color:#6E6E79}
.sm-case-panel{grid-area:case;min-width:0;padding-top:0;position:sticky;top:24px}
.sm-case-panel>h4{margin:0;font-size:20px;line-height:1.45;font-weight:800;letter-spacing:-.02em}
.sm-sample-meta{margin:8px 0 0;font-size:12px;line-height:1.7;color:#6E6E79;font-variant-numeric:tabular-nums}
.sm-case-intro{margin:16px 0 0;font-size:13px;line-height:1.7;color:#5C5C66}
.sm-primary-actions{display:grid;gap:12px;margin:24px 0}
.sm-primary-actions .site-btn{display:flex;justify-content:center;align-items:center;box-sizing:border-box;width:100%;min-height:44px;padding:12px 16px;font-size:14px}
.sm-side-panel,.sm-side-panel.sm-copy-editor{margin:0;padding:16px 0;border:0;border-top:1px solid var(--sm-line);border-radius:0;background:transparent}
.sm-side-panel>summary,.sm-technical>summary,.sm-inspect-panel>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:32px;font-size:13px;font-weight:600;line-height:1.6;color:#34343B;cursor:pointer;list-style:none}
.sm-side-panel>summary::after,.sm-technical>summary::after,.sm-inspect-panel>summary::after{content:"";width:7px;height:7px;flex:none;border-right:1.5px solid #6E6E79;border-bottom:1.5px solid #6E6E79;transform:rotate(45deg);transition:transform 160ms ease}
.sm-side-panel[open]>summary::after,.sm-technical[open]>summary::after,.sm-inspect-panel[open]>summary::after{transform:rotate(225deg)}
.sm-side-panel>summary::-webkit-details-marker,.sm-technical>summary::-webkit-details-marker,.sm-inspect-panel>summary::-webkit-details-marker{display:none}
.sm-side-panel>summary:focus-visible,.sm-technical>summary:focus-visible,.sm-inspect-panel>summary:focus-visible{outline:1px solid var(--ox-focus,#9B9BA6);outline-offset:3px}
.sm-side-panel .sm-copy-fields{grid-template-columns:1fr;gap:16px;margin-top:16px}
.sm-side-panel .sm-copy-fields label{font-size:13px}
.sm-copy-field{min-width:0}.sm-copy-fields .sm-copy-field>label{display:block}.sm-copy-fields .sm-copy-field textarea{min-height:48px;font-size:14px}.sm-copy-fields .sm-copy-field input{box-sizing:border-box;width:100%;min-height:44px;padding:10px 12px;border:1px solid #CFCFD6;border-radius:6px;background:#FFF;color:#131316;font:14px/1.5 var(--ox-font)}.sm-copy-fields .sm-highlight-label{margin:10px 0 6px;font-size:12px;font-weight:400;color:#6E6E79}.sm-copy-fields :is(textarea,input):hover{border-color:#A8A8B2}.sm-copy-fields :is(textarea,input):focus-visible{outline:1px solid var(--ox-focus,#9B9BA6);outline-offset:3px}.sm-copy-fields [aria-invalid=true]{border-color:#C88C8C}.sm-field-error{display:block;margin-top:6px;font-size:12px;line-height:1.7;color:#A93232}.sm-field-error[hidden],.sm-small-copy[hidden]{display:none}.sm-small-copy{margin-top:20px;border-top:1px solid var(--sm-line);padding-top:8px}.sm-small-copy>summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-size:13px;color:#5C5C66}.sm-small-copy>summary::after{content:'+';margin-left:auto;font-size:18px}.sm-small-copy[open]>summary::after{content:'−'}#sm-edit-status[data-error=true]{color:#A93232}
.sm-side-panel.sm-copy-editor>p,.sm-case-analysis>p{margin:16px 0 0;font-size:12px;line-height:1.8;color:#5C5C66}
.sm-case-analysis dl{margin:16px 0 0}
.sm-case-analysis dl>div{padding:12px 0;border-top:1px solid var(--sm-line)}
.sm-case-analysis dt{margin-bottom:4px;font-size:12px;line-height:1.6;color:#6E6E79}
.sm-case-analysis dd{margin:0;font-size:13px;line-height:1.8;color:#34343B}
.sm-secondary-actions{display:grid;gap:0;margin-top:8px}
.sm-more-link{display:flex;align-items:center;box-sizing:border-box;min-height:44px;width:100%;padding:8px 0;border:0;background:none;color:#5C5C66;text-align:left;text-decoration:none;font:13px/1.7 var(--ox-font);cursor:pointer}
.sm-more-link:hover{color:#131316;text-decoration:underline;text-underline-offset:4px}
.sm-more-link:disabled{opacity:.45;cursor:wait}
.sm-technical{margin-top:36px;border-top:1px solid var(--sm-line)}
.sm-technical>summary{min-height:60px;font-size:14px}
.sm-technical-content{padding-bottom:24px}
.sm-rule-list{display:grid;grid-template-columns:1fr 1fr;gap:24px;list-style:none;padding:16px 0 24px;margin:0}
.sm-rule-list li{display:grid;gap:8px;min-width:0}
.sm-rule-list b{font-size:13px;font-weight:600;line-height:1.6}
.sm-rule-list span{font-size:13px;line-height:1.8;color:#5C5C66}
.sm-inspect-panel{margin:0;padding:16px 0;border:0;border-top:1px solid var(--sm-line)}
.sm-inspect-panel pre{max-height:420px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;margin:16px 0;padding:16px;border-radius:6px;background:#F7F7F7;color:#34343B;font:13px/1.85 var(--ox-font)}
.sm-inspect-panel .site-btn{min-height:44px;font-size:13px}
.sm-inspect-panel .sm-table{margin-top:16px}
.sm-prompt-panel{margin-top:24px;padding:16px 0;border:0;border-top:1px solid var(--sm-line);border-radius:0}
@media(max-width:1100px){.sm-workbench{grid-template-columns:minmax(0,1fr);grid-template-areas:"toolbar" "preview" "case"}.sm-case-panel{position:static;padding-top:0}.sm-primary-actions{grid-template-columns:1fr 1fr}.sm-side-panel .sm-copy-fields{grid-template-columns:1fr 1fr}}
@media(max-width:767px){.sm-panel-header h3{font-size:21px}.sm-workbench{row-gap:16px}.sm-sample-control select{font-size:16px}.sm-toolbar{grid-template-columns:minmax(0,1fr) auto;gap:12px 16px}.sm-toolbar .sm-sample-control{grid-column:1/-1}.sm-toolbar .sm-mode-control{grid-column:1}.sm-toolbar .sm-guide-switch{grid-column:2}.sm-toolbar label{font-size:12px}.sm-toolbar select{padding-left:10px;font-size:16px}.sm-stage{padding:12px}.sm-stage[data-portrait=true] canvas{max-height:560px}.sm-case-panel{margin-top:8px}.sm-case-panel>h4{font-size:19px}.sm-primary-actions{gap:12px;margin:24px 0}.sm-primary-actions .site-btn{font-size:13px;padding:12px 10px}.sm-side-panel .sm-copy-fields,.sm-rule-list{grid-template-columns:1fr}.sm-rule-list{gap:16px}.sm-jump{gap:16px;margin-bottom:24px}.sm-jump :is(a,button){font-size:13px}.sm-inspect-panel pre{padding:12px}}
@media(prefers-reduced-motion:reduce){.sm-side-panel>summary::after,.sm-technical>summary::after,.sm-inspect-panel>summary::after{transition:none}}

#sm-adapt-result[hidden],#sm-adapt-cancel[hidden]{display:none!important}#sm-adapt-result h4{font-size:18px;font-weight:800}#sm-adapt-result pre{max-height:440px;overflow:auto}.sm-adapt-grid button:disabled{cursor:progress;opacity:.7}

/* One task at a time; the original typography and buttons remain. */
#social-media .sm-intro{grid-template-columns:1fr}.sm-module[hidden]{display:none!important}#social-media .sm-jump{gap:28px;border-top:0;margin:24px 0 32px;padding:0}.sm-jump [role=tab]{border:0;border-bottom:2px solid transparent;background:transparent;border-radius:0;color:#6E6E79;padding:14px 0;min-height:48px;font:600 15px/1.5 var(--ox-font);cursor:pointer}.sm-jump [role=tab][aria-selected=true]{color:#131316;border-bottom-color:#FF8200}.sm-jump [role=tab]:hover{color:#131316}.sm-jump [role=tab]:focus-visible{outline:1px solid var(--ox-focus,#9B9BA6);outline-offset:4px}.sm-module{margin-top:0}.sm-prompt-card{margin-top:24px;background:#F7F7F7;border:1px solid #E4E4E9;border-radius:8px;padding:24px}.sm-prompt-card-head{display:flex;align-items:start;justify-content:space-between;gap:20px}.sm-prompt-card h4{font-size:18px;font-weight:800;line-height:1.5}.sm-prompt-card-head p{font-size:13px;color:#6E6E79;margin-top:4px}.sm-prompt-card pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:430px;overflow:auto;font:14px/1.85 var(--ox-font);margin:20px 0 0}.sm-prompt-card .sm-prompt-panel{margin-top:20px}#sm-reference-quality{margin-top:24px}#sm-reference-quality>h4{font-size:16px}#sm-reference-quality>p{font-size:13px;line-height:1.8;color:#5C5C66;margin-top:8px}.sm-direction-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:24px}.sm-direction-gallery figure{min-width:0;margin:0}.sm-direction-gallery img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:#17191C}.sm-direction-gallery figcaption{font-size:13px;line-height:1.7;margin-top:12px;color:#5C5C66}.sm-direction-gallery figcaption b{display:block;font-size:14px;color:#131316}.sm-direction-gallery button{margin-top:12px}.sm-motion-references img{max-height:260px;object-fit:contain}.sm-direction-gallery pre{white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.7 var(--ox-font);max-height:260px;overflow:auto}.sm-direction-gallery details{margin-top:12px}.sm-direction-gallery summary{cursor:pointer;font-size:13px;min-height:44px;display:flex;align-items:center}
@media(max-width:767px){#social-media .sm-jump{gap:20px;margin-bottom:24px}.sm-jump [role=tab]{font-size:13px;white-space:nowrap}.sm-prompt-card{padding:16px}.sm-prompt-card-head{display:grid;gap:12px}.sm-prompt-card-head .site-btn{justify-self:start}.sm-prompt-card pre{font-size:13px;max-height:450px}.sm-direction-gallery{grid-template-columns:1fr;gap:24px}}

.sm-direction-heading{margin-top:32px}.sm-direction-heading h4{font-size:18px;font-weight:800}.sm-direction-heading p{font-size:13px;line-height:1.8;color:#5C5C66;margin-top:8px}.sm-direction-gallery a{font-size:13px;line-height:1.8;text-decoration:underline;text-underline-offset:4px}
.sm-direction-gallery figcaption{min-height:68px}
@media(max-width:767px){.sm-direction-gallery figcaption{min-height:0}}

/* Preview and inspector share one viewport-sized working area. */
#sm-samples .sm-panel-header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}
.sm-header-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.sm-header-actions .site-btn{min-height:44px;padding:10px 18px;font-size:13px}
#sm-base-file[hidden],.sm-inspector-panel[hidden]{display:none!important}
#sm-samples .sm-workbench{--sm-preview-height:clamp(360px,calc(100dvh - 280px),620px);container-type:inline-size;grid-template-columns:minmax(0,1fr) minmax(280px,320px);column-gap:24px;row-gap:16px}
#sm-samples .sm-workbench:has(#sm-canvas[width="1920"][height="1080"]){--sm-preview-height:clamp(360px,calc((100cqw - 376px)*.5625 + 32px),min(620px,calc(100dvh - 280px)))}
#sm-samples .sm-stage{box-sizing:border-box;height:var(--sm-preview-height);min-height:0;padding:16px;overflow:hidden;border-radius:6px}
#sm-samples .sm-stage canvas,#sm-samples .sm-stage[data-portrait=true] canvas{width:auto;height:auto;max-width:100%;max-height:calc(var(--sm-preview-height) - 32px);object-fit:contain}
.sm-stage[data-dragging=true]{outline:1px solid var(--ox-focus,#9B9BA6);outline-offset:-2px;cursor:copy}
.sm-stage[data-dragging=true] canvas{cursor:copy}
.sm-preview-hint{margin:10px 0 0;font-size:12px;line-height:1.6;color:#6E6E79}
#sm-samples .sm-case-panel{position:static;display:flex;flex-direction:column;box-sizing:border-box;height:var(--sm-preview-height);max-height:var(--sm-preview-height);min-height:0;padding-left:24px;border-left:1px solid var(--sm-line);overflow:hidden}
.sm-inspector-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin-top:20px;flex-shrink:0;border-bottom:1px solid var(--sm-line)}
.sm-inspector-tabs [role=tab]{min-height:44px;padding:10px 8px;border:0;border-bottom:2px solid transparent;background:transparent;color:#6E6E79;font:600 13px/1.5 var(--ox-font);cursor:pointer}
.sm-inspector-tabs [role=tab]:hover{color:#131316;background:#F7F7F7}
.sm-inspector-tabs [role=tab][aria-selected=true]{color:#131316;border-bottom-color:#FF8200}
.sm-inspector-tabs [role=tab]:focus-visible{outline:1px solid var(--ox-focus,#9B9BA6);outline-offset:-3px}
.sm-inspector-body{min-height:0;flex:1;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;padding-right:8px;margin-top:16px;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#CFCFD6 transparent}
.sm-inspector-body::-webkit-scrollbar{width:6px}
.sm-inspector-body::-webkit-scrollbar-thumb{background:#CFCFD6;border-radius:6px}
.sm-inspector-body::-webkit-scrollbar-track{background:transparent}
.sm-inspector-panel{min-width:0;padding-bottom:12px}
.sm-inspector-panel h5{margin:0;font-size:13px;font-weight:600;line-height:1.6;color:#34343B}
.sm-inspector-panel .sm-copy-editor{margin:0;padding:0;border:0;border-radius:0;background:transparent}
.sm-inspector-panel .sm-copy-editor>p{margin:8px 0 0;font-size:12px;line-height:1.7;color:#6E6E79}
.sm-inspector-panel .sm-copy-fields{grid-template-columns:1fr;gap:16px;margin-top:16px}
.sm-inspector-panel .sm-copy-fields label{font-size:13px}
.sm-inspector-panel .sm-copy-fields textarea{font-size:14px;min-height:48px}
.sm-inspector-panel #sm-edit-status{padding-top:12px;border-top:1px solid var(--sm-line);margin-top:20px}
.sm-inspector-panel .sm-side-panel{margin-top:12px;padding-top:16px}
.sm-inspector-panel .sm-case-analysis>p{margin-top:8px}
.sm-inspector-panel .sm-case-analysis dl{margin-top:12px}
.sm-base-preview{margin:0 0 20px}
.sm-base-preview img{display:block;width:100%;height:156px;object-fit:contain;border-radius:4px;background:#F4F4F6}
.sm-base-preview figcaption{font-size:12px;line-height:1.7;color:#6E6E79;overflow-wrap:anywhere;margin-top:8px}
.sm-base-controls{display:grid;grid-template-columns:minmax(0,1fr);min-width:0}
.sm-base-controls>label{font-size:13px;font-weight:600;line-height:1.6;margin:18px 0 6px}
.sm-base-controls>label:first-child{margin-top:0}
.sm-base-controls select{box-sizing:border-box;display:block;width:100%;min-height:44px;padding:10px 36px 10px 12px;border:1px solid #CFCFD6;border-radius:6px;background:#FFF;color:#131316;font:14px/1.5 var(--ox-font)}
.sm-base-controls select:hover{border-color:#A8A8B2}
.sm-base-controls :is(select,input):focus-visible{outline:1px solid var(--ox-focus,#9B9BA6);outline-offset:3px}
.sm-base-controls input[type=range]{box-sizing:border-box;width:100%;height:32px;margin:0;accent-color:#FF8200;cursor:pointer}
.sm-range-label{display:flex;justify-content:space-between;align-items:center;gap:12px}
.sm-range-label output{font-size:12px;font-weight:400;color:#6E6E79;font-variant-numeric:tabular-nums}
.sm-control-note{font-size:12px;line-height:1.7;margin:8px 0 0;color:#6E6E79}
#sm-base-reset{margin-top:16px;border-top:1px solid var(--sm-line);padding-top:12px}
#sm-base-status{margin-top:8px;font-size:12px;line-height:1.7}
@media(max-width:1100px){
  #sm-samples .sm-workbench{grid-template-columns:minmax(0,1fr);grid-template-areas:"toolbar" "preview" "case"}
  #sm-samples .sm-stage{height:auto;max-height:none}
  #sm-samples .sm-stage canvas{width:100%;max-height:660px}
  #sm-samples .sm-stage[data-portrait=true] canvas{width:auto;max-height:600px}
  #sm-samples .sm-case-panel{height:auto;max-height:none;overflow:visible;padding:24px 0 0;border-left:0;border-top:1px solid var(--sm-line)}
  .sm-inspector-body{overflow:visible;padding-right:0;overscroll-behavior-y:auto}
  .sm-inspector-panel .sm-copy-fields{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sm-base-preview img{height:220px}
}
@media(max-width:767px){
  #sm-samples .sm-panel-header{gap:12px;align-items:flex-start;flex-wrap:wrap}
  #sm-samples .sm-panel-header h3{align-self:center}
  .sm-header-actions{gap:8px}
  .sm-header-actions .site-btn{font-size:12px;padding-inline:14px}
  #sm-samples .sm-stage{padding:12px}
  #sm-samples .sm-stage canvas,#sm-samples .sm-stage[data-portrait=true] canvas{max-height:560px}
  .sm-inspector-panel .sm-copy-fields{grid-template-columns:minmax(0,1fr)}
  .sm-inspector-panel .sm-copy-fields :is(textarea,input),.sm-base-controls select{font-size:16px}
  .sm-base-preview img{height:180px}
  .sm-inspector-tabs{margin-top:16px}
}
@media print{
  .sm-header-actions,.sm-preview-hint,.sm-inspector-tabs,.sm-inspector-body{display:none}
  #sm-samples .sm-stage{height:auto}
  #sm-samples .sm-case-panel{height:auto;max-height:none;border:0;padding:0}
}
/* The creation centre uses the available workspace, not a document page. */
.spec-mode-generation #social-media .sheet-top{display:none}
.spec-mode-generation #social-media .sm-intro{margin:0 0 12px}
.spec-mode-generation #social-media .sm-intro h2{font-size:26px;line-height:1.4;letter-spacing:-.02em}
.spec-mode-generation #social-media .sm-intro p{margin:6px 0 0;font-size:13px;line-height:1.7}
.spec-mode-generation #social-media .sm-jump{gap:28px;margin:12px 0 20px}
.spec-mode-generation #social-media .sm-module{margin:0}
.sm-tool-heading{display:flex;align-items:baseline;gap:16px;margin-bottom:18px}
.sm-tool-heading h3{flex:none;font-size:20px;font-weight:800;line-height:1.5}
.sm-tool-heading p{margin:0;color:#6E6E79;font-size:12px;line-height:1.7}
.sm-gen-workspace{--sm-gen-height:clamp(540px,calc(100dvh - 238px),860px);display:grid;grid-template-columns:minmax(300px,350px) minmax(0,1fr);min-width:0;gap:24px;align-items:stretch}
.sm-generation-form{display:flex;flex-direction:column;min-width:0;height:var(--sm-gen-height);border:1px solid #E4E4E9;border-radius:8px;overflow:hidden;background:#FFF}
.sm-gen-settings{min-height:0;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin;scrollbar-gutter:stable;padding:20px}
.sm-generation-form label{display:block;margin:0 0 7px;color:#34343B;font-size:13px;line-height:1.6;font-weight:600}
.sm-generation-form :is(textarea,select){display:block;box-sizing:border-box;width:100%;min-width:0;min-height:44px;padding:10px 12px;border:1px solid #CFCFD6;border-radius:6px;background:#FFF;color:#131316;font:14px/1.6 var(--ox-font)}
.sm-generation-form select{padding-right:36px}.sm-generation-form textarea{resize:vertical;min-height:88px}
.sm-generation-form :is(textarea,select):hover{border-color:#A8A8B2}.sm-generation-form :is(textarea,select):focus-visible{outline:1px solid var(--ox-focus,#9B9BA6);outline-offset:3px}
.sm-gen-options{display:grid;grid-template-columns:1fr 1fr;gap:16px 12px;margin:18px 0}.sm-gen-options>div{min-width:0}.sm-gen-options .sm-gen-wide{grid-column:1/-1}
.sm-gen-reference-drop{padding:12px;border:1px dashed #CFCFD6;border-radius:6px;background:#FAFAFB}.sm-gen-reference-drop>p:first-child{margin:0;font-size:12px;line-height:1.7;color:#6E6E79}.sm-gen-reference-drop[data-dragging=true]{border-color:#FF8200;background:#FFF8F0;outline:1px solid #FF8200}
.sm-generation-form .sm-reference-file{position:relative;display:flex;align-items:center;justify-content:center;min-height:44px;margin:10px 0 0;padding:8px 12px;border:1px solid #CFCFD6;border-radius:24px;background:#FFF;font-size:12px;cursor:pointer;overflow:hidden}
.sm-reference-file input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.sm-reference-file:focus-within{outline:1px solid var(--ox-focus,#9B9BA6);outline-offset:3px}
.sm-gen-reference-preview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}.sm-gen-reference-preview>div,.sm-gen-reference-preview figure{position:relative;min-width:0;margin:0}.sm-gen-reference-preview img{display:block;width:100%;height:72px;object-fit:contain;border:1px solid #E4E4E9;border-radius:5px;background:#F4F4F6}.sm-gen-reference-preview button{min-height:44px;min-width:44px;border:0;background:#F7F7F7;color:#34343B;border-radius:5px;cursor:pointer}.sm-gen-reference-preview figcaption{font-size:11px;line-height:1.5;color:#6E6E79;overflow-wrap:anywhere}
#sm-gen-build{width:100%;justify-content:center;min-height:44px;margin-top:16px;font-size:13px}.sm-gen-prompt-editor{margin-top:20px;padding-top:20px;border-top:1px solid #E4E4E9}.sm-gen-prompt-label{display:flex;align-items:center;justify-content:space-between;gap:12px}.sm-gen-prompt-label label{margin:0}.sm-gen-prompt-label .sm-more-link{width:auto;min-height:44px;padding:4px 0;font-size:12px}.sm-gen-prompt-editor .sm-control-note{margin:0 0 8px}#sm-gen-prompt{min-height:200px;font-size:13px}#sm-gen-model{margin-bottom:0}.sm-gen-prompt-editor>label{margin-top:16px}
.sm-gen-submit{flex:none;padding:12px 20px 16px;border-top:1px solid #E4E4E9;background:#FFF}.sm-gen-submit .sm-actions{margin:10px 0 0;display:flex;gap:8px}.sm-gen-submit #sm-gen-run{flex:1;justify-content:center;min-height:48px;font-size:15px;font-weight:700}.sm-gen-submit .sm-control-note{margin:0;line-height:1.6}.sm-gen-submit .sm-status{margin:8px 0 0;min-height:0;font-size:12px;line-height:1.6}.sm-gen-submit .site-btn:disabled{opacity:.55;cursor:not-allowed}
.sm-gen-preview{display:flex;min-width:0;min-height:0;height:var(--sm-gen-height);padding:20px;border:1px solid #E4E4E9;border-radius:8px;background:#F7F7F8;overflow:hidden}.sm-gen-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;min-width:0;text-align:center;padding:24px}.sm-gen-empty-symbol{width:64px;height:64px;color:#A8A8B2}.sm-gen-empty-symbol svg{display:block;width:100%;height:100%}.sm-gen-empty h4{margin:18px 0 0;font-size:18px;font-weight:600;color:#5C5C66}.sm-gen-empty p{margin:10px 0 0;font-size:13px;line-height:1.85;color:#8A8A95}.sm-gen-empty>span{margin-top:28px;font-size:12px;color:#8A8A95}.sm-gen-preview:has(#sm-gen-result:not([hidden])) .sm-gen-empty{display:none}
.sm-gen-result{display:flex;flex-direction:column;justify-content:center;width:100%;min-height:0;margin:0;gap:16px}.sm-gen-result>img{display:block;width:100%;height:100%;min-height:0;flex:1;object-fit:contain}.sm-gen-result figcaption{flex:none;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}.sm-gen-result h4{margin:0;font-size:15px;font-weight:700;line-height:1.6}.sm-gen-result figcaption p{margin:4px 0 0;font-size:12px;line-height:1.7;color:#6E6E79}.sm-gen-result .sm-actions{margin:0}.sm-gen-result .site-btn{min-height:44px;font-size:13px}
#sm-gen-result[hidden],#sm-gen-cancel[hidden],#sm-gen-reference-clear[hidden],#sm-gen-reference-preview[hidden],#sm-project-file[hidden]{display:none!important}
.sm-generation-help{margin-top:24px;border-top:1px solid #E4E4E9}.sm-generation-help>summary{display:flex;align-items:center;min-height:48px;cursor:pointer;font-size:13px;font-weight:600;color:#6E6E79}.sm-generation-help .sm-prompt-card{margin-top:8px}
.sm-layer-control{margin:16px 0 0}.sm-layer-control label{display:block;margin-bottom:6px;font-size:13px;font-weight:600}.sm-layer-control select{box-sizing:border-box;width:100%;min-height:44px;padding:10px 36px 10px 12px;border:1px solid #CFCFD6;border-radius:6px;background:#FFF;font:14px/1.5 var(--ox-font)}.sm-base-controls input[type=color]{width:100%;min-height:44px;padding:4px;border:1px solid #CFCFD6;border-radius:6px;background:#FFF}.sm-header-actions{flex-wrap:wrap}.sm-header-actions #sm-download{font-weight:700}#sm-project-status:empty{display:none}
.sm-library{--sm-muted:#5C5C66}.sm-library-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:8px 0 28px}.sm-library-heading h2{font-size:26px;font-weight:800;line-height:1.4}.sm-library-heading p{margin-top:6px;color:#6E6E79;font-size:13px;line-height:1.7}.sm-library-heading .site-btn{min-height:44px;flex:none}.sm-library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.sm-library-grid>*{min-width:0}.sm-library-grid img{display:block;width:100%;height:240px;object-fit:contain;background:#F4F4F6;border-radius:6px}.sm-library-grid figure{margin:0}.sm-library-grid figcaption{margin-top:12px;font-size:13px;line-height:1.7;color:#5C5C66}.sm-library-grid .sm-actions{margin-top:12px}.sm-library-grid .site-btn{min-height:44px;font-size:13px}.sm-library-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:360px;border:1px solid #E4E4E9;border-radius:8px;background:#F7F7F8;text-align:center;padding:24px}.sm-library-empty[hidden]{display:none!important}.sm-library-empty h3{font-size:20px;font-weight:600;color:#5C5C66}.sm-library-empty p{margin:10px 0 24px;font-size:13px;color:#8A8A95}.sm-library-empty .site-btn{min-height:44px;font-size:13px}
@media(min-width:1700px){.sm-gen-workspace{grid-template-columns:380px minmax(0,1fr)}.sm-library-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1100px){.sm-gen-workspace{grid-template-columns:310px minmax(0,1fr);gap:16px}.sm-gen-settings{padding:16px}.sm-gen-submit{padding:12px 16px 16px}.sm-gen-preview{padding:16px}.sm-library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){.sm-tool-heading{display:block;margin-bottom:16px}.sm-tool-heading h3{font-size:18px}.sm-tool-heading p{margin-top:6px}.sm-gen-workspace{display:flex;flex-direction:column;gap:20px}.sm-generation-form{height:auto;overflow:visible}.sm-gen-settings{overflow:visible;scrollbar-gutter:auto}.sm-gen-preview{height:440px;min-height:300px;padding:12px}.sm-gen-result figcaption{align-items:flex-start}.sm-gen-result .sm-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.sm-gen-result .site-btn{justify-content:center;padding-inline:10px}.sm-generation-form :is(textarea,select){font-size:16px}.sm-header-actions{display:grid;grid-template-columns:1fr 1fr;width:100%;gap:8px}.sm-header-actions .site-btn{justify-content:center;min-height:44px}.sm-layer-control select{font-size:16px}.sm-library-heading{align-items:flex-start;flex-wrap:wrap;gap:16px}.sm-library-grid{gap:20px 16px}.sm-library-grid img{height:180px}.sm-library-grid .sm-actions{display:grid;gap:8px}.sm-library-grid .site-btn{justify-content:center}.sm-library-empty{min-height:320px}.spec-mode-generation #social-media .sm-jump{gap:20px}.spec-mode-generation #social-media .sm-intro h2{font-size:24px}.sm-gen-empty{padding:16px}}
@media(max-width:480px){.sm-library-grid{grid-template-columns:1fr}.sm-library-grid img{height:240px}.sm-gen-result figcaption>div:first-child p{display:none}.sm-gen-preview{height:360px}.sm-gen-options{gap:14px 10px}.sm-gen-empty>span{font-size:11px}}
/* Template production: one sized preview and a usable inspector. */
#sm-samples .sm-workbench{grid-template-columns:minmax(0,1fr) 360px;grid-template-areas:"toolbar toolbar" "preview case";margin-inline:auto;gap:16px 24px}
#sm-samples .sm-toolbar{display:flex;justify-content:flex-end;gap:16px;flex-wrap:wrap}
#sm-samples .sm-sample-control[hidden]{display:none!important}
#sm-samples .sm-mode-control{max-width:360px}
#sm-samples .sm-stage{background:var(--ox-raised,#F4F4F6);min-height:0!important;max-height:none!important;padding:16px;touch-action:pan-y}
#sm-samples .sm-stage canvas{max-height:none!important;max-width:100%;cursor:grab;touch-action:none}
#sm-samples .sm-stage canvas:active{cursor:grabbing}
#sm-samples .sm-case-panel{height:var(--sm-preview-height);max-height:none;min-height:440px;padding-left:24px;overflow:hidden}
#sm-samples .sm-inspector-body{flex:1;max-height:none!important;overflow-y:auto;overflow-x:hidden;padding-right:6px;margin-top:12px}
#sm-samples .sm-inspector-tabs{margin-top:12px}
#sm-samples .sm-inspector-tabs [role=tab][aria-selected=true]{border-bottom-color:var(--ox-text,#131316)}
#sm-samples .sm-text-style-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}
#sm-samples .sm-text-style-grid label{font-size:12px;font-weight:400;gap:5px}
#sm-samples .sm-text-style-grid :is(input,select){min-height:40px;padding:8px 10px;font-size:13px}
#sm-samples .sm-copy-fields textarea{min-height:54px;padding:10px;font-size:14px}
#sm-samples .sm-base-preview{margin-bottom:12px}
#sm-samples .sm-base-preview img{height:120px}
#sm-samples .sm-base-controls>label{margin-top:12px}
.sm-range-control{display:grid;grid-template-columns:minmax(0,1fr) 68px 12px;align-items:center;gap:8px;min-width:0}
#sm-samples .sm-range-control input[type=number]{box-sizing:border-box;width:68px;min-height:36px;padding:6px 8px;border:1px solid var(--ox-border,#CFCFD6);border-radius:5px;background:var(--ox-surface,#FFF);color:var(--ox-text,#131316);font:13px/1.4 var(--ox-font);font-variant-numeric:tabular-nums}
.sm-range-control>span{font-size:12px;color:var(--ox-muted,#6E6E79)}
#sm-samples .sm-range-control [aria-invalid=true]{border-color:#C88C8C}
.sm-template-library{position:relative;margin:0 0 16px;border-bottom:1px solid var(--sm-line);padding-bottom:12px}
.sm-template-library>summary{display:flex;align-items:center;gap:12px;min-height:44px;cursor:pointer;font-size:13px;color:var(--ox-muted,#6E6E79);list-style:none}
.sm-template-library>summary::-webkit-details-marker{display:none}
.sm-template-library>summary strong{font-size:14px;font-weight:600;color:var(--ox-text,#131316)}
.sm-template-library>summary::after{content:"";width:7px;height:7px;margin-left:auto;border-bottom:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg)}
.sm-template-library[open]>summary::after{transform:rotate(225deg)}
#sm-samples .sm-template-library[open]{z-index:60}
.sm-template-cards{position:absolute;z-index:40;left:0;right:0;top:52px;display:flex;flex-wrap:wrap;align-items:flex-start;gap:12px;max-height:440px;overflow:auto;padding:16px;border:1px solid var(--ox-border,#CFCFD6);border-radius:8px;background:var(--ox-surface,#FFF);box-shadow:none}
#sm-samples .sm-template-item{position:relative;flex:0 0 auto;aspect-ratio:var(--sm-template-ratio);width:auto;max-width:100%;height:160px;min-width:44px}
#sm-samples .sm-template-cards [data-sm-template]{position:relative;display:block;box-sizing:border-box;width:100%;height:100%;min-height:0;min-width:44px;margin:0;padding:0;overflow:hidden;text-align:left;border:1px solid transparent;border-radius:3px;cursor:pointer;font-family:var(--ox-font);background:transparent}
#sm-samples .sm-template-cards [data-sm-template]:is([aria-pressed=true],:focus-visible){border-color:var(--ws-border-strong,var(--ox-border-strong,#A8A8B2));outline:none;box-shadow:none}
#sm-samples .sm-template-cards img{display:block;width:100%;height:100%;object-fit:contain;background:transparent;border-radius:0}
#sm-samples .sm-template-info{position:absolute;inset:auto 0 0;display:grid;isolation:isolate;gap:4px;padding:8px 4px;opacity:0;transform:translateY(4px);transition:opacity 160ms cubic-bezier(.2,.8,.2,1),transform 160ms cubic-bezier(.2,.8,.2,1);pointer-events:none}
#sm-samples .sm-template-info::before{content:"";position:absolute;z-index:-1;inset:-24px 0 0;background:linear-gradient(to top,rgba(0,0,0,.92),rgba(0,0,0,.76) 65%,rgba(0,0,0,0));pointer-events:none}
#sm-samples #sm-template-library .sm-template-info strong{font-size:13px;line-height:18px;font-weight:600;color:#FFF;overflow-wrap:anywhere}
#sm-samples #sm-template-library .sm-template-info small{font-size:12px;line-height:16px;color:#FFF;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
#sm-samples .sm-template-cards [data-sm-template]:focus-visible .sm-template-info{opacity:1;transform:translateY(0)}
#sm-samples .sm-template-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:8px 4px;text-align:center;background:var(--ws-soft,var(--ox-raised,#F4F4F6));pointer-events:none}
#sm-samples .sm-template-placeholder[hidden],#sm-samples .sm-template-retry[hidden]{display:none}
#sm-samples #sm-template-library .sm-template-placeholder strong{font-size:13px;line-height:18px;font-weight:600;overflow-wrap:anywhere}
#sm-samples #sm-template-library .sm-template-placeholder small{font-size:14px;line-height:20px;color:var(--ws-ink,var(--ox-text,#131316))}
#sm-samples .sm-template-item[data-preview-state=error] .sm-template-placeholder{padding-bottom:48px}
#sm-samples .sm-template-item:not([data-preview-state=ready]) .sm-template-info{opacity:0}
#sm-samples .sm-template-retry{position:absolute;inset:auto 4px 4px;box-sizing:border-box;min-height:44px;min-width:44px;padding:6px 8px;border:1px solid var(--ws-border,var(--ox-border,#CFCFD6));border-radius:4px;background:var(--ws-surface,var(--ox-surface,#FFF));color:var(--ws-ink,var(--ox-text,#131316));font:14px/20px var(--ox-font);cursor:pointer}
#sm-samples .sm-template-retry:is(:hover,:focus-visible){border-color:var(--ws-border-strong,var(--ox-border-strong,#A8A8B2));outline:none;box-shadow:none}
#sm-samples .sm-template-library>summary:focus-visible{outline:none;box-shadow:none;border-color:var(--ws-border-strong,var(--ox-border-strong,#A8A8B2))}
@media(hover:hover){#sm-samples .sm-template-cards [data-sm-template]:hover .sm-template-info{opacity:1;transform:translateY(0)}}
@media(hover:none){#sm-samples .sm-template-cards .sm-template-item[data-preview-state=ready] .sm-template-info{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){#sm-samples .sm-template-info{transition:none;transform:none!important}}
html[data-motion=reduce] #sm-samples .sm-template-info{transition:none;transform:none!important}
@media(max-width:900px){#sm-samples .sm-workbench{grid-template-columns:minmax(0,1fr);grid-template-areas:"toolbar" "preview" "case";max-width:none!important}#sm-samples .sm-case-panel{height:auto;min-height:0;max-height:none;padding:20px 0 0;border-left:0;border-top:1px solid var(--sm-line)}#sm-samples .sm-inspector-body{overflow:visible}#sm-samples .sm-toolbar{justify-content:flex-start}.sm-template-cards{padding:10px;gap:10px}#sm-samples .sm-text-style-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#sm-samples .sm-mode-control{max-width:280px}}
@media(max-width:600px){#sm-samples .sm-template-item{height:132px}#sm-samples .sm-toolbar{gap:10px}}
/* The inspector reuses the specification's accessible select menu. */
#sm-samples .sm-inspector-panel[hidden],#sm-samples .sm-copy-field[hidden]{display:none!important}
#sm-samples .field{min-width:0}
#sm-samples .field :is(input,select,textarea){box-sizing:border-box;padding-left:12px}
#sm-samples .field select{padding-right:36px;width:100%;min-height:44px;border-radius:6px;border:1px solid var(--ws-border,var(--ox-border,#CFCFD6));background:var(--ws-surface,var(--ox-surface,#FFF));color:var(--ws-ink,var(--ox-text,#131316));font:14px/1.5 var(--ox-font)}
#sm-samples .field .ox-select-wrap{display:grid;width:100%}
#sm-samples .ox-select-trigger{padding-left:12px!important;padding-right:44px!important;background:var(--ws-surface,var(--ox-surface,#FFF))!important;color:var(--ws-ink,var(--ox-text,#131316))!important;border-color:var(--ws-border,var(--ox-border,#CFCFD6))!important}
#sm-samples .sm-text-style-grid input[type=color]{padding:5px;min-height:44px;background:var(--ws-surface,var(--ox-surface,#FFF));border-color:var(--ws-border,var(--ox-border,#CFCFD6));cursor:pointer}
#sm-samples input[type=color]::-webkit-color-swatch-wrapper{padding:0}#sm-samples input[type=color]::-webkit-color-swatch{border:0;border-radius:3px}
#sm-samples input[type=color]::-moz-color-swatch{border:0;border-radius:3px}
#sm-samples .sm-case-panel{border-color:var(--ws-line,var(--sm-line));color:var(--ws-ink,var(--ox-text,#131316))}
#sm-samples .sm-inspector-tabs button{background:transparent;color:var(--ws-muted,var(--ox-muted,#6E6E79))}
#sm-samples .sm-inspector-tabs button[aria-selected=true]{background:var(--ws-selected,var(--ox-hover,#F4F4F6));color:var(--ws-ink,var(--ox-text,#131316));border-bottom-color:var(--ws-muted,var(--ox-muted,#6E6E79))}
#sm-samples .sm-stage,#sm-samples .sm-base-preview img,#sm-samples .sm-template-cards img{background:var(--ws-soft,var(--ox-raised,#F4F4F6))}
#sm-samples .sm-template-cards{background:var(--ws-surface,var(--ox-surface,#FFF));border-color:var(--ws-border,var(--ox-border,#CFCFD6))}
#sm-samples .sm-template-cards [data-sm-template]{background:transparent;color:var(--ws-ink,var(--ox-text,#131316))}
#sm-samples .sm-template-cards :is(small,strong),#sm-samples .sm-template-library summary strong{color:var(--ws-ink,var(--ox-text,#131316))}
#sm-samples .sm-text-style-grid label{line-height:1.5}
#sm-samples .sm-header-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px}
#sm-samples #sm-replace-base{margin-bottom:14px;width:100%;justify-content:center}
.sm-engineering-menu{position:relative;z-index:60}
.sm-engineering-menu>summary{display:flex;align-items:center;gap:9px;box-sizing:border-box;min-height:44px;padding:10px 12px;cursor:pointer;font-size:13px;font-weight:500;list-style:none;color:var(--ws-ink,var(--ox-text,#131316))}
.sm-engineering-menu>summary::-webkit-details-marker{display:none}.sm-engineering-menu>summary::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.sm-engineering-actions{position:absolute;top:calc(100% + 6px);right:0;display:grid;gap:4px;padding:7px;min-width:150px;border:1px solid var(--ws-border,var(--ox-border,#CFCFD6));border-radius:6px;background:var(--ws-surface,var(--ox-surface,#FFF));box-shadow:0 8px 24px #00000012}
#sm-samples .sm-engineering-actions .site-btn{min-width:0;padding:10px 14px;border:0;border-radius:4px;justify-content:flex-start;background:transparent;box-shadow:none}
#sm-samples .sm-engineering-actions .site-btn:hover{background:var(--ws-soft,var(--ox-hover,#F4F4F6))}
#sm-samples .sm-field-error{padding:0;background:transparent;color:#B14A4A;font-size:12px;line-height:1.7}
#sm-samples .sm-preview-column>.sm-status{padding:0;border:0;background:transparent;font-size:12px}
@media(max-width:600px){#sm-samples .sm-panel-header{align-items:flex-start}#sm-samples .sm-header-actions{justify-content:flex-start;width:100%;gap:6px}#sm-samples .sm-header-actions .site-btn{padding-inline:12px}#sm-samples .sm-engineering-menu>summary{padding-inline:10px}}

/* Keep the format picker and preview controls on one useful row. */
#sm-samples .sm-toolbar{position:relative;z-index:45;align-items:center;justify-content:space-between;gap:12px;min-width:0}
#sm-samples .sm-template-library{flex:1;min-width:220px;margin:0;padding:0;border:0}
#sm-samples .sm-template-library>summary{box-sizing:border-box;min-height:44px;padding:8px 12px;border:1px solid var(--ws-border,var(--ox-border,#CFCFD6));border-radius:6px;gap:8px;white-space:nowrap}
#sm-samples .sm-template-library>summary::after{flex-shrink:0}
#sm-samples .sm-template-library>summary strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#sm-samples .sm-template-library .sm-template-cards{top:calc(100% + 6px);width:100%;right:0;max-width:calc(100vw - 32px);box-sizing:border-box}
#sm-samples .sm-mode-control{display:flex;flex-direction:row;align-items:center;gap:8px;flex:0 0 190px}
#sm-samples .sm-mode-control .ox-select-wrap{width:148px;flex:1}
#sm-samples .sm-case-panel{min-height:0}
#sm-samples .sm-panel-header{margin-bottom:12px}
#sm-samples #sm-project-status,#sm-samples #sm-project-status:empty,#sm-samples #sm-project-status:not(:empty){display:block;margin:0 0 10px;min-height:20px;font-size:12px;line-height:20px}
#sm-samples .sm-text-style-grid :is(input,textarea){padding-left:12px}
html[data-workspace-embed=templates] #sm-samples #sm-save-to-task{background:var(--ws-ink)!important;color:var(--ws-surface)!important;border-color:var(--ws-ink)!important}
html[data-workspace-embed=templates] #sm-samples #sm-save-to-task:hover{opacity:.86}
#sm-samples .sm-color-control{display:flex;align-items:center;gap:8px;box-sizing:border-box;min-height:44px;padding:4px 8px;border:1px solid var(--ws-border,var(--ox-border,#CFCFD6));border-radius:6px;background:var(--ws-surface,var(--ox-surface,#FFF));color:var(--ws-ink,var(--ox-text,#131316));font-size:12px;font-variant-numeric:tabular-nums}
#sm-samples .sm-text-style-grid .sm-color-control input[type=color]{flex:0 0 28px;width:28px;min-height:28px;height:28px;padding:2px;border:0;background:transparent}
@media(max-width:600px){#sm-samples .sm-template-library{flex-basis:100%;min-width:0}#sm-samples .sm-mode-control{flex-basis:190px}#sm-samples .sm-toolbar{gap:10px}#sm-samples .sm-template-library .sm-template-cards{width:100%;max-width:100%}}

/* Editing affordances are a separate DOM layer, never part of the artwork. */
#sm-edit-overlay{position:absolute;z-index:2;pointer-events:none;overflow:visible}
#sm-edit-overlay rect[data-selection]{stroke:#9B9BA6;stroke-width:1;fill:rgba(155,155,166,.04)}
#sm-edit-overlay rect[data-hover]{stroke:rgba(155,155,166,.65);stroke-width:1;stroke-dasharray:3 3}
#sm-edit-overlay line{stroke:#9B9BA6;stroke-width:1;stroke-dasharray:4 3}
#sm-samples #sm-canvas{touch-action:none;outline:none}
#sm-samples #sm-canvas:is(:focus,:focus-visible){outline:0!important;outline-offset:0!important;box-shadow:none!important}
#sm-samples:has(#sm-canvas:focus-visible) #sm-selection-label{text-decoration:underline;text-underline-offset:3px}
#sm-samples .sm-edit-tools{display:flex;align-items:center;flex-wrap:wrap;flex:1 0 100%;gap:6px 16px;min-width:0;padding:4px 0;color:var(--ws-ink,var(--ox-text,#131316));font:12px/1.5 var(--ox-font)}
#sm-selection-label{flex:1 1 150px;min-width:0;font-weight:500}
#sm-samples .sm-align-scope{flex:0 1 188px;min-width:168px;gap:8px;flex-direction:row;justify-content:flex-start}
#sm-samples .sm-align-scope .ox-select-wrap{flex:1;width:132px}
#sm-samples .sm-align-scope select{width:132px;font-size:12px}
#sm-samples :is(.sm-align-actions,.sm-transform-history){display:flex;align-items:center;gap:2px}
#sm-samples :is(.sm-align-actions,.sm-transform-history) button{display:grid;place-items:center;flex:0 0 44px;min-width:44px;min-height:44px;padding:10px;border:0;border-radius:6px;background:transparent;color:inherit;cursor:pointer;font:22px/1 var(--ox-font)}
#sm-samples :is(.sm-align-actions,.sm-transform-history) button:enabled:hover{background:var(--ws-selected,var(--ox-hover,#F4F4F6))}
#sm-samples :is(.sm-align-actions,.sm-transform-history) button:disabled{opacity:.32;cursor:default}
#sm-samples :is(.sm-align-actions,.sm-transform-history) button:focus-visible{outline:1px solid var(--ws-muted,var(--ox-focus,#9B9BA6));outline-offset:1px}
#sm-samples .sm-align-actions svg{width:20px;height:20px}
#sm-samples .sm-snap-switch{font-size:12px;white-space:nowrap;cursor:pointer}
#sm-samples .sm-snap-switch input{accent-color:var(--ws-muted,var(--ox-muted,#6E6E79));cursor:pointer}
#sm-snap-status{position:absolute;top:10px;left:10px;z-index:3;max-width:calc(100% - 40px);padding:4px 8px;border-radius:4px;background:var(--ws-surface,var(--ox-surface,#FFF));color:var(--ws-muted,var(--ox-muted,#6E6E79));font:11px/1.5 var(--ox-font);pointer-events:none}
#sm-snap-status:empty{display:none}
@media(max-width:600px){#sm-samples .sm-edit-tools{gap:4px 8px}#sm-selection-label{flex-basis:calc(100% - 104px)}#sm-samples .sm-align-scope{flex:1 1 170px}#sm-samples .sm-align-actions{order:2;flex:1 0 100%;justify-content:space-between}}

/* The preview camera never changes artwork pixels or object coordinates. */
#sm-samples .sm-stage{position:relative;overflow:hidden;padding:0!important;touch-action:none}
#sm-samples .sm-artwork-view{position:absolute;left:0;top:0;transform-origin:0 0;line-height:0}
#sm-samples .sm-artwork-view #sm-canvas{display:block;width:auto;max-width:none!important;max-height:none!important;margin:0;object-fit:initial}
#sm-samples .sm-stage[data-pan-ready=true],#sm-samples .sm-stage[data-pan-ready=true] canvas{cursor:grab!important}
#sm-samples .sm-stage[data-panning=true],#sm-samples .sm-stage[data-panning=true] canvas{cursor:grabbing!important}
.sm-viewport-tools{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin:0 0 10px;color:var(--ws-ink,var(--ox-text,#131316));font:12px/1.5 var(--ox-font)}
.sm-view-label{margin-right:auto;color:var(--ws-muted,var(--ox-muted,#6E6E79))}
.sm-viewport-tools button{min-height:44px;min-width:44px;padding:8px 12px;border:0;border-radius:6px;background:transparent;color:inherit;cursor:pointer}
.sm-viewport-tools button:hover{background:var(--ws-selected,var(--ox-hover,#E4E4E9))}
.sm-view-scale{display:flex;align-items:center;gap:2px;height:44px;border:1px solid var(--ws-border,var(--ox-border,#CFCFD6));border-radius:6px;background:var(--ws-surface,var(--ox-surface,#FFF));padding:0 8px}
.sm-view-scale input{box-sizing:border-box;width:56px;min-width:0;height:40px;padding:0;border:0;background:transparent;color:inherit;font:12px/1.5 var(--ox-font);font-variant-numeric:tabular-nums;appearance:textfield}
.sm-view-scale input::-webkit-inner-spin-button{appearance:none}.sm-view-scale span{color:var(--ws-muted,var(--ox-muted,#6E6E79))}
.sm-viewport-tools :is(button,input):focus-visible{outline:1px solid var(--ws-muted,var(--ox-focus,#9B9BA6));outline-offset:2px}
#sm-samples .sm-color-control{display:grid;grid-template-columns:40px minmax(0,1fr) 40px;gap:0;min-height:44px;padding:0;border-color:var(--ws-border,var(--ox-border,#CFCFD6));overflow:visible}
#sm-samples :is(.sm-text-style-grid,.sm-base-controls) .sm-color-control input[type=color]{box-sizing:border-box;width:40px;min-width:40px;height:42px;min-height:42px;padding:10px 8px;border:0;border-radius:5px;background:transparent;cursor:pointer}
#sm-samples .sm-color-control .sm-color-hex{box-sizing:border-box;display:block;width:100%;min-width:0;height:42px;min-height:42px;padding:0 2px;border:0;border-radius:0;background:transparent;color:inherit;font:12px/1.5 var(--ox-font);font-variant-numeric:tabular-nums;letter-spacing:0}
#sm-samples .sm-color-reset{box-sizing:border-box;display:grid;place-items:center;width:40px;height:42px;min-height:42px;padding:0;border:0;border-radius:5px;background:transparent;color:var(--ws-muted,var(--ox-muted,#6E6E79));cursor:pointer}
#sm-samples .sm-color-reset:hover{background:var(--ws-soft,var(--ox-hover,#F4F4F6))}
#sm-samples .sm-color-control:focus-within{outline:1px solid var(--ws-muted,var(--ox-focus,#9B9BA6));outline-offset:2px}
#sm-samples .sm-color-control :is(input,button):focus-visible{outline:none;box-shadow:none}
#sm-samples .sm-color-error{font-size:11px;line-height:1.6;color:var(--ws-error,#B14A4A);margin-top:6px}
#sm-samples .sm-color-error[hidden]{display:none!important}
#sm-samples .sm-color-control:has([aria-invalid=true]){border-color:#B89494}
#sm-samples .sm-color-field{min-width:0}
#sm-samples #sm-base-reset{border:0;margin-top:14px;padding-top:0;min-height:44px}
@media(max-width:600px){.sm-viewport-tools{gap:2px}.sm-view-label{flex:1 0 100%;margin-bottom:2px}.sm-viewport-tools button{padding:8px 10px}.sm-view-scale input{font-size:16px;width:54px}#sm-samples .sm-color-control .sm-color-hex{font-size:12px}}

/* Interface typography follows the readable workbench scale. Canvas drawing
   keeps the sample's original pixel sizes, independent of these controls. */
#social-media :is(.sm-caption,.sm-status,.sm-control-note,.sm-preview-hint,.sm-reference-file,.sm-more-link,.sm-prompt-editor,.sm-gen-reference-preview figcaption,.sm-gen-result figcaption p,.sm-gen-empty>span,.sm-library-grid figcaption){font-size:14px;line-height:1.6}
#social-media :is(.sm-intro p,.sm-tool-heading p,.sm-library-heading p,.sm-gen-empty p,.sm-library-empty p,.sm-copy-editor>p,.sm-case-analysis p,.sm-case-analysis dd){font-size:16px;line-height:1.65}
#social-media :is(.sm-generation-form label,.sm-base-controls>label,.sm-text-style-grid label,.sm-copy-fields label,.sm-layer-control label){font-size:14px;line-height:22px}
#social-media :is(.site-btn,.sm-header-actions .site-btn,.sm-library-grid .site-btn,.sm-gen-result .site-btn,.sm-library-empty .site-btn,.sm-engineering-menu>summary,.sm-inspector-tabs button,.sm-layout-tabs button,.sm-jump a){font-size:15px;line-height:22px}
#social-media :is(.sm-generation-form textarea,.sm-generation-form select,.sm-layer-control select,.sm-base-controls select,#sm-gen-prompt){font-size:15px;line-height:24px}
#social-media :is(.sm-tool-heading h3,.sm-panel-header h3,.sm-library-heading h2){font-size:24px;line-height:32px}
#social-media :is(.sm-inspector-heading h4,.sm-inspector-title,#sm-sample-title,.sm-copy-editor h5,.sm-gen-empty h4,.sm-library-empty h3,.sm-gen-result h4){font-size:20px;line-height:28px}
#sm-samples :is(.sm-copy-editor>p,#sm-edit-status,.sm-sample-meta,.sm-toolbar label,.sm-base-preview figcaption,.sm-range-label output,.sm-range-control>span,.sm-template-library>summary,.sm-template-cards small,.sm-snap-switch,.sm-color-error,.sm-field-error,.sm-preview-column>.sm-status,.sm-prompt-meta,.sm-copy-help){font-size:14px;line-height:22px}
#sm-samples :is(.sm-edit-tools,.sm-viewport-tools){font-size:14px;line-height:22px}
#sm-samples .sm-template-library>summary strong,#sm-samples .sm-template-cards strong{font-size:15px;line-height:22px}
#sm-samples .sm-text-style-grid :is(label,.sm-color-control){font-size:14px;line-height:22px}
#sm-samples :is(.sm-text-style-grid input,.sm-text-style-grid select,.sm-copy-fields textarea,.sm-field select,.ox-select-trigger,.sm-range-control input[type=number],.sm-view-scale input,.sm-color-control .sm-color-hex){font-size:15px;line-height:24px}
#sm-samples :is(.sm-text-style-grid input,.sm-text-style-grid select,.sm-range-control input[type=number]){min-height:44px}
#sm-samples :is(.sm-view-scale,.sm-viewport-tools button){font-size:15px;line-height:22px}
#sm-samples :is(#sm-project-status,#sm-project-status:empty,#sm-project-status:not(:empty),#sm-base-status,#sm-snap-status){font-size:14px;line-height:22px}

/* One preview toolbar owns selection, editing and camera controls. */
#sm-samples .sm-preview-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;min-width:0;padding:6px 8px;margin:0 0 10px;border-radius:10px;background:var(--ws-soft,var(--ox-hover,#F4F4F6));color:var(--ws-ink,var(--ox-text,#131316));position:relative;z-index:4;font:14px/22px var(--ox-font)}
#sm-samples .sm-preview-selection{flex:1 1 140px;min-width:0;display:flex;align-items:center;min-height:44px;padding-inline:4px}
#sm-samples .sm-preview-selection #sm-selection-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px;line-height:22px}
#sm-samples .sm-preview-toolbar .sm-edit-tools{flex:0 1 auto;gap:6px 10px;padding:0;font-size:14px;line-height:22px}
#sm-samples .sm-preview-toolbar .sm-viewport-tools{flex:0 1 auto;flex-wrap:nowrap;gap:2px;margin:0 0 0 auto;font-size:15px;line-height:22px}
#sm-samples .sm-preview-toolbar .sm-view-label{display:none}
#sm-samples .sm-preview-toolbar .sm-viewport-tools button{padding-inline:8px}
#sm-samples .sm-preview-toolbar :is(.sm-snap-switch,.sm-guide-switch){display:flex;align-items:center;gap:6px;min-height:44px;margin:0;white-space:nowrap;font-size:14px;line-height:22px;color:var(--ws-muted,var(--ox-muted,#6E6E79));cursor:pointer}
#sm-samples .sm-preview-toolbar :is(.sm-snap-switch,.sm-guide-switch) input{width:18px;height:18px;accent-color:var(--ws-muted,var(--ox-muted,#6E6E79));margin:0}
#sm-samples .sm-align-menu{position:relative;flex:none}
/* The shared details fade must not establish a containing block for this viewport-aligned menu. */
#sm-samples .sm-align-menu::details-content{translate:none!important}
#sm-samples .sm-align-menu>summary{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;min-width:44px;padding-inline:10px;border-radius:6px;list-style:none;cursor:pointer;font-size:15px;line-height:22px}
#sm-samples .sm-align-menu>summary::-webkit-details-marker{display:none}
#sm-samples .sm-align-menu>summary::after{content:"";width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);margin-top:-3px}
#sm-samples .sm-align-menu[open]>summary,#sm-samples .sm-align-menu>summary:hover{background:var(--ws-selected,var(--ox-hover,#E4E4E9))}
#sm-samples .sm-align-menu>summary:focus-visible{outline:none;box-shadow:none;background:var(--ws-selected,var(--ox-hover,#E4E4E9))}
#sm-samples .sm-align-menu-panel{position:absolute;z-index:60;top:calc(100% + 6px);left:0;display:grid;gap:8px;padding:12px;border:1px solid var(--ws-border,var(--ox-border,#CFCFD6));border-radius:10px;background:var(--ws-surface,var(--ox-surface,#FFF));box-shadow:0 10px 24px #0002;width:300px;max-width:calc(100vw - 32px);box-sizing:border-box}
#sm-samples .sm-align-menu-panel .sm-align-scope{display:flex;flex-direction:row;min-width:0;width:100%;font-size:14px;line-height:22px;gap:10px}
#sm-samples .sm-align-menu-panel .sm-align-scope .ox-select-wrap{width:auto;min-width:0;flex:1}
#sm-samples .sm-align-menu-panel .sm-align-actions{display:grid;grid-template-columns:repeat(6,minmax(44px,1fr));gap:0;order:0;flex:none;justify-content:initial}
#sm-samples .sm-align-menu-panel .sm-align-actions button{padding:10px}
@media(max-width:600px){
 #sm-samples .sm-preview-toolbar{gap:4px 6px;padding:6px;margin-bottom:8px}
 #sm-samples .sm-preview-selection{flex-basis:100%;min-height:26px}
 #sm-samples .sm-preview-toolbar .sm-edit-tools{flex:1 1 100%;justify-content:space-between;gap:4px;flex-wrap:nowrap}
 #sm-samples .sm-preview-toolbar .sm-viewport-tools{flex:1 1 100%;justify-content:flex-end;gap:2px;margin-left:0}
 #sm-samples .sm-preview-toolbar :is(.sm-snap-switch,.sm-guide-switch){gap:4px}
 #sm-samples .sm-align-menu-panel{position:fixed;left:16px;right:16px;top:auto;margin-top:6px;width:auto}
}
#sm-samples :is(#sm-project-status,#sm-project-status:empty,#sm-project-status:not(:empty),.sm-preview-column>.sm-status){min-height:22px}
#sm-samples .sm-view-scale input{width:64px}
@media(max-width:379px){
 #sm-samples .sm-preview-toolbar .sm-edit-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));justify-items:start;gap:2px 8px}
 #sm-samples .sm-preview-toolbar .sm-viewport-tools{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:2px 4px;width:100%}
 #sm-samples .sm-preview-toolbar .sm-viewport-tools button{white-space:nowrap}
 #sm-samples .sm-preview-toolbar .sm-view-scale{justify-content:center}
 #sm-samples #sm-view-fit{grid-column:1 / 3}
 #sm-samples #sm-view-original{grid-column:3;padding-inline:0}
 #sm-samples #sm-sample-title{text-wrap:balance}
 #sm-samples .sm-text-style-grid>.sm-color-field{grid-column:1 / -1}
}
#sm-samples .sm-template-library>summary strong{min-width:0;white-space:normal;overflow:visible;text-overflow:clip}
#sm-samples .sm-template-cards small{overflow-wrap:anywhere}
#sm-samples .sm-align-scope :is(select,.ox-select-trigger){font-size:15px;line-height:24px}
#sm-samples .sm-select-field{margin-top:12px;gap:8px}
#sm-samples .sm-select-field>label{margin:0;font-size:14px;line-height:22px}
#sm-samples .sm-color-control :is(input,button){border:0!important;background:transparent!important}
#sm-samples .sm-color-control :is(input,button):focus-visible{outline:none!important;box-shadow:none!important}
#social-media .sm-rule-list :is(b,span){font-size:16px;line-height:26px}
#social-media :is(.sm-inspect-panel pre,.sm-template,.sm-prompt-panel pre,.sm-table td){font-size:16px;line-height:26px}
#social-media :is(.sm-inspect-panel summary,.sm-footer-links a){font-size:15px;line-height:24px}
#social-media :is(.sm-table th,.sm-table code){font-size:14px;line-height:22px}
#sm-samples .sm-color-control{grid-template-columns:44px minmax(0,1fr) 44px;min-height:46px}
#sm-samples :is(.sm-text-style-grid,.sm-base-controls) .sm-color-control input[type=color],#sm-samples .sm-color-reset{width:44px;min-width:44px;height:44px;min-height:44px}
#sm-samples .sm-color-control .sm-color-hex{height:44px;min-height:44px}
#sm-samples :is(.sm-range-label output,.sm-range-control>span,.sm-sample-meta,.sm-control-note,.sm-base-preview figcaption,.sm-copy-help){color:var(--ws-muted,var(--ox-muted,#6E6E79))}
#sm-samples .sm-inspect-panel{border-color:var(--ws-line,var(--ox-border,#E4E4E9))}
@media(max-width:767px){#social-media :is(.sm-generation-form textarea,.sm-generation-form select,.sm-layer-control select),#sm-samples :is(.sm-text-style-grid input,.sm-text-style-grid select,.sm-copy-fields textarea,.sm-field select,.ox-select-trigger,.sm-range-control input[type=number],.sm-view-scale input,.sm-color-control .sm-color-hex){font-size:16px}}

/* Removing the bitmap keeps the same editor and editable overlay layers. */
#sm-samples :is(#sm-replace-base,#sm-base-remove){display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:44px;min-height:44px;margin:0 0 16px;padding:0 16px;border:1px solid var(--ws-border,var(--ox-border,#CFCFD6));border-radius:999px;background:var(--ws-soft,var(--ox-hover,#F4F4F6));color:var(--ws-ink,var(--ox-text,#131316));font:600 15px/22px var(--ox-font);cursor:pointer}
#sm-samples :is(#sm-replace-base,#sm-base-remove):not(:disabled):is(:hover,:focus-visible){border-color:var(--ws-border-strong,var(--ox-border-strong,#A8A8B2))!important;outline:none;box-shadow:none}
#sm-samples :is(#sm-replace-base,#sm-base-remove):disabled{opacity:.45;cursor:not-allowed;transform:none}
#sm-base-thumbnail[hidden]{display:none}
#sm-samples .sm-cta-hint{display:block;margin:12px 0 16px;color:var(--ws-muted,var(--ox-muted,#6E6E79));font-size:14px;line-height:22px}
#sm-samples .sm-text-style-grid input[readonly]{color:var(--ws-muted,var(--ox-muted,#6E6E79));cursor:default}
#sm-inspector-base[data-base-hidden=true] .sm-base-controls>:not(label[for=sm-base-color]):not(.sm-color-control):not(.sm-color-error){display:none}
#sm-samples .sm-logo-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
#sm-samples .sm-logo-choice{display:flex;flex-direction:column;gap:8px;min-width:0;min-height:104px;padding:8px;border:1px solid var(--ws-border,var(--ox-border,#CFCFD6));border-radius:8px;background:transparent;color:var(--ws-ink,var(--ox-text,#131316));font:14px/22px var(--ox-font);cursor:pointer}
#sm-samples .sm-logo-choice:is(:hover,:focus-visible,[aria-pressed=true]){border-color:var(--ws-border-strong,var(--ox-border-strong,#A8A8B2));background:var(--ws-soft,var(--ox-hover,#F4F4F6));outline:none;box-shadow:none}
#sm-samples .sm-logo-preview{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:60px;padding:8px;border-radius:4px;background:#F4F4F6}
#sm-samples .sm-logo-preview[data-background=dark]{background:#252529}
#sm-samples .sm-logo-preview img{display:block;max-width:100%;width:100%;height:44px;object-fit:contain;filter:none}
#sm-samples :is(.sm-logo-current,.sm-logo-geometry,.sm-logo-status){margin:12px 0 0;font-size:14px;line-height:22px;color:var(--ws-muted,var(--ox-muted,#6E6E79));overflow-wrap:anywhere}
#sm-samples .sm-logo-status:empty{display:none}
#sm-samples .sm-logo-status[data-error=true]{color:var(--ws-error,#B14A4A)}

/* Help belongs to the existing information panel; editing keeps only live feedback. */
#sm-samples :is(#sm-status,#sm-edit-status,#sm-edit-mode-note)[hidden],
#sm-samples #sm-base-status:not([data-error=true]):not([data-pending=true]){display:none!important}
#sm-samples #sm-project-status:empty{display:none}
#sm-samples .sm-editor-help{margin-bottom:24px}
#sm-samples .sm-editor-help dl{display:grid;gap:16px;margin:12px 0 0}
#sm-samples .sm-editor-help dl>div{display:grid;gap:4px}
#sm-samples .sm-editor-help dt{font-size:14px;line-height:22px;font-weight:600;color:var(--ws-ink,var(--ox-text,#131316))}
#sm-samples .sm-editor-help dd{margin:0;font-size:14px;line-height:22px;color:var(--ws-muted,var(--ox-muted,#6E6E79));overflow-wrap:anywhere}
#sm-samples :is(.sm-field-error,.sm-color-error,.sm-status[data-error=true],#sm-edit-status[data-error=true]){color:var(--ox-danger,#641723)}
