.uk-hotspot-device .uk-compose-screen { position:relative; aspect-ratio:393 / 852; }
.uk-compose-app { position:absolute; inset:0 auto auto 0; width:393px; height:852px; transform:scale(var(--compose-scale,.69)); transform-origin:top left; color:#000; font:16px/normal Arial,Helvetica,sans-serif; background-image:url("data:image/svg+xml;utf8,<svg viewBox='0 0 393 852' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><rect x='0' y='0' height='100%' width='100%' fill='url(%23grad)' opacity='0.5'/><defs><radialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(-39.3 33.7 -15.545 -18.128 393 0.000084917)'><stop stop-color='rgba(239,238,204,1)' offset='0'/><stop stop-color='rgba(230,239,204,0)' offset='1'/></radialGradient></defs></svg>"), url("data:image/svg+xml;utf8,<svg viewBox='0 0 393 852' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><rect x='0' y='0' height='100%' width='100%' fill='url(%23grad)' opacity='0.30000001192092896'/><defs><radialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(-37.6 -106.2 48.987 -17.344 601 1443)'><stop stop-color='rgba(134,225,129,0.6)' offset='0'/><stop stop-color='rgba(198,215,209,0)' offset='1'/></radialGradient></defs></svg>"), url("data:image/svg+xml;utf8,<svg viewBox='0 0 393 852' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'><rect x='0' y='0' height='100%' width='100%' fill='url(%23grad)' opacity='0.5'/><defs><radialGradient id='grad' gradientUnits='userSpaceOnUse' cx='0' cy='0' r='10' gradientTransform='matrix(24.1 69.65 -32.127 11.117 -44 -210)'><stop stop-color='rgba(128,227,112,0.6)' offset='0'/><stop stop-color='rgba(198,215,209,0)' offset='1'/></radialGradient></defs></svg>"), linear-gradient(180deg, rgba(245, 244, 230, 0.6) 0%, rgba(252, 251, 239, 0.6) 100%), linear-gradient(90deg, rgb(245, 244, 230) 0%, rgb(245, 244, 230) 100%); }
.uk-compose-app *, .uk-compose-app *::before, .uk-compose-app *::after { box-sizing:border-box; }
.uk-compose-app button { font:inherit; color:inherit; cursor:pointer; box-shadow:none; }
.uk-compose-app button:focus-visible, .uk-compose-app textarea:focus-visible { outline:2px solid #6d6bff; outline-offset:3px; }
.uk-compose-app [hidden] { display:none!important; }
.uk-compose-status { position:absolute; top:0; left:0; width:393px; height:55px; display:flex; align-items:center; justify-content:space-between; padding:0 26px 0 56px; font-weight:600; }
.uk-compose-app .uk-compose-status img { width:83.401px; height:37px; display:block; margin:0; border:0; border-radius:0; }
.uk-compose-content { position:absolute; left:28px; top:96px; width:337px; }
.uk-compose-header { display:flex; align-items:center; justify-content:space-between; height:38px; }
.uk-compose-header strong { font-size:32px; line-height:38px; letter-spacing:-1.1px; font-weight:800; }
.uk-compose-reset { width:28px; height:38px; border:0; padding:7px; background:none; display:grid; place-items:center; }
.uk-compose-app .uk-compose-reset img { width:14.6px; height:14.6px; margin:0; border:0; border-radius:0; }
.uk-compose-alias { display:flex; align-items:center; gap:9px; width:100%; height:31px; padding:0; margin-top:48px; border:0; background:none; text-align:left; font-weight:600!important; letter-spacing:.32px; }
.uk-compose-app .uk-compose-alias img { width:64px; height:31px; display:block; border:0; border-radius:0; margin:0; }
.uk-compose-post { position:relative; height:168px; margin-top:36px; border-radius:14px; background:#fff; box-shadow:-.5px .5px 6px #3e504b05; transition:background-color .24s ease; }
.uk-compose-app textarea { position:absolute; inset:32px 24px auto; width:289px; height:74px; padding:0; margin:0; border:0; border-radius:0; resize:none; background:transparent; color:#000; font:400 16.5px/1.25 Arial,Helvetica,sans-serif; }
.uk-compose-app textarea::placeholder { color:#0006; opacity:1; }
.uk-compose-post-tools { position:absolute; left:24px; bottom:22px; display:flex; gap:8px; }
.uk-compose-app .uk-compose-post-tools img { display:block; width:26px; height:26px; border:0; margin:0; border-radius:0; }
.uk-compose-app .uk-compose-resize { position:absolute; right:24px; bottom:22px; width:10px; height:10px; border:0; margin:0; border-radius:0; }
.uk-compose-category { margin-top:36px; min-height:53px; padding:16px 18px 18px; border-radius:18px; background:#fdfefc; }
.uk-compose-category-title { display:block; border:0; padding:0; background:none; text-align:left; font-weight:600!important; line-height:19px!important; }
.uk-compose-selected { display:flex; align-items:center; gap:4px; margin-top:21px; height:32px; }
.uk-compose-selected button { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:6px 14px; border:0; border-radius:18px; background:#e7ebdf; color:#33413d; white-space:nowrap; }
.uk-compose-selected button[data-tag="accept"] { background:#eaf0ff; color:#000; font-size:15px; }
.uk-compose-app .uk-compose-body-icon { width:7.342px; height:16.537px; margin:0; border:0; border-radius:0; }
.uk-compose-app .uk-compose-tag-close { width:8px; height:8px; margin:0; border:0; border-radius:0; }
.uk-compose-selected .uk-compose-edit { width:32px; height:32px; padding:0; background:none; }
.uk-compose-app .uk-compose-edit img { width:32px; height:32px; border:0; margin:0; border-radius:0; }
.uk-compose-actions { display:flex; flex-direction:column; align-items:center; gap:16px; padding-top:60px; }
.uk-compose-actions button { padding:8px 32px; border:0; border-radius:12px; background:#6d6bff; color:#fff; font-weight:600; line-height:19px; }
.uk-compose-actions button:disabled { cursor:default; background:#dfe7cd66; color:#3e484699; }
.uk-compose-actions .uk-compose-save { padding:8px 24px; background:#d8e1cc; color:#000b; font-size:15px; font-weight:500; }
.uk-compose-app.has-tags .uk-compose-actions { padding-top:50px; }
.uk-compose-app.has-tags .uk-compose-actions button { font-size:15px; line-height:18px; }
.uk-compose-app.has-tags .uk-compose-save { font-size:14px; line-height:17px; color:#33413d; }
.uk-compose-app.is-anonymous .uk-compose-post { background:#33413d; }
.uk-compose-app.is-anonymous textarea { color:#fff; }
.uk-compose-app.is-anonymous textarea::placeholder { color:#fff6; }
.uk-compose-app.is-anonymous .uk-compose-publish:not(:disabled) { background:#33413d; }
.uk-compose-feedback { position:absolute; left:28px; bottom:56px; width:337px; margin:0; text-align:center; font-size:14px; line-height:1.5; color:#33413d; }
@media(prefers-reduced-motion:reduce) { .uk-compose-post { transition:none; } }

.uk-compose-app textarea { overflow:hidden; }
.uk-hotspot-device .uk-compose-screen { aspect-ratio:auto; }

.uk-compose-app textarea[readonly],
.uk-compose-app textarea[readonly]:focus,
.uk-compose-app textarea[readonly]:focus-visible {
  outline:none;
  box-shadow:none;
  caret-color:transparent;
  cursor:default;
}

.uk-compose-auto-title {
  position:absolute; top:24px; left:24px; right:24px;
  padding-bottom:12px; border-bottom:1px solid #33413d12;
  color:#000; font:700 16px/1.3 Arial,Helvetica,sans-serif;
}
.uk-compose-app.has-text textarea { top:72px; }
.uk-compose-app.is-anonymous .uk-compose-auto-title { color:#fff; border-bottom-color:#ffffff20; }

.uk-compose-app .uk-compose-resize-handle {
  position:absolute; right:12px; bottom:10px;
  width:34px; height:34px; display:grid; place-items:center;
  margin:0; padding:0; border:0; border-radius:6px; background:transparent;
  cursor:ns-resize; touch-action:none; user-select:none;
}
.uk-compose-app .uk-compose-resize-handle .uk-compose-resize {
  position:static; width:10px; height:10px; pointer-events:none;
}

/* Unfold downward while the surrounding form follows the new height. */
.uk-compose-app .uk-compose-post {
 transition:height 1000ms cubic-bezier(.4,0,.2,1),background-color 240ms ease;
}
.uk-compose-app textarea { transition:top 1000ms cubic-bezier(.4,0,.2,1); }
@media(prefers-reduced-motion:reduce) {
 .uk-compose-app .uk-compose-post, .uk-compose-app textarea { transition:none; }
}

/* One flow layout prevents content crossing while the outer box unfolds. */
.uk-compose-app .uk-compose-post { padding:24px 24px 22px; overflow:hidden; }
.uk-compose-app .uk-compose-auto-title {
 position:relative; inset:auto; display:block; margin:0 0 16px; width:100%;
}
.uk-compose-app textarea,
.uk-compose-app.has-text textarea {
 position:relative; inset:auto; display:block; width:100%; margin:0;
 transition:none;
}
.uk-compose-app:not(.has-text) textarea { margin-top:8px; }
.uk-compose-app .uk-compose-post-tools { position:relative; inset:auto; display:flex; margin-top:24px; height:26px; }
/* Demo controls should not retain a text-selection rectangle after clicking. */
.uk-compose-app .uk-compose-actions button {
  user-select:none;
  -webkit-user-select:none;
  text-shadow:none;
  background-image:none;
}
.uk-compose-app .uk-compose-actions button::selection {
  background:transparent;
}