@layer properties,theme,base;@layer components{.scratchpad-editor-stack{animation:.3s ease-out fadeIn;position:relative}:where(.scratchpad-editor-stack>:not(:last-child)){margin-block:0 .75rem}.scratchpad-editor-overlay{z-index:40;position:absolute;top:0;right:0}.scratchpad-editor-row{cursor:pointer;border-style:solid;border-width:1px;border-color:var(--color-slate-700);background-color:var(--color-slate-800);width:2.25rem;height:2.25rem;color:var(--color-slate-300);border-radius:.5rem;justify-content:center;align-items:center;list-style-type:none;display:flex}@media (hover:hover){.scratchpad-editor-row:hover{background-color:var(--color-slate-700)}}.scratchpad-editor-row::-webkit-details-marker{display:none}.scratchpad-editor-overlay-2{border-style:solid;border-width:1px;border-color:var(--color-slate-600);background-color:var(--color-slate-900);--effect-shadow:0 20px 25px -5px var(--effect-shadow-color,#0000001a), 0 8px 10px -6px var(--effect-shadow-color,#0000001a);width:16rem;box-shadow:var(--effect-ring-offset-shadow), var(--effect-ring-shadow), var(--effect-shadow);border-radius:.75rem;margin-top:.5rem;padding:.5rem;position:absolute;right:0}.scratchpad-editor-button{text-align:left;width:100%;color:var(--color-white);border-radius:.5rem;padding:.75rem;font-size:.875rem;font-weight:700;line-height:1.42857}@media (hover:hover){.scratchpad-editor-button:hover{background-color:var(--color-slate-800)}}.scratchpad-editor-button:focus-visible{outline-width:2px;outline-style:solid;outline-color:var(--color-cyan-300)}.scratchpad-editor-caption{margin-top:var(--spacing);color:var(--color-slate-400);font-size:.75rem;font-weight:400;line-height:1.33333;display:block}.scratchpad-editor-copy{padding-inline:.75rem;color:var(--color-cyan-200);padding-bottom:.5rem;font-size:.75rem;line-height:1.33333}.scratchpad-editor-row-2{align-items:center;gap:.5rem;height:2rem;display:flex}.scratchpad-editor-icon{color:var(--color-slate-400);flex-shrink:0}.scratchpad-editor-icon:is(.dark *){color:var(--color-slate-500)}.scratchpad-editor-row-3{align-items:center;gap:.375rem;height:100%;display:flex}.scratchpad-editor-input{border-style:solid;border-width:1px;border-color:color-mix(in oklab, var(--color-brand-500) 50%, transparent);background-color:var(--color-slate-100);letter-spacing:.05em;width:11rem;color:var(--color-slate-700);text-transform:uppercase;border-radius:.375rem;padding-block:.125rem;padding-inline:.5rem;font-size:.875rem;font-weight:600;line-height:1.42857}.scratchpad-editor-input:focus{--effect-ring-shadow:0 0 0 calc(1px + var(--effect-ring-offset-width)) var(--effect-ring-color,currentcolor);box-shadow:var(--effect-ring-offset-shadow), var(--effect-ring-shadow), var(--effect-shadow);--effect-ring-color:var(--color-brand-500);outline-style:none}.scratchpad-editor-input:is(.dark *){background-color:var(--color-slate-800);color:var(--color-slate-200)}.scratchpad-editor-save-title{background-color:color-mix(in oklab, var(--color-emerald-500) 10%, transparent);padding:var(--spacing);color:var(--color-emerald-600);border-radius:.375rem;transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--effect-gradient-from,--effect-gradient-via,--effect-gradient-to;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}@media (hover:hover){.scratchpad-editor-save-title:hover{background-color:color-mix(in oklab, var(--color-emerald-500) 20%, transparent)}}.scratchpad-editor-save-title:is(.dark *){color:var(--color-emerald-400)}.scratchpad-editor-cancel{background-color:color-mix(in oklab, var(--color-slate-500) 10%, transparent);padding:var(--spacing);color:var(--color-slate-500);border-radius:.375rem;transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--effect-gradient-from,--effect-gradient-via,--effect-gradient-to;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}@media (hover:hover){.scratchpad-editor-cancel:hover{background-color:color-mix(in oklab, var(--color-slate-500) 20%, transparent)}}.scratchpad-editor-cancel:is(.dark *){color:var(--color-slate-400)}.scratchpad-editor-eyebrow{letter-spacing:.05em;color:var(--color-slate-500);text-transform:uppercase;font-size:.875rem;font-weight:600;line-height:1.42857}.scratchpad-editor-eyebrow:is(.dark *){color:var(--color-slate-400)}.scratchpad-editor-edit-title{padding:var(--spacing);color:var(--color-slate-400);opacity:0;border-radius:.375rem;transition-property:all;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}@media (hover:hover){.scratchpad-editor-edit-title:is(:where(.group\/title):hover *){opacity:1}}@media (hover:hover){.scratchpad-editor-edit-title:hover{background-color:var(--color-brand-50);color:var(--color-brand-500)}}@media (hover:hover){.scratchpad-editor-edit-title:is(.dark *):hover{background-color:color-mix(in oklab, var(--color-brand-500) 10%, transparent)}}.scratchpad-editor-row-4{align-items:center;column-gap:var(--spacing);color:var(--color-slate-500);flex-wrap:wrap;font-size:.875rem;line-height:1.42857;display:flex}.scratchpad-editor-row-4:is(.dark *){color:var(--color-slate-300)}.scratchpad-editor-text{min-height:2rem;color:var(--color-indigo-600);text-underline-offset:2px;font-weight:700;text-decoration-line:underline}@media (hover:hover){.scratchpad-editor-text:hover{color:var(--color-indigo-500)}}.scratchpad-editor-text:is(.dark *){color:var(--color-indigo-300)}@media (hover:hover){.scratchpad-editor-text:is(.dark *):hover{color:var(--color-indigo-200)}}.scratchpad-editor-row-5{justify-content:flex-end;align-items:center;width:6rem;height:100%;display:flex;position:relative}.scratchpad-editor-button-2{align-items:center;gap:var(--spacing);border-style:solid;border-width:1px;border-color:var(--color-slate-200);background-color:var(--color-white);padding-inline:.75rem;padding-block:var(--spacing);color:var(--color-slate-600);--effect-shadow:0 1px 3px 0 var(--effect-shadow-color,#0000001a), 0 1px 2px -1px var(--effect-shadow-color,#0000001a);box-shadow:var(--effect-ring-offset-shadow), var(--effect-ring-shadow), var(--effect-shadow);border-radius:.5rem;font-size:.75rem;font-weight:700;line-height:1.33333;transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--effect-gradient-from,--effect-gradient-via,--effect-gradient-to;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1);display:flex}@media (hover:hover){.scratchpad-editor-button-2:hover{background-color:var(--color-slate-50)}}.scratchpad-editor-button-2:disabled{opacity:.5}.scratchpad-editor-button-2:is(.dark *){border-color:var(--color-slate-700);background-color:var(--color-slate-800);color:var(--color-slate-300)}@media (hover:hover){.scratchpad-editor-button-2:is(.dark *):hover{background-color:var(--color-slate-700)}}.scratchpad-editor-region{position:relative}.scratchpad-editor-panel{border-style:solid;border-width:1px;border-color:var(--color-slate-200);background-color:var(--color-slate-50);overflow-wrap:break-word;width:100%;min-height:10rem;color:var(--color-slate-800);--effect-shadow:inset 0 2px 4px 0 var(--effect-shadow-color,#0000000d);box-shadow:var(--effect-ring-offset-shadow), var(--effect-ring-shadow), var(--effect-shadow);border-radius:1rem;padding:1.25rem;transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--effect-gradient-from,--effect-gradient-via,--effect-gradient-to;transition-duration:.5s;transition-timing-function:cubic-bezier(.4,0,.2,1);overflow:hidden}.scratchpad-editor-panel:focus{border-color:color-mix(in oklab, var(--color-brand-500) 50%, transparent);--effect-ring-shadow:0 0 0 calc(2px + var(--effect-ring-offset-width)) var(--effect-ring-color,currentcolor);box-shadow:var(--effect-ring-offset-shadow), var(--effect-ring-shadow), var(--effect-shadow);--effect-ring-color:color-mix(in oklab, var(--color-brand-500) 50%, transparent);outline-style:none}.scratchpad-editor-panel:is(.dark *){border-color:color-mix(in oklab, var(--color-white) 10%, transparent);background-color:color-mix(in oklab, var(--color-slate-950) 50%, transparent);color:var(--color-slate-200)}.scratchpad-editor-row-6{justify-content:flex-start;display:flex}.scratchpad-editor-button-3{align-items:center;gap:var(--spacing);border-style:solid;border-width:1px;border-color:var(--color-red-300);background-color:var(--color-white);padding-inline:.75rem;padding-block:var(--spacing);color:var(--color-red-600);--effect-shadow:0 1px 3px 0 var(--effect-shadow-color,#0000001a), 0 1px 2px -1px var(--effect-shadow-color,#0000001a);box-shadow:var(--effect-ring-offset-shadow), var(--effect-ring-shadow), var(--effect-shadow);border-radius:.5rem;font-size:.75rem;font-weight:700;line-height:1.33333;transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--effect-gradient-from,--effect-gradient-via,--effect-gradient-to;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1);display:flex}@media (hover:hover){.scratchpad-editor-button-3:hover{background-color:var(--color-red-50)}}.scratchpad-editor-button-3:is(.dark *){border-color:var(--color-red-700);background-color:var(--color-slate-800);color:var(--color-red-400)}@media (hover:hover){.scratchpad-editor-button-3:is(.dark *):hover{background-color:color-mix(in oklab, var(--color-red-900) 30%, transparent)}}.scratchpad-editor-button-4{justify-content:center;width:100%;padding-block:.625rem}.scratchpad-editor-button-5{padding-block:var(--spacing)}.scratchpad-editor-button-6{border-style:solid;border-width:1px;border-color:var(--color-slate-200);background-color:var(--color-white);color:var(--color-slate-600);--effect-shadow:0 1px 3px 0 var(--effect-shadow-color,#0000001a), 0 1px 2px -1px var(--effect-shadow-color,#0000001a);box-shadow:var(--effect-ring-offset-shadow), var(--effect-ring-shadow), var(--effect-shadow);border-radius:.5rem;align-items:center;gap:.375rem;padding-inline:.75rem;font-size:.75rem;font-weight:700;line-height:1.33333;transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--effect-gradient-from,--effect-gradient-via,--effect-gradient-to;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1);display:flex}@media (hover:hover){.scratchpad-editor-button-6:hover{background-color:var(--color-brand-50);color:var(--color-brand-600)}}.scratchpad-editor-button-6:disabled{cursor:not-allowed;opacity:.4}.scratchpad-editor-button-6:is(.dark *){border-color:var(--color-slate-700);background-color:var(--color-slate-800);color:var(--color-slate-300)}@media (hover:hover){.scratchpad-editor-button-6:is(.dark *):hover{border-color:color-mix(in oklab, var(--color-brand-500) 40%, transparent);background-color:color-mix(in oklab, var(--color-brand-500) 10%, transparent)}}.scratchpad-editor-stack-2{flex-direction:column;justify-content:space-between;gap:.75rem;display:flex}@media (width>=40rem){.scratchpad-editor-stack-2{flex-direction:row;align-items:center}}.scratchpad-editor-region-2{padding-right:3rem}.scratchpad-editor-overlay-3{white-space:nowrap;font-size:.75rem;font-weight:500;line-height:1.33333;transition-property:opacity;transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1);position:absolute;right:0}.scratchpad-editor-label{opacity:1}.scratchpad-editor-label-2{opacity:0}.scratchpad-editor-label-3{color:var(--color-rose-500)}.scratchpad-editor-label-4{color:var(--color-slate-400)}.scratchpad-editor-label-5{color:var(--color-emerald-500)}}
