@layer reset,base,tokens,recipes,utilities,theme,theme.ui,theme.ui.base;@layer theme.ui.components{.ui.accordion{& .content{overflow:hidden}& .svg-icon{font-size:.7em}}.telescope-modal.modal-container{align-items:flex-start;& .modal-content{--telescope-top-margin:4em;margin-top:var(--telescope-top-margin);& .ui.modal.dialog-frame{max-height:calc(100vh - var(--telescope-top-margin) - 2em)}& .content{padding:0}& .actions{padding:8px 20px}}}.telescope-container.telescope-bar{background:var(--base-background-color);border:1px solid var(--border-color);flex-direction:column;display:flex;overflow:hidden;box-shadow:0 10px 30px #0000004d;& .ui.input.telescope-input{width:100%;color:var(--input-color);border:none;border-bottom:1px solid var(--border-color);background:0 0;outline:none;flex:0 0 3.4em;align-items:center;padding:.4em .6em .4em .8em;&::placeholder,& svg{color:var(--light-text-color)}& input{background:0 0;border:none;padding:0 .4em;font-size:1.3em}& .ui.basic.back.button{font-size:var(--tiny);padding:6px 8px;& svg.svg-icon{margin:0}}}& .telescope-loading{color:var(--muted-text-color);font-size:12px;position:absolute;top:50%;right:20px;transform:translateY(-50%)}& .telescope-no-items{text-align:center;color:var(--muted-text-color);padding:40px 20px}}.telescope-option-list{flex:1;min-height:0;padding:4px 0;overflow:hidden auto;& .telescope-option-list-holder{position:relative}}.telescope-option-view{cursor:pointer;border-radius:var(--selection-list-item-border-radius);align-items:center;margin:2px 8px;padding:8px 10px;transition:background-color .1s;display:flex;&:hover{background-color:var(--selection-list-hover-background);color:var(--selection-list-hover-color)}&.selected{background-color:var(--selection-list-active-background);color:var(--selection-list-active-color);position:relative;&:before{content:"";background-color:var(--background-color-info);width:3px;position:absolute;top:0;bottom:0;left:0}}& .telescope-option-icon{flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;margin-right:12px;display:flex}& .telescope-option-content{flex-direction:row;flex:1;gap:.6rem;min-width:0;display:flex;& .telescope-option-prefix{color:var(--light-text-color);flex:none}& .telescope-option-label{color:var(--text-color);white-space:nowrap;text-overflow:ellipsis;font-weight:500;overflow:hidden}& .telescope-option-detail{color:var(--muted-text-color);white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font-size:12px;overflow:hidden}}& .telescope-option-accessory{color:var(--muted-text-color);flex-direction:row;flex-shrink:0;align-items:center;gap:.4em;margin-left:12px;font-size:12px;display:flex}}}@layer theme.preview,theme.syntax;.landing-editor-scene{--landing-editor-demo-height:520px;flex-direction:column;gap:2.5rem;display:flex}.landing-editor-scene-columns{grid-template-columns:minmax(0,3fr) minmax(0,2fr);align-items:center;gap:3rem;display:grid;@media only screen and (width<=767px){display:block}}.landing-editor-scene-demo{height:var(--landing-editor-demo-height);flex-direction:column;display:flex;@media only screen and (width<=767px){height:40vh;padding-bottom:1em}& .landing-editor-scene-frame{flex:1;min-height:0}}.landing-editor-scene-fallback{border:1px solid var(--border-color);border-radius:var(--16px);background:color-mix(in srgb, currentColor 4%, transparent);width:100%;height:100%}.landing-editor-scene.landing-walkthrough-scene .landing-editor-scene-copy .landing-feature-list{@media only screen and (width<=767px){scroll-snap-type:x proximity;margin-top:1.5rem;display:flex;overflow-x:auto;& li{scroll-snap-align:start;flex:1 0 260px}}}.landing-walkthrough-scene .landing-walkthrough-scene-copy .landing-feature-list{margin-top:0;& li{padding-block:.75rem;padding-right:1rem;transition:opacity .3s,border-color .3s,background-color .3s;position:relative}}.landing-walkthrough-scene[data-active-step] .landing-feature-list li{opacity:.45;cursor:pointer;&:not(.active) a{pointer-events:none}&.active{opacity:1;border-left-color:var(--primary-color);background-color:color-mix(in srgb, var(--primary-color) 8%, transparent)}}.landing-walkthrough-scene[data-auto-playing] .landing-feature-list li.active{border-left-color:color-mix(in srgb, var(--primary-color) 30%, transparent);&:before{content:"";background:var(--primary-color);transform-origin:top;width:3px;height:100%;animation:landing-walkthrough-step-progress var(--landing-walkthrough-step-interval,5s) linear;position:absolute;top:0;left:-3px}}@keyframes landing-walkthrough-step-progress{0%{transform:scaleY(0)}to{transform:scaleY(1)}}.landing-walkthrough-scene .landing-feature-list li{@media (prefers-reduced-motion:reduce){transition:none}}.landing-organize-scene{--landing-organize-demo-height:560px;& .landing-organize-scene-columns{grid-template-columns:minmax(0,2fr) minmax(0,3fr);align-items:center;gap:3rem;display:grid;& .landing-organize-scene-demo{width:100%;max-width:462px;height:var(--landing-organize-demo-height);flex-direction:column;grid-area:1/2;justify-self:center;display:flex;& .landing-organize-scene-frame{flex:1;min-height:0}& .demo-app-frame-container .demo-app-frame{& .note-list-bar-layout-content{border-right:none}}& .landing-organize-scene-fallback{border:1px solid var(--border-color);border-radius:var(--16px);background:color-mix(in srgb, currentColor 4%, transparent);width:100%;height:100%}}& .landing-organize-scene-copy{grid-area:1/1}@media only screen and (width<=767px){display:block;& .landing-organize-scene-demo{height:min(var(--landing-organize-demo-height), 60vh);margin-inline:auto}}}& .landing-organize-scene-demo .main-layout{transition:transform .9s cubic-bezier(.22,1,.36,1),opacity .4s ease-in-out;@media (prefers-reduced-motion:reduce){transition:opacity .4s ease-in-out}}&[data-active-step="1"] .landing-organize-scene-demo .main-layout{transform-origin:100px 165px;transform:translate(100px,115px)scale(2)}&[data-active-step="3"] .landing-organize-scene-demo .main-layout{transform-origin:100px 300px;transform:translate(100px,-20px)scale(2)}&[data-active-step="4"] .landing-organize-scene-demo .main-layout{transform-origin:100px 450px;transform:translate(100px,-110px)scale(2)}& .demo-force-hover .disclosure{display:flex}& .demo-force-hover .disclosure-icon{margin:0 .2em;font-size:.7em;display:inline-block}& .demo-click-ripple{z-index:100;background:var(--primary-color);pointer-events:none;border-radius:50%;width:44px;height:44px;margin:-22px 0 0 -22px;animation:.65s ease-out forwards landing-organize-click-ripple;position:absolute;transform:scale(0)}}@keyframes landing-organize-click-ripple{0%{opacity:.6;transform:scale(.2)}to{opacity:0;transform:scale(2.4)}}.landing-organize-scene.landing-walkthrough-scene .landing-organize-scene-copy .landing-feature-list{@media only screen and (width<=767px){scroll-snap-type:x proximity;margin-top:1.5rem;display:flex;overflow-x:auto;& li{scroll-snap-align:start;flex:1 0 260px}}}.landing-preview-scene{--landing-preview-demo-height:320px;@media only screen and (width>=768px){--landing-preview-demo-height:460px}@media only screen and (width>=1200px){--landing-preview-demo-height:560px}@media only screen and (width>=1920px){--landing-preview-demo-height:640px}& .landing-preview-scene-columns{flex-direction:column;align-items:center;gap:2.5rem;display:flex;& .landing-preview-scene-demo{width:100%;max-width:960px;height:var(--landing-preview-demo-height);flex-direction:column;margin-bottom:1em;display:flex;& .landing-preview-scene-frame{flex:1;min-height:0}& .demo-app-frame-container .demo-app-frame{box-shadow:none;outline:1px solid hsl(var(--hsl-neutral-600))}& .landing-preview-scene-fallback{border:1px solid var(--border-color);border-radius:var(--16px);background:color-mix(in srgb, currentColor 4%, transparent);width:100%;height:100%}}& .landing-preview-scene-copy{width:100%;& .landing-feature-list{scroll-snap-type:x proximity;display:flex;overflow-x:auto;& li{scroll-snap-align:start;flex:1 0 260px}}}}}