/* Harrogate: black and white, with restrained red accents. */
:root{--ink:#171717;--brand:#171717;--brand-dark:#000;--muted:#595959;--line:#dedede;--surface:#fff;--canvas:#f6f6f6;--harrogate-red:#0077c8;color-scheme:light;accent-color:#0077c8}
body{color:#171717;background:#f6f6f6}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,canvas:focus-visible{outline:3px solid #0077c8!important;outline-offset:3px}
input[type=checkbox],input[type=radio],input[type=range]{accent-color:#0077c8!important}
.eyebrow,.social-kicker,.academy-kicker{color:#0077c8}
.social-header{border-top:3px solid #0077c8}
.social-workspace .social-destinations label:has(input:checked){background:#fafafa;border-color:#222;box-shadow:inset 0 -2px #0077c8}
.social-workspace .sme-platform-preview{background:#fafafa}
.social-workspace .sah-music-platform[data-selected=true]{border-color:#0077c8;background:#fff}
.social-workspace .social-tabs button[aria-selected=true],.social-workspace .social-tabs button[aria-pressed=true]{box-shadow:inset 0 -3px #0077c8}
.social-dialog.social-workspace .social-footer .social-primary{background:#171717!important;border-color:#171717!important;color:#fff!important}
.social-dialog.social-workspace .social-footer .social-primary:hover:not(:disabled){background:#000!important}
.social-dialog.social-workspace .social-footer .social-back,.social-dialog.social-workspace .social-footer .social-schedule-trigger{border:1.5px solid #555!important;background:#fff!important;color:#171717!important;box-shadow:none!important}
.social-dialog.social-workspace .social-footer .social-schedule-trigger.is-scheduled{border-color:#0077c8!important}
.social-workspace .social-brand-note{font-size:12px;color:#595959;line-height:1.5;margin:8px 0 12px}

/* Touch controls stay outside the exported canvas. */
.sme-canvas-wrap{position:relative;isolation:isolate}
.social-workspace .sme-canvas-wrap:has(.sme-text-outline){overflow:visible}
.sme-canvas-wrap canvas{border-radius:12px}
.sme-text-outline{position:absolute;pointer-events:none;border:1.5px solid #fff;outline:1px solid #171717;transform-origin:center;box-sizing:border-box;z-index:2}
.social-dialog.social-workspace .sme-text-handle{position:absolute;right:-22px;bottom:-22px;pointer-events:auto;touch-action:none!important;user-select:none;-webkit-user-select:none;width:44px;height:44px;min-width:44px;min-height:44px;padding:0!important;border:2px solid #fff!important;border-radius:50%!important;background:#171717!important;color:#fff!important;font-size:24px!important;box-shadow:0 1px 6px #0008!important;cursor:grab}
.sme-snap-line{position:absolute;z-index:1;background:#0077c8;pointer-events:none}
.sme-snap-line.vertical{width:1px;left:50%;top:0;bottom:0}
.sme-snap-line.horizontal{height:1px;top:50%;left:0;right:0}
.sme-text-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:14px 0 8px}
.social-dialog.social-workspace .sme-text-actions button,.social-dialog.social-workspace .sme-text-quick button,.social-dialog.social-workspace .sme-text-panel-title button{min-height:44px;border:1.5px solid #171717;border-radius:12px;background:#171717;color:#fff;padding:10px 14px;font-weight:700}
.social-dialog.social-workspace .sme-text-actions button+button,.social-dialog.social-workspace .sme-text-quick button{background:#fff;color:#171717}
.sme-text-quick{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}
.sme-text-quick output{font-size:13px;min-width:32px;text-align:center}
.sme-text-panel-title{display:flex;align-items:center;justify-content:space-between;gap:16px}
.sme-text-panel{border:1px solid #dedede;border-top:3px solid #0077c8;border-radius:12px;padding:14px;background:#fafafa}
.sme-text-panel textarea{font-size:16px!important;line-height:1.5}
@media(max-width:600px){.social-dialog.social-workspace .sme-canvas-wrap{width:min(100%,320px)!important;max-height:none!important}.sme-stage{padding:12px 18px!important}.sme-direct-canvas{display:block;width:100%;height:100%}.sme-text-actions button{flex:1;min-width:110px}}

/* Typing gets the screen. Extra tools open deliberately, with the keyboard dismissed. */
.social-dialog.social-workspace:has(.sme-writing){inset:0!important;width:100%!important;height:100dvh!important;max-width:none!important;max-height:none!important;margin:0!important;border-radius:0!important}
.social-dialog.social-workspace .sme-writing{position:fixed;inset:auto 0 auto 0;top:var(--writing-top,0px);height:var(--writing-height,100dvh);z-index:30;background:#fff;display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,380px);grid-template-rows:56px minmax(0,1fr);gap:0;overflow:hidden;padding:0;box-sizing:border-box;overscroll-behavior:contain}
.sme-writing-header{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:4px 12px;border-bottom:1px solid #ddd;background:#fff;gap:12px;min-width:0}
.sme-writing-target{display:flex;gap:4px;min-width:0}
.social-dialog.social-workspace .sme-writing-header button{min-height:44px;min-width:60px;border:1px solid transparent!important;background:#fff!important;color:#555!important;border-radius:9px;font-size:14px!important;font-weight:700;padding:8px 12px;white-space:nowrap}
.social-dialog.social-workspace .sme-writing-target button[aria-pressed=true]{color:#171717!important;background:#f2f2f2!important;box-shadow:inset 0 -3px #0077c8!important}
.social-dialog.social-workspace .sme-writing-header .sme-writing-done{min-width:72px;background:#171717!important;color:#fff!important;border-color:#171717!important;box-shadow:none!important}
.social-dialog.social-workspace .sme-writing .sme-stage-boundary{display:flex!important;flex-direction:column;gap:0;padding:0;border:0;border-radius:0;margin:0;min-height:0;overflow:hidden;background:#171717}
.social-dialog.social-workspace .sme-writing .sme-stage{display:flex;align-items:center;justify-content:center;flex:1!important;min-height:0;min-width:0;width:100%;padding:0!important;overflow:hidden!important;margin:0;position:relative;background:#171717}
.social-dialog.social-workspace .sme-writing .sme-canvas-wrap{flex:none;width:var(--writing-canvas-width,240px)!important;max-height:none!important;max-width:none!important;margin:0;border-radius:0;transform:translateY(var(--writing-canvas-shift,0px))}
.sme-writing .sme-canvas-wrap canvas{border-radius:0;cursor:default}
.sme-writing .sme-text-outline,.sme-writing .sme-stage>*:not(.sme-canvas-wrap):not(.sme-writing-preview-label),.sme-writing .sme-stage-boundary>*:not(.sme-stage),.sme-writing .sme-tools>.sme-toolbar{display:none!important}
.social-dialog.social-workspace .sme-writing-preview-label{display:block;position:absolute;top:10px;left:50%;transform:translateX(-50%);margin:0;padding:5px 10px;border-radius:20px;background:#171717db;color:#fff;font-size:11px;line-height:1.4;white-space:nowrap;pointer-events:none;z-index:3}
.social-dialog.social-workspace .sme-writing .sme-tools{min-height:0;overflow:auto;overscroll-behavior:contain;background:#fff;border-left:1px solid #ddd;padding:12px}
.social-dialog.social-workspace .sme-writing .sme-text-panel{display:flex;flex-direction:column;gap:8px;background:#fff;border:0;padding:0;border-radius:0;min-width:0}
.sme-writing-input-row{display:flex;align-items:flex-end;gap:6px;min-width:0}
.sme-writing-input-row .sme-text-label{flex:1;min-width:0;display:block;margin:0}
.social-dialog.social-workspace .sme-writing textarea{font-size:18px!important;line-height:24px;min-height:48px;height:48px;max-height:96px;resize:none;border:1px solid #777!important;border-radius:10px;padding:11px 10px;width:100%;box-sizing:border-box;margin:0;overflow-y:auto;scroll-margin:0}
.social-dialog.social-workspace .sme-writing[data-writing-target=caption] textarea{height:96px}
.social-dialog.social-workspace .sme-writing-input-row>button{flex:none;min-width:44px;min-height:48px;padding:8px;border:1px solid #888!important;background:#fff!important;color:#171717!important;border-radius:10px;font-size:13px!important;font-weight:700}
.social-dialog.social-workspace .sme-writing-input-row>button[aria-pressed=true]{border-color:#171717!important;background:#171717!important;color:#fff!important}
.social-dialog.social-workspace .sme-writing-input-row .sme-emoji-trigger{font-size:23px!important}
.sme-writing-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;font-weight:700;border-top:1px solid #ddd;padding-top:8px}
.social-dialog.social-workspace .sme-writing-panel-head button{min-height:44px;background:#171717!important;color:#fff!important;border:1px solid #171717!important;border-radius:9px;padding:8px 12px;font-size:13px!important}
.sme-writing-options{display:grid;gap:12px;max-height:260px;overflow:auto;overscroll-behavior:contain;padding:2px}
.sme-writing .sme-emoji{display:flex;flex-wrap:wrap;gap:8px}
.social-dialog.social-workspace .sme-writing .sme-emoji button{min-width:48px;min-height:48px;padding:6px;border:1px solid #aaa!important;background:#fff!important;color:#171717!important;border-radius:10px;font-size:24px!important}
.social-dialog.social-workspace .sme-writing .sme-choices button{min-height:44px;white-space:normal;overflow-wrap:anywhere}
.sme-writing-help{margin:0;color:#595959;font-size:12px;line-height:1.4}
.sme-writing-count{font-size:12px;color:#595959;margin:0}
.sme-writing-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:700px){
 .social-dialog.social-workspace .sme-writing{grid-template-columns:minmax(0,1fr);grid-template-rows:56px minmax(0,1fr) auto}
 .social-dialog.social-workspace .sme-writing .sme-stage-boundary{grid-row:2}
 .social-dialog.social-workspace .sme-writing .sme-tools{grid-row:3;border-left:0;border-top:1px solid #ddd;padding:8px 10px max(8px,env(safe-area-inset-bottom));max-height:52%;max-height:calc(var(--writing-height,100dvh) * .52)}
 .social-dialog.social-workspace .sme-writing[data-writing-panel=type] .sme-tools{overflow:hidden;max-height:none}
 .sme-writing-help{display:none}
 .sme-writing-header{gap:6px;padding-inline:10px}
 .social-dialog.social-workspace .sme-writing-header button{padding-inline:10px}
 .social-dialog.social-workspace .sme-writing-options{max-height:190px;max-height:min(190px,calc(var(--writing-height,100dvh) * .25))}
}
@media(max-width:360px){.social-dialog.social-workspace .sme-writing-header button{font-size:13px!important;padding-inline:8px;min-width:56px}.social-dialog.social-workspace .sme-writing-input-row>button{min-width:44px;padding-inline:6px}.social-dialog.social-workspace .sme-writing textarea{font-size:16px!important}}
@media(prefers-reduced-motion:reduce){.sme-writing *{scroll-behavior:auto!important}}

/* The same native input remains available before, during and after typing. */
.social-workspace .sme-editor:not(.sme-writing) .sme-text-panel{margin-block:12px;padding:10px;border:1px solid #888;border-radius:12px;background:#fff}
.social-workspace .sme-editor:not(.sme-writing) .sme-text-panel>*:not(.sme-writing-input-row),.social-workspace .sme-editor:not(.sme-writing) .sme-writing-input-row>button{display:none!important}
.social-dialog.social-workspace .sme-text-panel textarea{display:block;min-height:48px;width:100%;box-sizing:border-box;resize:none;font-size:18px!important;line-height:24px;padding:11px 10px;border:1px solid #777!important;border-radius:10px;touch-action:auto;user-select:text;-webkit-user-select:text}

/* Compact, steady framing. The media and text share identical canvas geometry. */
.social-dialog.social-workspace .sme-canvas-wrap{width:216px!important;max-height:none!important;background:#171717;contain:layout}
.social-dialog.social-workspace .sme-canvas-wrap:has(canvas[height="675"]){width:288px!important}
.sme-canvas-wrap .sme-media-canvas{position:absolute;inset:0;pointer-events:none}
.sme-canvas-wrap .sme-direct-canvas{position:relative;background:transparent!important;touch-action:none;user-select:none;-webkit-user-select:none}
.social-dialog.social-workspace .sme-writing .sme-stage-boundary,.social-dialog.social-workspace .sme-writing .sme-stage{background:#eeeeee}
.social-dialog.social-workspace .sme-writing .sme-stage-boundary{justify-content:center}
.social-dialog.social-workspace .sme-writing .sme-stage{max-height:440px;flex:none!important;height:100%}
.social-dialog.social-workspace .sme-writing .sme-canvas-wrap,.social-dialog.social-workspace .sme-writing .sme-canvas-wrap:has(canvas[height="675"]){width:var(--writing-canvas-width,180px)!important;transform:none;border-radius:10px}
.social-dialog.social-workspace .sme-writing .sme-text-outline{display:block!important}
.social-dialog.social-workspace .sme-writing:has(textarea:focus) .sme-text-outline{visibility:hidden}
.social-dialog.social-workspace .sme-writing .sme-canvas-wrap canvas{border-radius:10px;cursor:grab}
.social-dialog.social-workspace .sme-writing .sme-canvas-wrap canvas:active{cursor:grabbing}
.social-dialog.social-workspace .sme-writing .sme-tools{overflow:auto}
.social-dialog.social-workspace .sme-writing-help{display:block;font-size:12px;line-height:1.4;margin:0;color:#555}
.social-dialog.social-workspace .sme-writing .sme-text-panel textarea{height:72px;min-height:72px;max-height:96px}
@media(max-width:700px){
 .social-dialog.social-workspace .sme-editor:not(.sme-writing){display:flex;flex-direction:column;gap:12px}
 .social-dialog.social-workspace .sme-editor:not(.sme-writing)>.sme-tools{width:100%}
 .social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-stage{padding:12px!important;margin-bottom:8px}
 .social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-canvas-wrap{width:min(100%,180px)!important}
 .social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-canvas-wrap:has(canvas[height="675"]){width:min(100%,240px)!important}
 .social-dialog.social-workspace .sme-writing{grid-template-rows:52px minmax(0,1fr) auto;align-content:start}
 .social-dialog.social-workspace .sme-writing .sme-stage{max-height:380px;flex:none!important;height:100%}
 .social-dialog.social-workspace .sme-writing .sme-stage-boundary{justify-content:center}
 .social-dialog.social-workspace .sme-writing .sme-tools{padding:8px 10px max(8px,env(safe-area-inset-bottom));max-height:55%}
 .social-dialog.social-workspace .sme-writing[data-writing-panel=type] .sme-tools{max-height:none}
 .social-dialog.social-workspace .sme-writing .sme-writing-input-row{align-items:center}
 .social-dialog.social-workspace .sme-writing .sme-writing-input-row>button{min-width:44px;min-height:48px}
}

/* Mobile writing is its own viewport, outside the modal's scrolling layout. */
.social-dialog.social-workspace[data-writing-host=true]{position:fixed!important;inset:auto 0 auto!important;top:var(--writing-top,0px)!important;height:var(--writing-height,100dvh)!important;max-height:none!important;width:100%!important;max-width:none!important;margin:0!important;transform:none!important;padding:0!important;border:0!important;border-radius:0!important;overflow:hidden!important}
.social-dialog [data-writing-hidden=true]{display:none!important}
.social-dialog [data-writing-branch=true]{display:contents!important;overflow:visible!important;transform:none!important;contain:none!important;filter:none!important}
.social-dialog.social-workspace[data-writing-host=true] .sme-writing{position:absolute!important;inset:0!important;top:0!important;width:100%!important;height:100%!important;max-height:none!important;align-items:stretch!important}
.social-dialog.social-workspace .sme-writing-header{min-height:52px;z-index:2;padding-top:max(4px,env(safe-area-inset-top,0px));}
.social-dialog.social-workspace .sme-writing .sme-tools{max-height:none!important;overflow:hidden!important;display:flex;flex-direction:column;min-height:0}
.social-dialog.social-workspace .sme-writing .sme-text-panel{min-height:0;max-height:100%;gap:6px}
.social-dialog.social-workspace .sme-writing .sme-text-panel textarea{height:48px;min-height:48px;max-height:64px;padding:10px;font-size:17px!important;line-height:24px}
.social-dialog.social-workspace .sme-writing-input-row{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.social-dialog.social-workspace .sme-writing-input-row>label{grid-column:1/-1}
.social-dialog.social-workspace .sme-writing-input-row>button{min-height:44px!important;font-size:14px!important;padding:6px 10px!important}
.social-dialog.social-workspace .sme-writing-options{min-height:0;max-height:none!important;overflow-y:auto;flex:1;padding:4px;scroll-padding:8px}
.social-dialog.social-workspace .sme-writing .sme-emoji{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.social-dialog.social-workspace .sme-writing .sme-emoji button{min-width:0;min-height:44px;font-size:24px!important}
.social-dialog.social-workspace .sme-writing-panel-head{flex:none;min-height:44px;padding-top:4px;gap:6px}
.social-dialog.social-workspace .sme-writing-help{font-size:11px;line-height:16px}
.social-hub{max-width:540px;margin:16px auto;display:grid;gap:16px}
.social-hub h3,.social-hub p{margin:0}.social-hub button{min-height:52px;border:1px solid #0077c8;border-radius:12px;padding:14px;background:#0077c8;color:white}
@media(max-width:700px){
 .social-dialog.social-workspace[data-writing-host=true] .sme-writing{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:calc(52px + env(safe-area-inset-top,0px)) minmax(80px,min(300px,calc(var(--writing-height,100dvh) - 196px - env(safe-area-inset-top,0px)))) auto!important}
 .social-dialog.social-workspace .sme-writing .sme-stage{max-height:300px!important;height:100%;flex:1!important}
 .social-dialog.social-workspace .sme-writing:not([data-writing-panel=type]) .sme-tools{height:min(360px,52%);height:min(360px,calc(var(--writing-height,100dvh) * .52))}
 .social-dialog.social-workspace .sme-writing[data-writing-panel=type] .sme-tools{height:auto;padding-bottom:6px}
 .social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-platform-preview{padding:10px;margin-bottom:0;gap:10px}
 .social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-canvas-wrap{width:min(100%,145px)!important}
 .social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-canvas-wrap:has(canvas[height="675"]){width:min(100%,190px)!important}
 .social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-stage{max-height:none!important}
 .social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-writing-input-row>button{display:block!important}
 .social-dialog.social-workspace>.social-header{padding-block:10px!important}.social-dialog.social-workspace>.social-header small{display:none}.social-dialog.social-workspace>.social-header h2{font-size:19px;margin:0}
}

/* Bound the canvas, not the preview plus its controls. Each control row owns its space. */
.social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-stage{display:flex;flex-direction:column;align-items:stretch;gap:12px;height:auto;max-height:none!important;margin-bottom:0}
.social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-stage>*{flex-shrink:0}
.social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-canvas-wrap{margin:0 auto}
.social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-text-actions,.social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-playback{position:static;margin:0;flex-wrap:wrap;gap:8px}
.social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-playback button{min-height:44px}
.social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-preview-note{margin:0;line-height:1.5}
.social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-direct-controls{padding-top:12px;border-top:1px solid #dedede}
.social-dialog.social-workspace .sme-editor:not(.sme-writing) .sme-direct-controls>p{margin:0;line-height:1.5}