/* v4.97 — the same frame silhouette drives the finish and its glow. */
.yap.has-yap-frame, .yap-frame-sample.has-yap-frame { position:relative; overflow:visible!important; isolation:isolate; }
.yap-frame-layer { position:absolute; inset:0; border-radius:var(--ui-radius-surface,34px); pointer-events:none; }
.yap-frame-finish { z-index:2; }
.yap-frame-rim { position:absolute; inset:0; border-radius:inherit; padding:6px; background:var(--frame-paint); -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); mask-composite:exclude; }
.yap-frame-corner { position:absolute; width:44px; height:44px; background:var(--frame-corner) center/contain no-repeat; }
.yap-frame-tl { top:-5px; left:-5px; }
.yap-frame-tr { top:-5px; right:-5px; transform:rotate(90deg); }
.yap-frame-br { bottom:-5px; right:-5px; transform:rotate(180deg); }
.yap-frame-bl { bottom:-5px; left:-5px; transform:rotate(270deg); }
.yap-frame-rail { position:absolute; background-repeat:repeat-x; background-image:var(--frame-rail-h); background-size:110px 24px; background-position:center; }
.yap-frame-top, .yap-frame-bottom { left:48px; right:48px; height:24px; }
.yap-frame-top { top:-6px; }
.yap-frame-bottom { bottom:-6px; transform:rotate(180deg); }
.yap-frame-left, .yap-frame-right { top:50px; bottom:50px; width:24px; background-image:var(--frame-rail-v); background-repeat:repeat-y; background-size:24px 110px; }
.yap-frame-left { left:-6px; }
.yap-frame-right { right:-6px; transform:rotate(180deg); }
[data-yap-frame="kitty"] .yap-frame-tr, [data-yap-frame="kitty"] .yap-frame-bl { transform:none; }
[data-yap-frame="kitty"] .yap-frame-tl, [data-yap-frame="kitty"] .yap-frame-br { --frame-corner:url('./yap-frames/bow.svg?v=496'); transform:none; }
/* Alpha masks follow every ornament, link and bead; no guessed outline offset. */
.yap-frame-aura { z-index:0; filter:blur(3px) brightness(1.3); opacity:1; }
.yap-frame-aura .yap-frame-rim { background:var(--yap-edge-paint,linear-gradient(#5C77FF,#5C77FF)); }
.yap-frame-aura .yap-frame-corner { background:linear-gradient(var(--public-yap-glow),var(--public-yap-glow)); -webkit-mask:var(--frame-corner) center/contain no-repeat; mask:var(--frame-corner) center/contain no-repeat; }
.yap-frame-aura .yap-frame-tl { background:linear-gradient(var(--frame-glow-tl,var(--public-yap-glow)),var(--frame-glow-tl,var(--public-yap-glow))); }
.yap-frame-aura .yap-frame-tr { background:linear-gradient(var(--frame-glow-tr,var(--public-yap-glow)),var(--frame-glow-tr,var(--public-yap-glow))); }
.yap-frame-aura .yap-frame-br { background:linear-gradient(var(--frame-glow-br,var(--public-yap-glow)),var(--frame-glow-br,var(--public-yap-glow))); }
.yap-frame-aura .yap-frame-bl { background:linear-gradient(var(--frame-glow-bl,var(--public-yap-glow)),var(--frame-glow-bl,var(--public-yap-glow))); }
.yap-frame-aura .yap-frame-rail { background:var(--yap-edge-paint,linear-gradient(#5C77FF,#5C77FF)); -webkit-mask:var(--frame-rail-h) center/110px 24px repeat-x; mask:var(--frame-rail-h) center/110px 24px repeat-x; }
.yap-frame-aura .yap-frame-left, .yap-frame-aura .yap-frame-right { -webkit-mask:var(--frame-rail-v) center/24px 110px repeat-y; mask:var(--frame-rail-v) center/24px 110px repeat-y; }
.yap.public-yap-glow.has-yap-frame { border-color:transparent!important; box-shadow:none!important; }
.yap.public-yap-glow.has-yap-frame::before, .yap.public-yap-glow.has-yap-frame::after { display:none!important; }
.yap-frame-sample > .yap-frame-aura { display:none; }
[data-yap-frame="basic"] { --frame-paint:linear-gradient(135deg,#7c8da5,#fff 20%,#bac9de 40%,#fbfdff 60%,#75869f 80%,#fff); --frame-corner:url('./yap-frames/basic.svg?v=496'); --frame-rail-h:url('./yap-frames/basic-rail.svg?v=496'); --frame-rail-v:url('./yap-frames/basic-rail-v.svg?v=496'); }
[data-yap-frame="double"] { --frame-paint:linear-gradient(135deg,#718ba3,#faffff 18%,#bcd4e2 32%,#fff 48%,#6e879a 62%,#f0fcff 80%,#aac3d9); --frame-corner:url('./yap-frames/double.svg?v=496'); --frame-rail-h:url('./yap-frames/double-rail.svg?v=496'); --frame-rail-v:url('./yap-frames/double-rail-v.svg?v=496'); }
[data-yap-frame="kitty"] { --frame-paint:radial-gradient(circle,#fff7fb 0 1px,transparent 1.5px) 0 0/9px 9px,linear-gradient(135deg,#ffe9f1,#ff85b2 40%,#ffcae2 65%,#fff3f8); --frame-corner:url('./yap-frames/kitty.svg?v=496'); --frame-rail-h:url('./yap-frames/kitty-rail.svg?v=496'); --frame-rail-v:url('./yap-frames/kitty-rail-v.svg?v=496'); }
[data-yap-frame="alternative"] { --frame-paint:repeating-linear-gradient(135deg,#12151e 0 5px,#6b7387 5px 6px,#242a38 6px 11px); --frame-corner:url('./yap-frames/alternative.svg?v=496'); --frame-rail-h:url('./yap-frames/alternative-rail.svg?v=496'); --frame-rail-v:url('./yap-frames/alternative-rail-v.svg?v=496'); }
[data-yap-frame="emo"] { --frame-paint:linear-gradient(135deg,#08080d,#433548 25%,#121017 52%,#66536a 72%,#0c0a10); --frame-corner:url('./yap-frames/emo.svg?v=496'); --frame-rail-h:url('./yap-frames/emo-rail.svg?v=496'); --frame-rail-v:url('./yap-frames/emo-rail-v.svg?v=496'); }
[data-yap-frame="scene"] { --frame-paint:repeating-conic-gradient(#0d0b16 0 25%,#fff 0 50%) 0 0/7px 7px; --frame-corner:url('./yap-frames/scene.svg?v=496'); --frame-rail-h:url('./yap-frames/scene-rail.svg?v=496'); --frame-rail-v:url('./yap-frames/scene-rail-v.svg?v=496'); }
[data-yap-frame="gold"] { --frame-paint:linear-gradient(135deg,#81551b,#fff1bc 16%,#be8d2f 32%,#fce09b 47%,#80521a 63%,#fff3be 79%,#b78934); --frame-corner:url('./yap-frames/gold.svg?v=496'); --frame-rail-h:url('./yap-frames/gold-rail.svg?v=496'); --frame-rail-v:url('./yap-frames/gold-rail-v.svg?v=496'); }
[data-yap-frame="silver"] { --frame-paint:linear-gradient(135deg,#6d7c91,#fff 18%,#9eb0c7 32%,#ebf5ff 50%,#65748a 64%,#fff 80%,#a5b8d1); --frame-corner:url('./yap-frames/silver.svg?v=496'); --frame-rail-h:url('./yap-frames/silver-rail.svg?v=496'); --frame-rail-v:url('./yap-frames/silver-rail-v.svg?v=496'); }
[data-yap-frame="chrome"] { --frame-paint:linear-gradient(155deg,#0b1429,#f4ffff 14%,#769bc0 23%,#fff 27%,#151b30 43%,#859ebb 59%,#fff 63%,#7695b8 72%,#0d182a 88%,#e6f4ff); --frame-corner:url('./yap-frames/chrome.svg?v=496'); --frame-rail-h:url('./yap-frames/chrome-rail.svg?v=496'); --frame-rail-v:url('./yap-frames/chrome-rail-v.svg?v=496'); }
[data-yap-frame="scene"] > .yap-frame-finish { box-shadow:0 0 0 1px #ff38be,inset 0 0 0 1px #76fff1; }
/* Wide desktop workspace, with the preview centered independently of controls. */
#yapEditorModal { z-index:2147483639!important; padding:12px!important; }
#yapEditorMenu { width:min(1280px,calc(100vw - 24px))!important; height:min(900px,calc(100dvh - 24px))!important; max-width:none!important; max-height:none!important; padding:20px!important; display:grid!important; grid-template-rows:auto minmax(0,1fr) auto!important; gap:16px!important; overflow:hidden!important; }
#yapEditorMenu > .device-preferences-modal-heading { margin:0!important; padding:0 44px 0 4px; }
#yapEditorContent { display:grid!important; grid-template-columns:minmax(0,1fr) 360px!important; gap:20px!important; min-height:0; min-width:0; overflow:hidden!important; padding:0!important; }
#yapEditorCanvas { display:grid!important; grid-template-rows:minmax(0,1fr) auto; min-width:0; min-height:0; padding:4px; border:1px solid var(--glass-border); border-radius:var(--ui-radius-panel,34px); background:var(--glass-panel); }
#yapEditorPreview { display:flex; flex-direction:column; align-items:center; min-width:0; min-height:0; overflow:auto; padding:28px 22px; overscroll-behavior:contain; scrollbar-width:thin; }
#yapEditorPreview .yap { box-sizing:border-box; width:100%; max-width:540px; min-width:0; margin:auto 0!important; flex-shrink:0; animation:none!important; transition:none!important; }
#yapEditorPreview .yap-text { white-space:normal!important; overflow-wrap:anywhere!important; word-break:break-all!important; max-width:100%; box-sizing:border-box; }
#yapEditorSizeControl { padding:12px 20px 18px; gap:10px; }
#yapEditorSizeValue { color:var(--secondary-text); font-variant-numeric:tabular-nums; }
#yapEditorControls { min-height:0; min-width:0; display:flex!important; flex-direction:column; gap:14px; overflow-y:auto!important; overflow-x:hidden; padding:4px 9px 12px 0; overscroll-behavior:contain; scrollbar-width:thin; }
#yapEditorGlowControls { min-width:0; }
#yapEditorGlowControls > #plusYapGlowBlock { margin:0; }
#yapEditorFrameBlock { padding:16px!important; }
#yapEditorFrames { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:12px!important; padding:8px 2px 2px; }
#yapEditorFrames > button.yap-frame-choice { box-sizing:border-box; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:flex-start!important; gap:14px!important; width:100%!important; min-width:0!important; height:auto!important; min-height:124px!important; max-height:none!important; margin:0!important; padding:17px 10px 12px!important; border-radius:22px!important; border:1px solid var(--border)!important; background:var(--button)!important; color:var(--text)!important; overflow:visible!important; transform:none!important; box-shadow:inset 0 1px 0 var(--glass-highlight)!important; }
#yapEditorFrames > button.yap-frame-choice.active { border-color:var(--primary)!important; background:var(--highlight)!important; box-shadow:inset 0 0 0 1px var(--primary)!important; }
#yapEditorFrames > button.yap-frame-choice:focus-visible { outline:2px solid var(--primary); outline-offset:2px; }
#yapEditorFrames .yap-frame-sample { position:relative!important; display:grid!important; place-items:center!important; flex:0 0 66px!important; width:calc(100% - 12px)!important; max-width:112px!important; min-width:0!important; height:66px!important; min-height:66px!important; max-height:none!important; margin:0!important; padding:0!important; overflow:visible!important; background:var(--card)!important; border:1px solid var(--border); border-radius:18px!important; --ui-radius-surface:18px; }
#yapEditorFrames .yap-frame-name { display:block!important; position:static!important; width:100%!important; height:auto!important; min-height:0!important; max-height:none!important; margin:0!important; padding:0!important; font-family:inherit; font-size:12px!important; line-height:1.25!important; font-weight:650!important; white-space:normal!important; color:var(--text)!important; }
#yapEditorFrames .frame-sample-dollars { display:block!important; opacity:.45; color:var(--text)!important; letter-spacing:3px; font-size:13px!important; }
#yapEditorFrames .yap-frame-corner { width:28px; height:28px; }
#yapEditorFrames .yap-frame-top, #yapEditorFrames .yap-frame-bottom { left:28px; right:28px; background-size:75px 20px; height:20px; }
#yapEditorFrames .yap-frame-left, #yapEditorFrames .yap-frame-right { top:28px; bottom:28px; }
#yapEditorFooter { display:flex!important; align-items:center; justify-content:space-between; gap:16px; padding:14px 4px 0!important; margin:0!important; border-top:1px solid var(--border); }
#yapEditorFooter .button-row { display:flex; gap:10px; margin:0; flex:0 0 auto; }
#yapEditorFooter button { min-width:96px; }
#yapEditorStatus { margin:0!important; font-size:12px!important; }
#yapEditorStatus:empty { display:none!important; }
#yapEditorRetry[hidden] { display:none!important; }
#yapEditorRetry { min-width:0!important; margin:6px 0 0; padding:4px 12px; }
@media (max-width:900px) {
 #yapEditorMenu { padding:16px 12px!important; }
 #yapEditorContent { grid-template-columns:1fr!important; display:block!important; overflow:auto!important; }
 #yapEditorCanvas { min-height:310px; max-height:58dvh; margin-bottom:14px; }
 #yapEditorPreview { max-height:44dvh; }
 #yapEditorControls { overflow:visible!important; padding:0 4px 8px; }
 #yapEditorFrames { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
}
@media (max-width:480px) {
 #yapEditorModal { padding:6px!important; }
 #yapEditorMenu { width:calc(100vw - 12px)!important; height:calc(100dvh - 12px)!important; gap:12px!important; }
 #yapEditorPreview { padding:24px 16px; }
 #yapEditorFrames { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
 #yapEditorFooter { gap:8px; }
 #yapEditorFooter button { min-width:72px; }
}

/* Shared actual-feed header and action geometry. */
@media (max-width: 640px){#yapEditorPreview .yap-preview-group > .yap{
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
  }}
@media (max-width: 640px){#yapEditorPreview .yap-preview-group > .yap{
    margin-top: 0;
  }}
#yapEditorPreview .post-actions{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
#yapEditorPreview .post-actions.question-snippet-actions{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
#yapEditorPreview .post-actions button{
  gap: 5px;
  padding-inline: 10px;
  white-space: nowrap;
}
#yapEditorPreview .post-actions .like-button span{
  overflow: visible;
  text-overflow: clip;
}
@media (max-width: 700px){#yapEditorPreview .post-actions{
    gap: 7px;
  }
#yapEditorPreview .post-actions button{
    padding-inline: 7px;
    font-size: clamp(11.5px, 3.45vw, 14px) !important;
  }}

#yapEditorPreview .yap-preview-group > .yap{
  animation: yapperContentIn 390ms var(--yapper-motion-spring) both;
}
#yapEditorPreview .post-author-information{
  flex: 1 1 auto;
  min-width: 0;
}
#yapEditorPreview .delete-yap-top{
  flex: 0 0 auto;
  align-self: flex-start;
  width: auto !important;
  min-width: 0 !important;
  height: 30px !important;
  min-height: 30px !important;
  margin: 1px 0 0 auto !important;
  padding: 0 10px !important;
  border-radius: 9999px !important;
  border: 1px solid color-mix(in srgb, var(--border) 86%, transparent) !important;
  background: color-mix(in srgb, var(--input) 78%, transparent) !important;
  color: var(--secondary-text) !important;
  font-size: 11px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  white-space: nowrap;
  box-shadow: none !important;
}
#yapEditorPreview .delete-yap-top:is(:hover, :active, :focus-visible){
  color: var(--text) !important;
  border-color: color-mix(in srgb, var(--primary) 52%, var(--border)) !important;
  background: color-mix(in srgb, var(--primary) 9%, var(--input)) !important;
}
#yapEditorPreview .post-actions:not(.question-snippet-actions){
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 9px !important;
  width: 100% !important;
  margin-top: 13px !important;
}
#yapEditorPreview .post-actions:not(.question-snippet-actions) > button{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 10px !important;
  white-space: nowrap !important;
}
#yapEditorPreview .post-actions .action-count{
  display: inline-block;
  min-width: 0;
  overflow: visible;
  color: inherit;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
#yapEditorPreview .reply-yap-button{
  color: var(--text);
}
#yapEditorPreview .reply-yap-button.active{
  background: var(--primary) !important;
  color: var(--primary-text) !important;
  border-color: var(--primary) !important;
}
#yapEditorPreview .reply-action-icon,#yapEditorPreview .share-yap-button svg{
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#yapEditorPreview .yap-preview-group > .yap,#yapEditorPreview .feed-entry > .yap{
  padding-bottom: 16px !important;
  margin-top: 12px !important;
}
@media (max-width: 760px){#yapEditorPreview .yap-preview-group > .yap,#yapEditorPreview .feed-entry > .yap{
    margin-top: 0 !important;
    padding-bottom: 13px !important;
  }
#yapEditorPreview .post-actions:not(.question-snippet-actions){
    gap: 7px !important;
  }
#yapEditorPreview .post-actions:not(.question-snippet-actions) > button{
    height: 45px !important;
    min-height: 45px !important;
    padding-inline: 7px !important;
  }
#yapEditorPreview .delete-yap-top{
    height: 29px !important;
    min-height: 29px !important;
    padding-inline: 9px !important;
    font-size: 10.5px !important;
  }}
#yapEditorPreview .delete-yap-top,#yapEditorPreview .delete-yap-top:is(:hover, :active, :focus-visible){
  display: inline !important;
  flex: 0 0 auto !important;
  align-self: flex-start !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 2px 0 0 auto !important;
  padding: 2px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  color: var(--secondary-text) !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
  transform: none !important;
}
#yapEditorPreview .delete-yap-top:is(:hover, :focus-visible){
  color: var(--text) !important;
  text-decoration: underline !important;
}
#yapEditorPreview .reply-yap-button .reply-action-icon{
  width: 19px !important;
  height: 19px !important;
  flex: 0 0 19px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  shape-rendering: geometricPrecision;
}
#yapEditorPreview .reply-yap-button.active .reply-action-icon,#yapEditorPreview .reply-yap-button:not(.active) .reply-action-icon{
  fill: none !important;
  stroke: currentColor !important;
}
@media (max-width: 760px){#yapEditorPreview .delete-yap-top,#yapEditorPreview .delete-yap-top:is(:hover, :active, :focus-visible){
    margin-top: 1px !important;
    padding: 2px 0 !important;
    font-size: 12px !important;
  }}
#yapEditorPreview .post-actions:not(.question-snippet-actions){
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
#yapEditorPreview .repost-yap-button{
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  -webkit-touch-callout: none !important;
  touch-action: manipulation !important;
}
#yapEditorPreview .repost-yap-button > *{
  position: relative;
  z-index: 2;
}
#yapEditorPreview .repost-yap-button::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: color-mix(in srgb, var(--primary) 34%, transparent);
  transform: scaleX(0);
  transform-origin: left center;
  border-radius: inherit;
}
#yapEditorPreview .repost-yap-button.quote-hold-active::after{
  transform: scaleX(1);
  transition: transform var(--quote-hold-duration, 430ms) linear 20ms;
}
#yapEditorPreview .repost-yap-button.quote-hold-complete::after{
  transform: scaleX(1);
  transition: none;
}
#yapEditorPreview .repost-yap-button svg{
  width: 21px !important;
  height: 21px !important;
  flex: 0 0 21px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.15 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  overflow: visible !important;
}
#yapEditorPreview .repost-yap-button.reposted{
  color: var(--primary) !important;
  border-color: color-mix(in srgb, var(--primary) 48%, var(--border)) !important;
  background: color-mix(in srgb, var(--primary) 10%, var(--glass-control, var(--input))) !important;
}
#yapEditorPreview .post-actions.question-snippet-actions{
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
@media (max-width: 700px){#yapEditorPreview .post-actions:not(.question-snippet-actions){ gap: 7px !important; }
#yapEditorPreview .post-actions:not(.question-snippet-actions) > button{ gap: 5px !important; padding-inline: 6px !important; }}
@media (min-width: 701px){#yapEditorPreview .yap-preview-group > .yap,#yapEditorPreview .feed-entry > .yap{
    margin-left: auto !important;
    margin-right: auto !important;
  }
#yapEditorPreview .yap-preview-group > .yap,#yapEditorPreview .feed-entry > .yap{
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }}
@media (prefers-reduced-motion: reduce){#yapEditorPreview .repost-yap-button::after{ transition: none !important; }}
#yapEditorPreview .reply-author-row .avatar-profile-button{ overflow: visible !important; }
#yapEditorPreview .yap-moderation-actions .delete-yap-top{ margin-left:0!important; }
#yapEditorPreview .yap { margin:auto 0!important; max-width:540px!important; animation:none!important; transition:none!important; }


/* Keep the editor shells independent of their current choices and color count. */
:root { --yapper-editor-height:min(900px,calc(100dvh - 24px)); }
#customizationModal, #yapEditorModal { padding:12px!important; }
#customizationMenu, #customizationMenu.customization-scroll-ready,
#yapEditorMenu, #plusProfileEditorModal {
  box-sizing:border-box!important;
  height:var(--yapper-editor-height)!important;
  min-height:0!important;
  max-height:var(--yapper-editor-height)!important;
}
#customizationMenu, #customizationMenu.customization-scroll-ready {
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr)!important;
  overflow:hidden!important;
}
#customizationSettingsSection {
  min-height:0!important;
  min-width:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  align-content:start!important;
  grid-auto-rows:max-content!important;
  scrollbar-gutter:stable;
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
}
#yapEditorMenu > .device-preferences-modal-heading { grid-row:1; }
#yapEditorContent { grid-row:2; }
#yapEditorFooter { grid-row:3; }
#yapEditorControls {
  display:grid!important;
  grid-template-rows:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
  overflow:hidden!important;
  padding:4px 0!important;
}
#yapEditorGlowControls, #yapEditorFrameBlock {
  box-sizing:border-box!important;
  min-height:0!important;
  min-width:0!important;
  height:100%!important;
  max-height:100%!important;
  overflow:hidden!important;
}
#yapEditorGlowControls > #plusYapGlowBlock {
  box-sizing:border-box!important;
  display:flex!important;
  flex-direction:column;
  min-height:0!important;
  height:100%!important;
  max-height:100%!important;
  margin:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior-y:contain;
  scrollbar-width:thin;
  scrollbar-gutter:stable;
  -webkit-overflow-scrolling:touch;
}
#plusYapGlowBlock > * { flex-shrink:0!important; }
#yapEditorFrameBlock {
  display:grid!important;
  grid-template-rows:auto auto minmax(0,1fr)!important;
}
#yapEditorFrames {
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  align-content:start!important;
  grid-auto-rows:max-content!important;
  padding:12px 6px 16px!important;
  scrollbar-width:thin;
  scrollbar-gutter:stable;
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
}
#plusProfileEditorModal .plus-editor-body { min-height:0!important; overflow:hidden!important; }
#plusProfileEditorModal .plus-editor-panel {
  box-sizing:border-box!important;
  min-height:0!important;
  height:100%!important;
  max-height:100%!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-gutter:stable;
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
}
#plusProfileEditorModal .plus-editor-panel > .plus-editor-section { flex-shrink:0!important; }

