/* One visual language for creating and personalizing a domo. */
#save-dialog.domo-form-dialog,#library-edit.domo-form-dialog{--form-light:#e3ebfc;--form-mid:#a8bce7;--form-deep:#687fb5;box-sizing:border-box;width:min(466px,calc(100vw - 28px));max-height:calc(100dvh - 28px);padding:26px 30px 20px;border:1px solid #fff;border-radius:32px;color:#47516a;background:radial-gradient(ellipse at 100% 0%,color-mix(in srgb,var(--form-light) 48%,#fff),transparent 55%),#f9fafc;box-shadow:inset 0 1px 0 #fff,0 30px 100px #1c2b5238;overflow:auto;transition:background .4s}
#save-dialog[data-form-palette=violet],#library-edit[data-form-palette=violet]{--form-light:#ede4f7;--form-mid:#baa4d6;--form-deep:#957bb8}
#save-dialog[data-form-palette=green],#library-edit[data-form-palette=green]{--form-light:#dfefe7;--form-mid:#a1cbbb;--form-deep:#5b998c}
#save-dialog[data-form-palette=sand],#library-edit[data-form-palette=sand]{--form-light:#f7e9d6;--form-mid:#e0be95;--form-deep:#b68a5c}
.domo-form-dialog::backdrop{background:#26334f48;backdrop-filter:blur(12px)}.domo-form-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.domo-form-top>span{font-size:8px;letter-spacing:1.8px;color:#959eb2}.domo-form-dialog .domo-form-top .icon-button{width:32px;height:32px;border-radius:50%;padding:0;display:grid;place-items:center;flex-shrink:0;border:1px solid #e5e9f2;background:#ffffff9c;color:#7b879f}.domo-form-top .icon-button span{display:grid;place-items:center;width:16px;height:16px}.domo-form-top .icon-button svg{display:block;width:16px;height:16px;stroke-width:1.4}
#save-dialog h2,#library-edit h2{font-size:26px;line-height:1.2;font-weight:450;letter-spacing:-.8px;margin:19px 0 8px;color:#3e475d}.domo-form-dialog .domo-form-intro{font-size:11px;color:#949db0;line-height:1.6;margin:0 0 21px}
.domo-form-preview{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;min-height:121px;padding:20px;border:1px solid #fff;border-radius:20px;background:linear-gradient(115deg,#ffffff80,color-mix(in srgb,var(--form-light) 85%,white));box-shadow:inset 0 1px 0 #fff,0 5px 17px -15px var(--form-deep);margin-bottom:22px}.form-preview-copy{position:relative;z-index:1;max-width:68%;}.form-preview-copy>span{font-size:7px;letter-spacing:1.8px;color:var(--form-deep)}.form-preview-copy strong{display:block;font-size:18px;line-height:1.3;font-weight:450;letter-spacing:-.4px;color:color-mix(in srgb,var(--form-deep) 65%,#3e495e);margin:10px 0 6px;overflow-wrap:anywhere}.form-preview-copy small{font-size:9px;color:var(--form-deep);opacity:.75}.form-preview-art{position:absolute;right:-1px;top:4px;width:124px;height:124px;pointer-events:none;opacity:.84}.form-preview-art i{position:absolute;inset:17px;display:block;border-radius:32%;background:radial-gradient(ellipse at 26% 19%,white,transparent 65%),linear-gradient(145deg,var(--form-light),var(--form-mid) 65%,var(--form-deep));transform:rotate(-18deg);box-shadow:inset 1px 2px 4px #fff8,0 14px 25px -20px var(--form-deep);transition:background .4s,border-radius .5s,transform .5s}.form-preview-art b{position:absolute;inset:0;border:1px solid #ffffffb0;border-radius:50%;transform:rotate(-25deg) scaleY(.68)}[data-form-palette=violet] .form-preview-art i{border-radius:62% 38% 49% 51%;transform:rotate(22deg)}[data-form-palette=green] .form-preview-art i{border-radius:43% 57% 61% 39%;transform:rotate(10deg)}[data-form-palette=sand] .form-preview-art i{border-radius:50% 50% 28% 28%;transform:rotate(-20deg)}
.domo-name-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}.domo-form-dialog .domo-name-label label{font-size:11px;font-weight:400;margin:0;color:#6b7893}.domo-name-label>span{font-size:9px;color:#a6afbf;font-variant-numeric:tabular-nums}
#save-dialog #domo-name,#library-edit #library-name{box-sizing:border-box;width:100%;height:48px;margin:0;padding:12px 14px;border:1px solid #dce3ef;border-radius:13px;background:#ffffffc9;color:#4b5b79;font:inherit;font-size:13px;outline:0;box-shadow:inset 0 1px 3px #7589b005;transition:border-color .2s,box-shadow .2s}
#save-dialog #domo-name:focus-visible,#library-edit #library-name:focus-visible{border-color:var(--form-deep);outline:0;box-shadow:0 0 0 3px color-mix(in srgb,var(--form-mid) 23%,transparent)}.domo-form-dialog input::placeholder{color:#a0a9bc;font-size:12px}
.domo-form-colors{border:0;margin:22px 0 0;padding:0}.domo-form-colors legend{font-size:11px;color:#6b7893;padding:0;margin-bottom:11px}.domo-form-colors>div{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.domo-form-dialog .domo-form-colors label{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;margin:0;padding:10px 6px 9px;cursor:pointer;border:1px solid #e5e9f1;border-radius:14px;background:#ffffff65;font-size:9px;font-weight:400;color:#8994aa;transition:.2s}.domo-form-colors input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.form-swatch{width:32px;height:31px;display:grid;place-items:center;pointer-events:none}.form-swatch i{display:block;width:27px;height:28px;border-radius:30%;transform:rotate(-15deg);background:radial-gradient(ellipse at 25% 15%,#fff,transparent 62%),linear-gradient(140deg,#d8e6ff,#8da8dd);box-shadow:inset 1px 1px 2px #fff9,0 3px 7px #788aaf20}.form-swatch.violet i{border-radius:61% 39% 49% 51%;transform:rotate(20deg);background:radial-gradient(ellipse at 25% 15%,#fff,transparent 62%),linear-gradient(140deg,#eeddf7,#b29bd0)}.form-swatch.green i{border-radius:43% 57% 61% 39%;background:radial-gradient(ellipse at 25% 15%,#fff,transparent 62%),linear-gradient(140deg,#e1f4df,#83bbae)}.form-swatch.sand i{border-radius:50% 50% 28% 28%;background:radial-gradient(ellipse at 25% 15%,#fff,transparent 62%),linear-gradient(140deg,#fff0cc,#d2aa7e)}.domo-form-colors label:has(input:checked){border-color:var(--form-mid);background:white;color:var(--form-deep);box-shadow:0 3px 8px #8092b510}.domo-form-colors label:has(input:checked):after{content:'✓';position:absolute;top:5px;right:6px;font-size:8px;color:var(--form-deep);pointer-events:none}.domo-form-colors label:has(input:focus-visible){outline:2px solid var(--form-mid);outline-offset:3px}
.domo-form-dialog .domo-form-favorite{display:flex;align-items:center;gap:10px;position:relative;border-top:1px solid #e8ecf3;margin:20px 0 20px;padding-top:17px;font-size:11px;font-weight:400;color:#6c7891;cursor:pointer}.domo-form-favorite>span:nth-child(2){flex:1}.domo-form-favorite small{display:block;font-size:9px;line-height:1.5;color:#9ba4b6;margin-top:5px}.form-heart{width:30px;height:30px;display:grid;place-items:center;color:#98a4bb}.form-heart svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.3}.form-is-favorite .form-heart{color:var(--form-deep)}.form-is-favorite .form-heart svg{fill:color-mix(in srgb,var(--form-mid) 36%,transparent)}.domo-form-favorite input{position:absolute;right:0;bottom:4px;width:38px;height:24px;opacity:0;z-index:1;cursor:pointer}.form-favorite-switch{position:relative;display:block;width:38px;height:23px;border-radius:30px;background:#e2e7ef;border:1px solid #d9dfeb;transition:.25s;flex-shrink:0}.form-favorite-switch:after{content:'';position:absolute;left:3px;top:3px;width:15px;height:15px;border-radius:50%;background:white;box-shadow:0 1px 3px #52617f22;transition:.25s}.domo-form-favorite input:checked+.form-favorite-switch{background:var(--form-deep);border-color:var(--form-deep)}.domo-form-favorite input:checked+.form-favorite-switch:after{transform:translateX(15px)}.domo-form-favorite input:focus-visible+.form-favorite-switch{outline:2px solid var(--form-mid);outline-offset:3px}
#save-dialog .domo-form-submit,#library-edit .domo-form-submit{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:52px;padding:15px 18px;margin:0;border:1px solid #ffffff20;border-radius:15px;background:linear-gradient(120deg,#38445f,color-mix(in srgb,var(--form-deep) 40%,#39455f));color:white;font-size:12px;box-shadow:inset 0 1px 0 #ffffff20,0 5px 14px #3e50751a}.domo-form-submit svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.4}.domo-form-submit:hover{filter:brightness(1.07)}.domo-form-dialog .domo-form-note{text-align:center;font-size:8px;letter-spacing:.2px;color:#a0a9ba;margin:13px 0 0;line-height:1.5}
@media(max-width:500px){#save-dialog.domo-form-dialog,#library-edit.domo-form-dialog{padding:21px 22px 18px;border-radius:27px}.domo-form-top>span{font-size:7px;letter-spacing:1.3px}#save-dialog h2,#library-edit h2{font-size:24px}.domo-form-preview{padding:16px;min-height:112px}.form-preview-copy strong{font-size:17px}.form-preview-art{width:111px;height:111px}.domo-form-colors>div{gap:7px}.domo-form-favorite small{font-size:8px}}
@media(max-height:750px){#save-dialog.domo-form-dialog,#library-edit.domo-form-dialog{padding-top:17px;padding-bottom:16px}#save-dialog h2,#library-edit h2{margin-top:12px}.domo-form-dialog .domo-form-intro{margin-bottom:14px}.domo-form-preview{min-height:96px;margin-bottom:15px;padding-top:13px;padding-bottom:13px}.form-preview-art{width:108px;height:108px;top:0}.domo-form-colors{margin-top:16px}.domo-form-dialog .domo-form-favorite{margin-top:15px;margin-bottom:15px;padding-top:13px}}
@media(prefers-reduced-motion:reduce){.domo-form-dialog *{transition:none!important}}