:root { --page:#f8f1ee; --ink:#513c44; --accent:#b87583; --copy-color:#591123; --title-color:#77152a; --eyebrow-color:#5e1021; --cake-tint:#8b0f22; --cake-texture:url("assets/images/backgrounds/red-velvet-cake-crumb-v2.webp"); --cake-texture-size:cover; --cake-texture-repeat:no-repeat; --cake-texture-position:center center; --cake-texture-attachment:fixed; --cake-texture-blend:luminosity; --cake-nav-ink:#fff4df; --cake-nav-surface:rgb(35 20 23 / .88); --crust-color:#6f2418; --icing:#fff4df; --display-font:"Playwrite IT Moderna",cursive; --body-font:"DM Sans",sans-serif; }
* { box-sizing:border-box; } html,body { width:100%; min-height:100%; } html { overflow-x:clip; } body { margin:0; overflow:hidden; overflow-x:clip; background:#5b0613 url("assets/images/backgrounds/red-velvet-cake-crumb-v2.webp") center/cover no-repeat fixed; color:var(--ink); font-family:var(--body-font); }
.home-screen { position:relative; width:100%; height:100svh; min-height:500px; max-width:540px; margin:auto; overflow:visible; }.home-screen::before { content:""; position:fixed; z-index:1; inset:0; background:linear-gradient(90deg,rgb(255 248 238/.08),transparent 22%,transparent 78%,rgb(255 248 238/.08)); pointer-events:none; }.hero { position:relative; z-index:1; height:calc(100% - 3.5rem); }.hero-copy { position:absolute; top:clamp(4rem,11svh,7.5rem); left:clamp(1.35rem,9vw,3rem); width:min(72%,24rem); }.eyebrow { margin:0 0 .8rem; color:var(--eyebrow-color,#5e1021); font-size:.67rem; font-weight:500; letter-spacing:.15em; text-transform:uppercase; } h1,h2,p { margin-top:0; } h1 { margin:.35rem 0 .8rem; color:var(--title-color,#77152a); font-family:var(--display-font); font-size:clamp(3rem,14vw,4.8rem); font-weight:300; line-height:1.03; text-shadow:0 1px 0 rgb(255 255 255/.4); }.intro { max-width:20rem; margin-bottom:1.2rem; color:var(--copy-color,#591123); font-size:clamp(.88rem,3.8vw,1.05rem); line-height:1.55; }.inquire-link { border:0; padding:0; background:none; color:#5a1021; font:500 .92rem var(--body-font); cursor:pointer; }.inquire-link span { color:var(--accent); }
.frosting-band { position:fixed; z-index:0; left:50%; width:calc(100vw + 8rem); overflow:visible; border-radius:0; transform:translateX(-50%); background:var(--icing); }.frosting-band.contact-rendered { background:none; }.icing-contact-canvas { position:absolute; left:0; top:-28px; pointer-events:none; }.frosting-band-one { top:11.5svh; height:22svh; transform:translateX(-50%) rotate(calc(-.14deg + var(--layer-tilt,0deg))); }.frosting-band-two { top:66svh; height:18.5svh; transform:translateX(-50%) rotate(calc(.18deg + var(--layer-tilt,0deg))); }.frosting-band-three { top:89svh; height:16svh; border-radius:50% 48% 0 0/18% 16% 0 0; }
.frosting-band-four { top:41svh; height:8svh; border-radius:49% 51% 42% 47%/28% 25% 20% 18%; }.frosting-band-five { top:79svh; height:9svh; border-radius:44% 53% 45% 47%/25% 23% 21% 19%; }
.featured-cake { position:absolute; right:clamp(1.3rem,10vw,3.5rem); bottom:clamp(.75rem,4svh,2rem); width:min(64vw,18rem); height:clamp(11rem,29svh,18rem); margin:0; padding:.38rem; border-radius:5.5rem 5.5rem 1rem 1rem; background:rgb(255 248 238/.82); box-shadow:0 16px 32px rgb(61 0 10/.25); }.featured-cake img { display:block; width:100%; height:100%; border-radius:5rem 5rem .7rem .7rem; object-fit:cover; transition:border-radius .2s,filter .2s,object-position .2s; }.site-footer { position:absolute; z-index:2; right:1rem; bottom:.8rem; left:1rem; display:flex; justify-content:space-between; gap:1rem; color:#fff4e7; font-size:.61rem; letter-spacing:.12em; text-transform:uppercase; text-shadow:0 1px 3px rgb(48 0 8/.45); }.site-footer p { margin:0; }.site-footer a { color:inherit; }

.order-overlay { width:min(100%,540px); height:100svh; margin:0 auto; border:0; background:rgb(255 248 238/.96); color:var(--ink); }.order-overlay::backdrop { background:rgb(43 0 8/.66); }.order { position:relative; height:100%; padding:clamp(3.5rem,10svh,5.5rem) 1.5rem 2rem; overflow:auto; background:var(--page); }.order h2 { margin-bottom:1.4rem; color:var(--accent); font:400 clamp(1.8rem,7vw,2.65rem)/1.1 var(--display-font); }.section-kicker { margin-bottom:.6rem; color:var(--ink); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; }.close-order { position:absolute; top:1rem; right:1rem; display:grid; place-items:center; width:2.7rem; height:2.7rem; border:1px solid color-mix(in srgb,var(--accent),transparent 40%); border-radius:50%; background:transparent; color:var(--accent); font-size:1.5rem; }.order form { display:grid; gap:.8rem; }.order label { display:grid; gap:.35rem; color:#735660; font-size:.72rem; }.order input,.order textarea { width:100%; border:1px solid color-mix(in srgb,var(--accent),transparent 50%); border-radius:.6rem; background:white; color:var(--ink); padding:.75rem; font:400 .9rem var(--body-font); }.order textarea { resize:vertical; }.order form button[type="submit"] { justify-self:start; border:0; border-radius:999px; background:var(--ink); color:var(--page); padding:.8rem 1.1rem; font:500 .77rem var(--body-font); }.form-note { min-height:1.2em; margin:0; color:#735660; font-size:.72rem; line-height:1.4; }

.editor { position:fixed; top:40svh; right:1.25rem; bottom:auto; z-index:30; touch-action:none; }.editor-bauble { position:relative; z-index:2; width:3.25rem; height:3.25rem; font-size:1.2rem; cursor:grab; }.editor.is-focused .editor-bauble { font-size:1.45rem; }.editor-bauble:active { cursor:grabbing; }.editor-options { position:absolute; inset:0; pointer-events:none; }.editor-options button { position:absolute; z-index:1; width:3.1rem; height:3.1rem; padding:.25rem; font:500 .57rem/1.05 var(--body-font); text-align:center; opacity:0; transform:translate(0,0) scale(.45); transition:transform .3s cubic-bezier(.2,.75,.25,1),opacity .2s; }.editor-options button .icon { display:block; font-size:1.15rem; line-height:1.05; }.editor.is-open .editor-options { pointer-events:auto; }.editor.is-open .editor-options button { opacity:1; transform:translate(var(--x),var(--y)) scale(1); }.editor.is-focused .editor-options button { opacity:.14; transform:translate(var(--x),var(--y)) scale(.72); pointer-events:none; }.editor.is-focused .editor-options button.is-control { opacity:1; transform:translate(var(--x),var(--y)) scale(1); pointer-events:auto; }.editor.is-transitioning .editor-options { pointer-events:none; }.editor.is-transitioning .editor-options button { opacity:.12; transform:translate(var(--x),var(--y)) scale(.68); }.editor.is-transitioning .editor-options button.is-selected { opacity:1; transform:translate(var(--x),var(--y)) scale(1.06); }
.editor-panel { box-sizing:border-box; position:fixed; z-index:35; right:auto; bottom:auto; width:min(21rem,calc(100vw - 1rem)); max-height:calc(100svh - 1rem); max-height:calc(100dvh - 1rem); overflow:auto; padding:.8rem; border:1px solid var(--panel-line,#cdb9ff); border-radius:1rem; background:var(--panel-surface,#321b4b); color:var(--panel-ink,#fff); box-shadow:0 13px 32px rgb(12 3 24/.45); opacity:0; pointer-events:none; transition:opacity .18s,top .24s,left .24s; }.editor-panel.is-visible { opacity:1; pointer-events:auto; }.editor-panel h2 { margin:0 0 .65rem; color:var(--panel-ink,#fff); font:400 1rem var(--display-font); }.control-row { display:grid; grid-template-columns:minmax(5.8rem,1fr) minmax(8rem,1.15fr); align-items:center; gap:.45rem; padding:.3rem 0; font-size:.74rem; }.control-input { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:.45rem; min-width:0; }.control-row input[type="color"] { width:2.2rem; height:1.7rem; justify-self:end; padding:0; border:0; background:none; }.control-row input[type="range"] { width:100%; min-width:0; accent-color:var(--panel-action); }.control-row select { justify-self:end; max-width:100%; border:1px solid color-mix(in srgb,var(--panel-action),white 45%); border-radius:.5rem; background:var(--panel-surface); color:var(--panel-ink); padding:.35rem; font:inherit; }.editor-panel button { border:0; background:none; color:var(--panel-ink,#fff); padding:.4rem 0 0; font:500 .72rem var(--body-font); text-decoration:underline; cursor:pointer; }
.control-field.is-material-choice .control-row { grid-template-columns:minmax(0,1fr); }
.control-field.is-material-choice .control-input { grid-template-columns:minmax(0,1fr); }
.control-field.is-material-choice select { justify-self:stretch; width:100%; }
.control-field.is-food-choice .control-input { grid-template-columns:minmax(0,1fr) 1.15rem; align-items:center; }
.control-field.is-food-choice select { justify-self:stretch; width:100%; }
.cake-shade-swatch { display:block; width:1.05rem; height:1.05rem; border:1px solid var(--panel-line); border-radius:.25rem; box-shadow:inset 0 0 0 1px rgb(255 255 255/.3); }
.visually-hidden { 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; }
.text-editable { -webkit-touch-callout:none; }.text-editable:focus-visible:not(.is-editing) { outline:2px solid currentColor; outline-offset:.2rem; border-radius:.2rem; }.text-editable.is-editing { outline:1px dashed color-mix(in srgb,var(--accent),transparent 20%); outline-offset:.35rem; border-radius:.25rem; }.text-toolbar { position:fixed; z-index:20; display:flex; align-items:center; gap:.2rem; max-width:calc(100vw - 1rem); padding:.35rem; border:1px solid color-mix(in srgb,var(--accent),white 45%); border-radius:.85rem; background:color-mix(in srgb,var(--page),white 35%); box-shadow:0 10px 25px rgb(81 60 68/.16); }.text-toolbar button { min-width:2rem; min-height:2rem; border:0; border-radius:.5rem; background:transparent; color:var(--ink); font:500 .68rem var(--body-font); }.text-toolbar button[data-text-action="done"] { padding:0 .4rem; color:var(--accent); }
@media (max-width:360px) { .hero-copy { top:3.6rem; left:1.2rem; width:75%; }.featured-cake { right:1rem; width:62vw; height:25svh; }.site-footer { font-size:.55rem; }.editor { right:.75rem; bottom:.75rem; }.editor-bauble { width:3rem; height:3rem; }.editor-options button { width:2.8rem; height:2.8rem; } }

/* Layer rules: cake fields stay thick; frosting is thin, soft, and always overflows the viewport. */
body { background-color:var(--cake-tint); background-image:var(--cake-texture); background-size:var(--cake-texture-size,cover); background-repeat:var(--cake-texture-repeat,no-repeat); background-position:var(--cake-texture-position,center center); background-attachment:var(--cake-texture-attachment,fixed); background-blend-mode:var(--cake-texture-blend,luminosity); }
.hero-title { position:absolute; z-index:1; top:17svh; left:clamp(1.2rem,8vw,3rem); right:1rem; }.hero-description { position:absolute; z-index:1; top:56.5svh; left:clamp(1.2rem,8vw,3rem); right:clamp(1.2rem,8vw,3rem); }.hero-title .eyebrow { margin-bottom:.4rem; }.hero-title h1 { white-space:nowrap; margin:0; font-size:clamp(2.65rem,11.2vw,4rem); }.hero-description .intro { max-width:22rem; margin:0; }.page-links { position:absolute; z-index:1; top:69svh; right:1.1rem; left:1.1rem; display:flex; flex-wrap:wrap; gap:.55rem; }.page-links a,.page-links button { border:1px solid rgb(255 244 223/.7); border-radius:999px; background:rgb(87 5 20/.3); color:#fff4df; padding:.62rem .82rem; font:500 .68rem var(--body-font); letter-spacing:.04em; text-decoration:none; }.site-footer { bottom:1rem; }.featured-cake { display:none; }

/* Independent transparent toppers; the renderer seats them in the first icing band. */
.top-garnish { position:fixed; z-index:0; top:0; left:50%; width:calc(100vw + 8rem); height:11.5svh; overflow:hidden; transform:translateX(-50%); background:#1c1c1c; }.top-garnish[hidden] { display:none; }.static-toppers { position:absolute; bottom:-.5rem; left:50%; display:flex; justify-content:center; align-items:flex-end; width:min(22rem,74vw); transform:translateX(-50%); }.static-toppers img { display:block; width:50%; height:min(13svh,160px); object-fit:contain; object-position:center bottom; }.cake-garnish-canvas { position:absolute; z-index:3; pointer-events:none; }.garnish-charcoal { position:absolute; z-index:-1; left:0; width:100%; background:#1c1c1c; pointer-events:none; }.hero-title { top:15.5svh; }.hero-description { top:48.5svh; }
:root[data-topper-material]:not([data-topper-material="strawberryRosette"]) .static-toppers { visibility:hidden; }

.hero-title,.hero-description { left:clamp(1.25rem,8vw,3rem); right:clamp(1.25rem,8vw,3rem); display:grid; align-content:center; }.hero-title { top:11.5svh; height:22svh; }.hero-title .eyebrow { position:relative; z-index:2; margin:0 0 .18rem; font-size:clamp(.72rem,2.7vw,.92rem); }.hero-title h1 { position:relative; z-index:1; font-size:clamp(3.15rem,13.3vw,5rem); line-height:.98; }.hero-description { top:66svh; height:18.5svh; }.hero-description .intro { max-width:100%; margin:0; font-size:clamp(1.05rem,4.7vw,1.35rem); line-height:1.42; }


.text-toolbar[hidden] { display:none; }
.candy-colors-row { display:block; }.candy-colors-row .control-input { display:block; }
.candy-color-grid { display:grid; grid-template-columns:repeat(4,minmax(1.8rem,2.5rem)); justify-content:start; gap:.4rem; padding:.15rem 0 .3rem; }
.editor-panel .candy-color-swatch { width:2rem; height:2rem; padding:0; border:2px solid var(--panel-line); border-radius:50%; background:var(--swatch); text-decoration:none; box-shadow:inset 0 0 0 1px rgb(255 255 255/.45); }
.editor-panel .candy-color-swatch[aria-pressed="true"] { outline:2px solid var(--panel-action); outline-offset:2px; }
.candy-color-order { display:flex; flex-wrap:wrap; gap:.3rem; margin:.25rem 0 0; padding:0; list-style:none; }
.candy-color-order li { display:flex; align-items:center; gap:.2rem; padding:.15rem .35rem; border:1px solid color-mix(in srgb,var(--panel-line),transparent 30%); border-radius:999px; font-size:.65rem; }
.editor-panel .candy-color-order button { padding:.1rem; font-size:.65rem; }
.editor-panel .candy-color-order button:disabled { opacity:.4; cursor:default; }
@media (max-width:420px) { .candy-color-grid { grid-template-columns:repeat(3,minmax(1.8rem,2.5rem)); } }
@media (max-width:340px) { .candy-color-grid { grid-template-columns:repeat(2,minmax(1.8rem,2.5rem)); } }
@media (min-width:960px) { .desktop-editor .candy-color-grid { grid-template-columns:repeat(6,minmax(1.8rem,2.5rem)); } }
.universal-nav { position:fixed; z-index:14; right:.5rem; bottom:max(.45rem,env(safe-area-inset-bottom)); left:.5rem; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:.15rem; width:min(calc(100% - 1rem),36rem); margin-inline:auto; padding:.45rem .5rem; border:1px solid color-mix(in srgb,var(--cake-nav-ink),transparent 55%); border-radius:1.2rem; background:var(--cake-nav-surface,rgb(35 20 23 / .94)); box-shadow:0 8px 28px rgb(20 0 5/.35); }
.page-button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.2rem; min-width:0; min-height:3.65rem; padding:.15rem .05rem; border-radius:.75rem; color:var(--cake-nav-ink,#fff4df); text-align:center; text-decoration:none; }
.page-label { font-size:clamp(.64rem,2.6vw,.78rem); font-weight:600; line-height:1.1; overflow-wrap:anywhere; }
.page-icon { display:grid; place-items:center; width:1.75rem; height:1.75rem; border:1px solid color-mix(in srgb,var(--cake-nav-ink),transparent 52%); border-radius:50%; color:var(--cake-nav-ink,#fff4df); font:500 .95rem var(--body-font); }
.page-button:hover,.page-button.is-current { background:rgb(255 244 223/.13); color:#fff; }
.page-button.is-current .page-icon { background:#812c43; border-color:var(--cake-nav-ink,#fff4df); }
.page-button:focus-visible { outline:3px solid #ffdf86; outline-offset:3px; box-shadow:0 0 0 5px #45101d; }
@media (max-width:370px) { .universal-nav { gap:0; padding-inline:.25rem; }.page-button { min-height:3.45rem; }.page-label { font-size:.6rem; }.page-icon { width:1.55rem; height:1.55rem; } }
.page-links { display:none; }
.site-footer { bottom:calc(6rem + env(safe-area-inset-bottom)); flex-wrap:wrap; overflow-wrap:anywhere; padding:.42rem .6rem; border:1px solid color-mix(in srgb,var(--cake-nav-ink),transparent 72%); border-radius:.6rem; background:var(--cake-nav-surface,rgb(35 20 23 / .88)); color:var(--cake-nav-ink,#fff4df); text-shadow:none; }
.home-request-button { display:inline-flex; align-items:center; justify-content:center; justify-self:start; min-height:44px; max-width:100%; margin-top:.65rem; padding:.55rem .85rem; border:1px solid #6d2034; border-radius:999px; background:#6d2034; color:#fffaf2; font:600 .85rem/1.25 var(--body-font); text-decoration:none; overflow-wrap:anywhere; scroll-margin-bottom:8rem; }
.home-request-button:focus-visible { outline:3px solid #ffdf86; outline-offset:3px; box-shadow:0 0 0 5px #45101d; }
body[data-mode="public"] .hero-title h1 { min-width:0; white-space:normal; overflow-wrap:anywhere; font-size:clamp(2.25rem,11.7vw,4rem); }
body:not([data-mode="public"]) .home-request-button { display:none; }
body[data-mode="public"] [hidden] { display:none!important; }
body[data-mode="public"][data-long-site-copy] { overflow-y:auto; }
body[data-mode="public"][data-long-site-copy] .home-screen { height:auto; min-height:100svh; padding-bottom:calc(6.5rem + env(safe-area-inset-bottom)); }
body[data-mode="public"][data-long-site-copy] .hero { display:grid; height:auto; gap:clamp(2rem,12svh,8rem); padding:clamp(5rem,13svh,8rem) 1.25rem 1rem; }
body[data-mode="public"][data-long-site-copy] :is(.hero-title,.hero-description) { position:relative; inset:auto; height:auto; padding:1.1rem; border-radius:1rem; background:var(--icing); overflow-wrap:anywhere; }
body[data-mode="public"][data-long-site-copy] .hero-title h1 { white-space:normal; font-size:clamp(2rem,8vw,3.5rem); overflow-wrap:anywhere; }
body[data-mode="public"][data-long-site-copy] .site-footer { position:relative; inset:auto; margin:1rem 1.25rem; }
@media (max-height:700px) {
  body[data-mode="public"] { overflow-y:auto; }
  body[data-mode="public"] .home-screen { height:auto; min-height:100svh; padding-bottom:calc(6.5rem + env(safe-area-inset-bottom)); }
  body[data-mode="public"] .hero { display:grid; height:auto; gap:2rem; padding:clamp(5rem,13svh,8rem) 1.25rem 1rem; }
  body[data-mode="public"] :is(.hero-title,.hero-description) { position:relative; inset:auto; height:auto; padding:1.1rem; border-radius:1rem; background:var(--icing); overflow-wrap:anywhere; }
  body[data-mode="public"] .hero-title h1 { white-space:normal; font-size:clamp(2rem,8vw,3.5rem); overflow-wrap:anywhere; }
  body[data-mode="public"] .site-footer { position:relative; inset:auto; margin:1rem 1.25rem; }
}

/* Appearance editor palettes: branch tokens drive baubles, panels, labels, and controls. */
.editor { --branch-surface:#321b4b; --branch-ink:#fff; --branch-line:#cdb9ff; --branch-hover:#493064; --branch-accent:#cdb9ff; --panel-surface:#321b4b; --panel-ink:#fff; --panel-line:#8a75a4; --panel-action:#4e2c72; --panel-action-ink:#fff; --focus-outer:#fff; --focus-inner:#29123f; }
.editor[data-branch="colors"] { --branch-surface:#d9f2eb; --branch-ink:#143d36; --branch-line:#568b80; --branch-hover:#c5e8de; --branch-accent:#236b5b; --panel-surface:#e8f7f2; --panel-ink:#143d36; --panel-line:#568b80; --panel-action:#236b5b; --panel-action-ink:#fff; --focus-inner:#143d36; }
.editor[data-branch="fonts"] { --branch-surface:#fde1d2; --branch-ink:#50301f; --branch-line:#a26848; --branch-hover:#f8d1bd; --branch-accent:#844729; --panel-surface:#fff0e7; --panel-ink:#50301f; --panel-line:#a26848; --panel-action:#844729; --panel-action-ink:#fff; --focus-inner:#50301f; }
.editor[data-branch="layers"] { --branch-surface:#dce8fb; --branch-ink:#243858; --branch-line:#647ea5; --branch-hover:#c9daf4; --branch-accent:#355a8e; --panel-surface:#eaf0fc; --panel-ink:#243858; --panel-line:#647ea5; --panel-action:#355a8e; --panel-action-ink:#fff; --focus-inner:#243858; }
.editor[data-branch="cakeBlur"] { --branch-surface:#e3edd9; --branch-ink:#34442a; --branch-line:#728763; --branch-hover:#d2e2c5; --branch-accent:#4d6738; --panel-surface:#eef4e8; --panel-ink:#34442a; --panel-line:#728763; --panel-action:#4d6738; --panel-action-ink:#fff; --focus-inner:#34442a; }
.editor[data-branch="history"] { --branch-surface:#f2e6c9; --branch-ink:#4c3c1e; --branch-line:#927642; --branch-hover:#e8d9b2; --branch-accent:#715722; --panel-surface:#f8f1df; --panel-ink:#4c3c1e; --panel-line:#927642; --panel-action:#715722; --panel-action-ink:#fff; --focus-inner:#4c3c1e; }
.editor-panel[data-palette="colors"] { --panel-surface:#e8f7f2; --panel-ink:#143d36; --panel-line:#568b80; --panel-action:#236b5b; --panel-action-ink:#fff; --focus-inner:#143d36; }
.editor-panel[data-palette="fonts"] { --panel-surface:#fff0e7; --panel-ink:#50301f; --panel-line:#a26848; --panel-action:#844729; --panel-action-ink:#fff; --focus-inner:#50301f; }
.editor-panel[data-palette="layers"] { --panel-surface:#eaf0fc; --panel-ink:#243858; --panel-line:#647ea5; --panel-action:#355a8e; --panel-action-ink:#fff; --focus-inner:#243858; }
.editor-panel[data-palette="cakeBlur"] { --panel-surface:#eef4e8; --panel-ink:#34442a; --panel-line:#728763; --panel-action:#4d6738; --panel-action-ink:#fff; --focus-inner:#34442a; }
.editor-panel[data-palette="history"] { --panel-surface:#f8f1df; --panel-ink:#4c3c1e; --panel-line:#927642; --panel-action:#715722; --panel-action-ink:#fff; --focus-inner:#4c3c1e; }
.editor-bauble,.editor-options button { display:grid; place-items:center; border:1px solid var(--option-line,var(--branch-line)); border-radius:50%; background:var(--option-surface,var(--branch-surface)); color:var(--option-ink,var(--branch-ink)); box-shadow:0 9px 22px rgb(20 7 36/.34),inset 0 1px 0 rgb(255 255 255/.18); }
.editor-bauble { border-color:rgb(231 221 255/.72); background:#3d215f; color:#fff; box-shadow:0 9px 22px rgb(20 7 36/.34),inset 0 1px 0 rgb(255 255 255/.18); }
.editor-options button { transition:transform .42s cubic-bezier(.2,.92,.22,1.18) var(--delay,0ms),opacity .2s,background .2s; }
.editor-options button .icon { color:var(--option-ink,var(--branch-ink)); opacity:.58; }
.editor-options button .label { font-weight:700; }
.editor[data-branch="root"] .editor-options button { width:3.65rem; height:3.65rem; border-radius:50%; font-size:.59rem; line-height:1.05; }
.editor[data-branch="root"] .editor-options button .icon { font-size:1rem; opacity:.62; }
.editor[data-branch="root"] .editor-options button .label { max-width:3.4rem; font-size:.55rem; text-wrap:balance; }
.editor[data-branch="root"] .editor-options button[data-action="colors"] { --option-surface:#d9f2eb; --option-ink:#143d36; --option-line:#568b80; --option-hover:#c5e8de; }
.editor[data-branch="root"] .editor-options button[data-action="fonts"] { --option-surface:#fde1d2; --option-ink:#50301f; --option-line:#a26848; --option-hover:#f8d1bd; }
.editor[data-branch="root"] .editor-options button[data-action="layers"] { --option-surface:#dce8fb; --option-ink:#243858; --option-line:#647ea5; --option-hover:#c9daf4; }
.editor[data-branch="root"] .editor-options button[data-action="cakeBlur"] { --option-surface:#e3edd9; --option-ink:#34442a; --option-line:#728763; --option-hover:#d2e2c5; }
.editor[data-branch="root"] .editor-options button[data-action="history"] { --option-surface:#f2e6c9; --option-ink:#4c3c1e; --option-line:#927642; --option-hover:#e8d9b2; }
.editor-options button:hover,.editor-options button:active { background:var(--option-hover,var(--branch-hover)); }
.editor-bauble:focus-visible,.editor-options button:focus-visible,.editor-panel :is(button,input,select):focus-visible { outline:3px solid var(--focus-outer); outline-offset:3px; box-shadow:0 0 0 6px var(--focus-inner),0 9px 22px rgb(20 7 36/.34); }
.editor-panel h2,.editor-panel button { color:var(--panel-ink,#fff); }
.editor-panel h2 { font-family:"Dancing Script",cursive; font-size:1.3rem; }
.editor-panel p { margin:.3rem 0 .8rem; color:var(--panel-ink,#fff); font-size:.75rem; line-height:1.45; }
.control-row { color:var(--panel-ink,#fff); }
.control-row input[type="color"] { border:1px solid var(--panel-line); border-radius:.35rem; }
.control-row select { background:var(--panel-surface); color:var(--panel-ink); border-color:var(--panel-line); }
.editor-panel .panel-actions button { min-height:2.15rem; padding:.35rem .7rem; border:1px solid var(--panel-line); border-radius:999px; background:var(--panel-surface); color:var(--panel-ink); font-weight:700; text-decoration:none; }
.editor-panel .panel-actions button[data-confirm] { background:var(--panel-action); color:var(--panel-action-ink); }
.editor-panel .panel-actions { position:sticky; bottom:-.8rem; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.45rem; margin:.5rem -.8rem -.8rem; padding:.55rem .8rem .75rem; border-top:1px solid color-mix(in srgb,var(--panel-line),transparent 45%); background:var(--panel-surface); }
.editor-panel .panel-actions[hidden] { display:none !important; }
.editor-panel .transaction-summary { padding:.45rem .55rem; border-left:3px solid var(--panel-action); border-radius:.25rem; background:color-mix(in srgb,var(--panel-action),transparent 90%); font-weight:600; }
.editor-panel .panel-actions button:disabled { opacity:.45; cursor:not-allowed; }
.control-group { margin:.25rem 0; border-bottom:1px solid color-mix(in srgb,var(--panel-line),transparent 55%); }
.control-group summary { padding:.48rem 0; color:var(--panel-ink); font-size:.82rem; font-weight:700; cursor:pointer; }
.editor-panel .group-description,.editor-panel .control-help { margin:.15rem 0 .5rem; font-size:.7rem; line-height:1.4; }
.control-group .group-controls { padding-bottom:.35rem; }
.range-value { min-width:2.5rem; color:var(--panel-ink); font-size:.68rem; font-variant-numeric:tabular-nums; text-align:right; }
.editor-panel .panel-close { display:block; margin-left:auto; }
.editor-panel button:hover,.editor-panel button:active { filter:brightness(.93); }
.history-list { max-height:8rem; margin:.25rem 0; padding-left:1.2rem; overflow:auto; color:var(--panel-ink); font-size:.73rem; line-height:1.5; }

/* Desktop keeps the same schema-rendered panel in a right-side host. */
body[data-editor-mode="desktop"] { padding-right:var(--desktop-sidebar-width,24rem); }
body[data-editor-mode="desktop"] .universal-nav { right:auto; left:calc(var(--desktop-sidebar-width,24rem) + (100vw - var(--desktop-sidebar-width,24rem)) / 2); width:min(36rem,calc(100vw - var(--desktop-sidebar-width,24rem) - 1rem)); transform:translateX(-50%); }
.desktop-editor { display:none; }
#editor-mode-toggle { display:none; }
.desktop-editor[hidden],#editor-mode-toggle[hidden] { display:none !important; }
@media (min-width:960px) and (hover:hover) and (pointer:fine) {
  body[data-editor-mode="desktop"] .hero-title h1 { font-size:clamp(3rem,7vw,4.6rem); }
  #editor-mode-toggle { position:fixed; z-index:45; top:.8rem; left:.9rem; display:block; padding:.55rem .8rem; border:1px solid #cdb9ff; border-radius:999px; background:#3d215f; color:#fff; font:600 .76rem var(--body-font); box-shadow:0 5px 16px rgb(12 3 24/.3); cursor:pointer; }
  body[data-editor-mode="desktop"] .editor { visibility:hidden; pointer-events:none; }
  body[data-editor-mode="desktop"] .desktop-editor { --desktop-sidebar-width:24rem; position:fixed; z-index:40; top:0; right:0; bottom:0; display:flex; width:min(var(--desktop-sidebar-width),100vw); flex-direction:column; gap:.7rem; overflow:auto; padding:1rem; border-left:1px solid #8a75a4; background:#241336; color:#fff; box-shadow:-12px 0 32px rgb(12 3 24/.32); }
  .desktop-editor-head { display:flex; justify-content:space-between; align-items:center; gap:.6rem; color:#fff; font:600 .85rem var(--body-font); }
  .desktop-editor-head span { color:#d8caeb; font-size:.68rem; }
  .desktop-tabs { display:flex; flex:none; gap:.35rem; padding:.25rem; border:1px solid #66527d; border-radius:.8rem; background:#321b4b; }
  .desktop-tabs [role="tab"] { flex:1; min-height:2.35rem; border:1px solid transparent; border-radius:.55rem; background:transparent; color:#fff; font:600 .77rem var(--body-font); cursor:pointer; }
  .desktop-tabs [role="tab"][aria-selected="true"] { border-color:#cdb9ff; background:#493064; }
  .desktop-editor #desktop-editor-content { min-height:0; flex:1; }
  .desktop-editor .editor-panel.desktop-panel { --panel-surface:#321b4b; --panel-ink:#fff; --panel-line:#8a75a4; --panel-action:#4e2c72; --panel-action-ink:#fff; --focus-inner:#29123f; position:relative; inset:auto; width:100%; max-height:none; min-height:0; overflow:visible; padding:.8rem; border-radius:.8rem; opacity:1; pointer-events:auto; transition:none; box-shadow:none; }
  .desktop-editor .editor-panel.desktop-panel[data-palette="history"] { --panel-surface:#f8f1df; --panel-ink:#4c3c1e; --panel-line:#927642; --panel-action:#715722; --panel-action-ink:#fff; --focus-inner:#4c3c1e; }
  .desktop-editor .desktop-control-group[data-category="colors"] { --panel-surface:#e8f7f2; --panel-ink:#143d36; --panel-line:#568b80; --panel-action:#236b5b; --panel-action-ink:#fff; --focus-inner:#143d36; }
  .desktop-editor .desktop-control-group[data-category="fonts"] { --panel-surface:#fff0e7; --panel-ink:#50301f; --panel-line:#a26848; --panel-action:#844729; --panel-action-ink:#fff; --focus-inner:#50301f; }
  .desktop-editor .desktop-control-group[data-category="layers"] { --panel-surface:#eaf0fc; --panel-ink:#243858; --panel-line:#647ea5; --panel-action:#355a8e; --panel-action-ink:#fff; --focus-inner:#243858; }
  .desktop-editor .desktop-control-group[data-category="cakeBlur"] { --panel-surface:#eef4e8; --panel-ink:#34442a; --panel-line:#728763; --panel-action:#4d6738; --panel-action-ink:#fff; --focus-inner:#34442a; }
  .desktop-editor .desktop-control-group { margin:.35rem 0; padding:.15rem .65rem .4rem; border:1px solid color-mix(in srgb,var(--panel-line),transparent 35%); border-radius:.65rem; background:var(--panel-surface); color:var(--panel-ink); }
  .desktop-editor .desktop-control-group[hidden] { display:none !important; }
  .desktop-editor .desktop-control-group summary { color:var(--panel-ink); }
  .desktop-editor .desktop-control-group .group-description,.desktop-editor .desktop-control-group .control-row,.desktop-editor .desktop-control-group .control-help,.desktop-editor .desktop-control-group .range-value { color:var(--panel-ink); }
  .desktop-editor .desktop-control-group input[type="range"] { accent-color:var(--panel-action); }
  .desktop-editor .desktop-history { padding:.75rem; border:1px solid #927642; border-radius:.7rem; background:#f8f1df; color:#4c3c1e; }
  .desktop-editor .desktop-history[hidden] { display:none !important; }
  .desktop-history-actions { display:flex; flex-wrap:wrap; gap:.35rem; }
  .desktop-history-actions button { min-height:2rem; padding:.35rem .55rem; border:1px solid #927642; border-radius:999px; background:#f8f1df; color:#4c3c1e; font:600 .7rem var(--body-font); cursor:pointer; }
  .desktop-history-actions button:disabled { opacity:.5; }
  .desktop-editor .panel-actions { position:sticky; bottom:0; z-index:2; margin:.55rem -.8rem -.8rem; padding:.65rem .8rem; border-radius:0 0 .8rem .8rem; }
  .desktop-editor :is(button,input,select,summary):focus-visible,#editor-mode-toggle:focus-visible { outline:3px solid #fff; outline-offset:3px; box-shadow:0 0 0 6px #29123f; }
  .desktop-editor[hidden],#editor-mode-toggle[hidden] { display:none !important; }
}

@media (max-width:360px) { .hero-title h1 { font-size:clamp(2.5rem,12.2vw,2.75rem); }.editor { top:40svh; right:.75rem; bottom:auto; } }

/* Public home content and its five navigation links stay within one screen. */
html { height:100%; }
body[data-mode="public"] { height:100dvh; min-height:0; overflow:hidden; }
body[data-mode="public"] .home-screen { height:100dvh; min-height:0; overflow:hidden; }
body[data-mode="public"] .hero { height:100%; }
body[data-mode="public"] .hero-title { top:11.5dvh; height:auto; min-height:0; }
body[data-mode="public"] .hero-title .eyebrow { max-height:12dvh; overflow-wrap:anywhere; }
body[data-mode="public"] .hero-title h1 { max-height:24dvh; overflow-wrap:anywhere; }
body[data-mode="public"] .hero-description { top:48dvh; height:auto; min-height:0; }
body[data-mode="public"] .hero-description { width:min(calc(100% - 2.5rem),28rem); padding:.55rem .75rem; border:1px solid rgb(105 43 52/.2); border-radius:.85rem; background:color-mix(in srgb,var(--icing),transparent 6%); box-shadow:0 8px 24px rgb(35 0 10/.14); }
body[data-mode="public"] .hero-description .intro { max-height:25dvh; overflow-wrap:anywhere; }
body[data-mode="public"] .home-request-button { margin-top:.45rem; }
body[data-mode="public"] .site-footer { bottom:5.25rem; }
body[data-mode="public"] .universal-nav { grid-template-columns:repeat(5,minmax(0,1fr)); bottom:max(.3rem,env(safe-area-inset-bottom)); padding:.18rem .28rem; }
body[data-mode="public"] .page-button { min-height:3.45rem; }
body[data-mode="public"] .page-label { font-size:clamp(.68rem,3.4vw,.78rem); }
body[data-mode="public"][data-long-site-copy] { overflow:hidden; }
body[data-mode="public"][data-long-site-copy] .home-screen { height:100dvh; min-height:0; padding:0; }
body[data-mode="public"][data-long-site-copy] .hero { display:block; height:100%; padding:0; }
body[data-mode="public"][data-long-site-copy] :is(.hero-title,.hero-description) { position:absolute; inset-inline:clamp(1.25rem,8vw,3rem); height:auto; padding:0; border-radius:0; background:transparent; }
body[data-mode="public"][data-long-site-copy] .hero-title { top:10dvh; }
body[data-mode="public"][data-long-site-copy] .hero-title h1 { max-height:23dvh; font-size:clamp(2rem,10vw,3.8rem); line-height:1; }
body[data-mode="public"][data-long-site-copy] .hero-description { top:46dvh; }
body[data-mode="public"][data-long-site-copy] .hero-description .intro { max-height:27dvh; font-size:clamp(.94rem,4.2vw,1.2rem); line-height:1.35; }
body[data-mode="public"][data-long-site-copy] .site-footer { position:absolute; inset-inline:1rem; bottom:5.25rem; margin:0; }
@media (max-height:500px) {
  body[data-mode="public"] .hero-title { top:7dvh; }
  body[data-mode="public"] .hero-title .eyebrow { margin-bottom:.1rem; font-size:.68rem; }
  body[data-mode="public"] .hero-title h1 { max-height:22dvh; font-size:clamp(1.8rem,10dvh,3rem); line-height:.98; }
  body[data-mode="public"] .hero-description { top:38dvh; }
  body[data-mode="public"] .hero-description .intro { max-height:23dvh; font-size:clamp(.88rem,4vw,1.05rem); line-height:1.25; }
  body[data-mode="public"] .home-request-button { min-height:42px; margin-top:.25rem; padding:.45rem .75rem; }
  body[data-mode="public"] .site-footer { bottom:4.7rem; }
  body[data-mode="public"] .universal-nav { padding:.12rem .25rem; }
  body[data-mode="public"] .page-button { min-height:3.1rem; }
  body[data-mode="public"] .page-icon { width:1.55rem; height:1.55rem; }
  body[data-mode="public"][data-long-site-copy] .hero-title { top:6dvh; }
  body[data-mode="public"][data-long-site-copy] .hero-title h1 { font-size:clamp(1.75rem,9dvh,2.6rem); }
  body[data-mode="public"][data-long-site-copy] .hero-description { top:38dvh; }
  body[data-mode="public"][data-long-site-copy] .hero-description .intro { max-height:25dvh; font-size:.9rem; }
  body[data-mode="public"][data-long-site-copy] .site-footer { bottom:4.7rem; }
}