/* One radius and paint geometry for every framed card, including the preview. */
.yap.has-yap-frame {
  --yap-frame-radius:var(--ui-radius-surface,34px);
  border-radius:var(--yap-frame-radius)!important;
  box-sizing:border-box;
}
.yap.has-yap-frame > .yap-frame-layer {
  position:absolute!important;
  inset:0!important;
  border-radius:var(--yap-frame-radius)!important;
  pointer-events:none!important;
}
/* Frame ornaments decorate the original card; they never change its layout box. */
@media (max-width:900px) {
  #yapEditorContent { overflow-y:auto!important; overflow-x:hidden!important; }
  #yapEditorControls { grid-template-rows:repeat(2,min(420px,52dvh))!important; }
}
@media (max-width:480px) {
  :root { --yapper-editor-height:min(900px,calc(100dvh - 12px)); }
  #customizationModal, #yapEditorModal { padding:6px!important; }
}

/* A normal-size card is grouped and scaled once. Its children keep feed geometry. */
#yapEditorPreview .yap-preview-wrapper { position:relative; flex:0 0 auto; margin:auto 0; min-height:1px; }
#yapEditorPreview .yap-preview-group { position:absolute; transform-origin:top left; display:flow-root; }
#yapEditorPreview .yap-preview-group > .yap {
 width:var(--yap-preview-width)!important; min-width:var(--yap-preview-width)!important;
 max-width:none!important; margin:0!important; animation:none!important; transition:none!important;
}
#yapEditorPreview { overflow-x:hidden; }
[data-yap-frame="duck"], [data-yap-frame="kuromi"] { --frame-upright:1; }
[data-yap-frame="duck"] .yap-frame-corner, [data-yap-frame="kuromi"] .yap-frame-corner { transform:none; }
[data-yap-frame="duck"] { --frame-paint:linear-gradient(135deg,#b6ece4,#fff0a8 30%,#e9bf53 60%,#c6f5e7); --frame-corner:url('./yap-frames/duck.svg?v=501'); --frame-rail-h:url('./yap-frames/duck-rail.svg?v=501'); --frame-rail-v:url('./yap-frames/duck-rail-v.svg?v=501'); }
[data-yap-frame="kuromi"] { --frame-paint:repeating-linear-gradient(135deg,#251e32 0 6px,#b88ada 6px 7px,#443052 7px 12px); --frame-corner:url('./yap-frames/kuromi.svg?v=501'); --frame-rail-h:url('./yap-frames/kuromi-rail.svg?v=501'); --frame-rail-v:url('./yap-frames/kuromi-rail-v.svg?v=501'); }
[data-yap-frame="sakura"] { --frame-paint:linear-gradient(135deg,#fff2f7,#ec9bbe 35%,#ab7598 60%,#ffe0ed); --frame-corner:url('./yap-frames/sakura.svg?v=501'); --frame-rail-h:url('./yap-frames/sakura-rail.svg?v=501'); --frame-rail-v:url('./yap-frames/sakura-rail-v.svg?v=501'); }
[data-yap-frame="celestial"] { --frame-paint:linear-gradient(135deg,#15233f,#7184aa 25%,#efdc9a 40%,#243552 65%,#bba171); --frame-corner:url('./yap-frames/celestial.svg?v=501'); --frame-rail-h:url('./yap-frames/celestial-rail.svg?v=501'); --frame-rail-v:url('./yap-frames/celestial-rail-v.svg?v=501'); }

/* Phone editors share a shorter surface, clear of the status bar and dock. */
@media (max-width:700px) {
 #customizationModal, #yapEditorModal {
  --yapper-editor-height:min(700px,74dvh,calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 104px));
  box-sizing:border-box!important;
  align-items:center!important;
  justify-content:center!important;
  padding:calc(env(safe-area-inset-top,0px) + 16px) 10px calc(env(safe-area-inset-bottom,0px) + 72px)!important;
 }
 #customizationMenu, #customizationMenu.customization-scroll-ready, #yapEditorMenu {
  width:calc(100vw - 20px)!important;
  max-width:calc(100vw - 20px)!important;
  height:var(--yapper-editor-height)!important;
  min-height:0!important;
  max-height:var(--yapper-editor-height)!important;
  margin:0!important;
  padding:16px 12px!important;
 }
 #yapEditorCanvas {
  min-height:0;
  height:clamp(210px,32dvh,300px);
  max-height:none;
 }
 #yapEditorPreview { max-height:none; padding:18px 12px; }
 #yapEditorControls { grid-template-rows:repeat(2,min(360px,46dvh))!important; }
}

/* Let desktop frame ornaments paint into the page gutters. The viewport still
   clips horizontal overflow; the centered body must not clip each card edge. */
@media (min-width:701px) {
 html > body:not(.modal-open) { overflow-x:visible!important; }
}

/* The viewport locks scrolling; the centered body keeps painting the feed's
   ornaments behind translucent desktop menus. */
@media (min-width:701px) {
 html > body.modal-open { overflow-x:visible!important; overflow-y:visible!important; }
 html:has(> body.modal-open) { overflow-y:hidden!important; scrollbar-gutter:stable; }
}

/* Space uses the same tint, shared-chat geometry and motion paints as the packs. */
.app-wallpaper-preview[data-pack="space"] { --pack-mask:url('./dm-theme-space-mask.png?v=501'); }
.dm-theme-preview-space {
 background-color:var(--card);
 background-image:url('./dm-theme-space-wallpaper.png?v=501');
 background-position:center;
 background-repeat:repeat;
 background-size:92px auto;
}
.dm-theme-preview-space::before, .dm-theme-preview-space::after { display:none; }
#dmConversationPanel[data-dm-theme="space"] .dm-message-viewport {
 width:calc(100% + var(--dm-theme-edge-left,0px) + var(--dm-theme-edge-right,0px))!important;
 max-width:none!important; margin:0!important;
 transform:translateX(calc(0px - var(--dm-theme-edge-left,0px)));
}
#dmConversationPanel[data-dm-theme="space"] .dm-message-list {
 padding-left:calc(var(--dm-theme-base-padding-left,12px) + var(--dm-theme-edge-left,0px))!important;
 padding-right:calc(var(--dm-theme-base-padding-right,12px) + var(--dm-theme-edge-right,0px))!important;
 background:transparent!important;
}
#dmConversationPanel[data-dm-theme="space"] .dm-theme-wallpaper {
 display:block; background-color:var(--card);
 background-image:url('./dm-theme-space-wallpaper.png?v=501');
 background-position:center top; background-repeat:repeat; background-size:360px auto;
}
#dmConversationPanel[data-dm-theme="space"] .dm-typing-row {
 margin-left:calc(var(--dm-theme-base-padding-left,12px) + var(--dm-theme-edge-left,0px))!important;
 margin-right:calc(var(--dm-theme-base-padding-right,12px) + var(--dm-theme-edge-right,0px))!important;
}

/* Bat membranes and curved wing spines follow the supplied Vampire design. */
[data-yap-frame="vampire"] {
 --frame-paint:linear-gradient(135deg,#120c15,#695161 22%,#201220 42%,#7d465a 63%,#130c16 82%,#49323e);
 --frame-corner:url('./yap-frames/vampire.svg?v=501');
 --frame-rail-h:url('./yap-frames/vampire-rail.svg?v=501');
 --frame-rail-v:url('./yap-frames/vampire-rail-v.svg?v=501');
}