@scope(.Note){:scope{--transition-time: .35s;cursor:pointer;color:var(--gray-xxdark);display:inline-block;padding:.25em;font-family:var(--caveat);font-size:1.5em;transform:rotate(1deg);position:relative;transition:filter var(--transition-time) ease;filter:drop-shadow(0 0 .1rem var(--yellow)) drop-shadow(0 .1rem .01rem hsla(0,0%,0%,.25)) drop-shadow(0 .8rem .25rem hsla(0,0%,0%,0));will-change:filter;&:hover{transition:filter var(--transition-time) ease;filter:drop-shadow(0 .1rem 0 var(--yellow)) drop-shadow(0 1rem .2rem hsla(0,0%,0%,.15))}}.Note-content{background-color:var(--yellow);background-image:linear-gradient(135deg,var(--yellow),var(--yellow-xlight));clip-path:url(#stickyNotePathDefault);padding:.5em 1em;&:after{content:"";inset:0;position:absolute;background-image:linear-gradient(180deg,transparent 50%,var(--yellow-xlight) 75%);z-index:-1;opacity:0;transition:ease all var(--transition-time)}}:scope:hover .Note-content:after{opacity:1;transition:ease all var(--transition-time)}.Note-text{display:inline-grid;place-content:center center;max-width:15ch;text-align:center;aspect-ratio:1 / 1;z-index:2}}@scope(.Dialog){:scope{border:none;padding:0;background:transparent;color:var(--theme-surface-contrast);border-radius:.75em;overflow:clip;&::backdrop{-webkit-backdrop-filter:blur(.2rem);backdrop-filter:blur(.2rem);background-color:#00000059}}.Dialog-content{background-color:var(--theme-surface);color:var(--theme-surface-contrast);border-radius:.75em;overflow:auto}.ConfirmDialog,.PromptDialog{display:grid;gap:1em;padding:1.5em;max-width:40ch}.ConfirmDialog-message{font-weight:650;text-wrap:balance}.PromptDialog-input{font:inherit;color:inherit;background:transparent;border:solid .1rem var(--theme-surface-contrast-soft);border-radius:.4em;padding:.5em .75em;outline:none;&:focus-visible{border-color:var(--theme-primary)}}.Dialog-actions{display:flex;justify-content:end;gap:.75em;padding-top:.5em}.DialogButton{padding:.5em 1.2em;border:none;border-radius:.4em;font:inherit;font-size:.875em;font-weight:600;cursor:pointer;transition:ease background-color .15s;&:focus-visible{outline:solid .15rem var(--theme-primary);outline-offset:.15rem}}.DialogButton-neutral{background:transparent;color:var(--theme-surface-contrast);box-shadow:inset 0 0 0 .1rem var(--theme-surface-contrast-soft);&:hover{background-color:var(--theme-surface-alternate)}}.DialogButton-primary{background-color:var(--theme-primary);color:var(--theme-surface);&:hover{background-color:hsl(from var(--theme-primary) h s calc(l - 6))}}.DialogButton-danger{background-color:var(--red-dark);color:var(--white);&:hover{background-color:hsl(from var(--red-dark) h s calc(l - 6))}}}@scope(.CanvasBlock){:scope{background:var(--theme-surface);padding:1em;display:flex;flex-direction:column;position:relative}.CanvasBlock-header{display:inline-grid;grid-auto-flow:column;grid-template-columns:1fr auto auto;position:relative;align-items:center;margin-bottom:1em}.CanvasBlock-name{font-weight:700;color:var(--theme-surface-contrast)}.CanvasBlock-icon{--icon-color: var(--theme-primary);width:1em;height:1em;margin-left:auto;flex-shrink:0}.CanvasBlock-button{cursor:pointer;border:0;color:var(--theme-surface-contrast-soft);outline:none;background:transparent;&:hover{color:var(--theme-primary)}}}.MonoIcon-Clipboard,.MonoIcon-Computer,.MonoIcon-Favorite,.MonoIcon-Link,.MonoIcon-Megaphone,.MonoIcon-Notification,.MonoIcon-ShoppingCartAdd,.MonoIcon-Tag,.MonoIcon-Users{fill:var(--icon-color, var(--theme-surface-contrast))}@scope(.Canvas){:scope{width:100%;padding:1em;display:grid;grid-gap:.25em;@media(min-width:600px){grid-template-columns:repeat(2,1fr);>*:last-child{grid-column:1/3}}@media(min-width:1000px){grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(3,1fr);>*:nth-child(1){grid-column:1/3;grid-row:1/3}>*:nth-child(2){grid-column:3/5;grid-row:1/2}>*:nth-child(3){grid-column:3/5;grid-row:2/3}>*:nth-child(4){grid-column:5/7;grid-row:1/3}>*:nth-child(5){grid-column:7/9;grid-row:1/2}>*:nth-child(6){grid-column:7/9;grid-row:2/3}>*:nth-child(7){grid-column:9/11;grid-row:1/3}>*:nth-child(8){grid-column:1/6}>*:nth-child(9){grid-column:6/11}}}}