:root{
  --sv-console-bg:#07120f;
  --sv-console-fg:#d9ffe9;
  --sv-console-accent:#7dffb3;
  --sv-console-border:rgba(125,255,179,.25);
  --sv-link-accent:#7fd6a3;
  --sv-link-accent-hover:#9ae6b4;
  --sv-link-accent-line:rgba(127,214,163,.42);
  --sv-link-accent-glow:rgba(127,214,163,.16);
  --sv-drawer-w:clamp(15.75rem,27vw,22.5rem);
  --sv-drawer-btn-bg:linear-gradient(180deg,rgba(20,33,68,.98) 0%, rgba(14,26,56,.98) 100%);
  --sv-drawer-btn-hover:linear-gradient(180deg,rgba(28,46,92,.99) 0%, rgba(18,34,70,.99) 100%);
  --sv-drawer-btn-border:rgba(104,132,218,.30);
  --sv-drawer-btn-shadow:0 10px 24px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.04);
  --sv-drawer-input-bg:rgba(19,32,62,.92);
  --sv-scroll-thumb:linear-gradient(180deg,#5fa8ff 0%, #726bff 52%, #9a64ff 100%);
  --sv-scroll-thumb-solid:#6f7cff;
  --sv-scroll-thumb-hover:#8b76ff;
  --sv-scroll-track:rgba(87,114,196,.16);
  --sv-drawer-head-start:#0b1633;
  --sv-drawer-head-mid:#132552;
  --sv-drawer-head-end:#211759;
  --sv-drawer-head-line:rgba(112,134,255,.32);
  --sv-drawer-head-glow:rgba(123,102,255,.18);
}
html,body{height:100%;}
body{margin:0;min-height:100dvh;display:grid;grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden;background:var(--sp-bg);color:var(--sp-text);}
.sv-main{min-height:0;overflow:hidden;padding:0;width:100%;max-width:none;}
.sv-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--sp-3);height:100%;min-height:0;align-items:stretch;padding:var(--sp-2) var(--sp-2) var(--sp-1);box-sizing:border-box;}
.sv-panel{min-width:0;min-height:0;height:100%;display:flex;flex-direction:column;}
.sv-browserHeader,.sv-previewHeader{display:flex;justify-content:space-between;gap:var(--sp-3);align-items:start;flex-wrap:wrap;}
.sv-browserTitle,.sv-previewHeading{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center;}
.sv-browserActions{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:.7rem;width:100%;}
.sv-statusPanel--header{display:flex;flex-direction:column;gap:var(--sp-1);margin-top:var(--sp-2);}
#browser .sp-card__header{padding-bottom:var(--sp-2);}
#browser .sp-card__body{padding-top:var(--sp-1);}
.sv-statusPanel--header{margin-top:0;}
.sv-areaNav{display:flex;flex-wrap:wrap;gap:.55rem;align-items:center;}
#browser .sv-areaBtn{
  padding:.48rem .82rem;
  min-height:0;
  border-radius:1rem;
  font-size:.92rem;
  font-weight:600;
  letter-spacing:.002em;
  background:rgba(255,255,255,.024);
  border-color:rgba(96,118,206,.12);
  color:color-mix(in srgb,var(--sp-text),white 2%);
  box-shadow:none;
}
#browser .sv-areaBtn:hover,
#browser .sv-areaBtn:focus-visible{
  background:rgba(255,255,255,.042);
  border-color:rgba(112,134,224,.18);
  color:var(--sp-text);
  transform:none;
}
.sv-areaBtn.is-active{
  background:rgba(120,144,255,.08);
  border-color:rgba(126,148,236,.24);
  color:var(--sp-text);
  box-shadow:inset 0 0 0 1px rgba(150,170,255,.08);
}
.sv-newMenu{position:absolute;top:calc(100% + var(--sp-2));right:0;display:none;min-width:11rem;padding:var(--sp-2);background:var(--sp-surface);border:var(--sp-border-1);border-radius:var(--sp-radius-2);box-shadow:var(--sp-shadow-3);z-index:25;}
.sv-newMenu.is-open{display:flex;flex-direction:column;gap:var(--sp-1);}
.sv-drawerNewWrap{position:relative;width:100%;}
.sv-drawerNewWrap > .sp-btn{width:100%;justify-content:center;}
.sv-newMenu--drawer{left:0;right:auto;min-width:100%;z-index:8;}
.sv-browserTitlePath{color:var(--sv-link-accent);text-decoration:none;word-break:break-all;font-size:var(--sp-fs-2);text-shadow:0 0 0.45rem var(--sv-link-accent-glow);transition:color var(--sp-duration-2) var(--sp-ease-standard), text-decoration-color var(--sp-duration-2) var(--sp-ease-standard);}
.sv-browserTitlePath:hover,.sv-browserTitlePath:focus-visible{color:var(--sv-link-accent-hover);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--sv-link-accent-hover),white 18%);text-underline-offset:var(--sp-underline-offset);}
.sv-previewMeta{font-size:var(--sp-fs-1);color:var(--sp-muted);word-break:break-word;}
.sv-previewMeta[hidden]{display:none;}
.sv-preview--framed{padding:0;display:flex;flex-direction:column;overflow:hidden;white-space:normal;}
.sv-previewInnerMeta{flex:0 0 auto;display:flex;justify-content:space-between;align-items:center;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);border-bottom:var(--sp-border-1);background:color-mix(in srgb,var(--sp-surface),var(--sp-surface-2) 55%);font-size:var(--sp-fs-1);color:var(--sp-muted);}
.sv-previewInnerMetaName{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sv-previewInnerMetaSize{flex:0 0 auto;white-space:nowrap;text-align:right;}
.sv-previewBody{flex:1 1 auto;min-height:0;overflow:auto;padding:var(--sp-0);}
.sv-previewBody--text{white-space:normal;word-break:normal;}
.sv-previewTextInner{padding:var(--sv-preview-text-pad, var(--sp-3));white-space:pre-wrap;word-break:break-word;margin:var(--sp-0);}
.sv-previewBody--image{display:flex;justify-content:center;align-items:flex-start;}
.sv-previewActionRow{position:relative;margin-left:auto;display:flex;gap:var(--sp-2);flex-wrap:wrap;justify-content:flex-end;align-items:center;}
.sv-previewModes,.sv-drawerActionsStack{display:flex;flex-direction:column;gap:var(--sp-2);}
.sv-drawerSection{display:flex;flex-direction:column;gap:var(--sp-2);}
.sv-drawerSectionTitle{font-size:var(--sp-fs-1);color:var(--sp-muted);text-transform:uppercase;letter-spacing:.04em;}
.sv-drawerSectionToggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--sp-2);
  padding:.6rem .72rem;
  border:1px solid rgba(102,124,214,.12);
  border-radius:.9rem;
  background:rgba(255,255,255,.022);
  color:inherit;
  cursor:pointer;
  text-align:left;
  transition:background var(--sp-duration-2) var(--sp-ease-standard), border-color var(--sp-duration-2) var(--sp-ease-standard);
}
.sv-drawerSectionToggle:hover,
.sv-drawerSectionToggle:focus-visible{
  background:rgba(255,255,255,.04);
  border-color:rgba(118,140,230,.18);
  outline:none;
}
.sv-drawerSectionToggle .sv-drawerSectionTitle{
  margin:0;
  opacity:.9;
}
.sv-drawerSectionChevron{
  flex:0 0 auto;
  color:var(--sv-link-accent);
  transition:transform var(--sp-duration-2) var(--sp-ease-standard), color var(--sp-duration-2) var(--sp-ease-standard);
}
.sv-drawerSectionToggle:hover .sv-drawerSectionChevron,
.sv-drawerSectionToggle:focus-visible .sv-drawerSectionChevron{
  color:var(--sv-link-accent-hover);
}
.sv-drawerSectionToggle[aria-expanded="true"] .sv-drawerSectionChevron{
  transform:rotate(90deg);
  color:var(--sv-link-accent);
}
.sv-drawerSectionBody{
  display:flex;
  flex-direction:column;
  gap:var(--sp-2);
  padding:.15rem 0 0;
}
.sv-drawerSectionBody[hidden]{
  display:none;
}
.sv-searchRow,.sv-publishRow{display:flex;gap:var(--sp-3);align-items:stretch;}
.sv-searchRow .sp-field,.sv-publishRow .sp-field{flex:1 1 auto;min-width:0;}
.sv-searchRow .sp-input,.sv-publishRow .sp-input{min-width:0;}
.sv-searchRow .sp-btn,.sv-publishRow .sp-btn{flex:0 0 auto;white-space:nowrap;}
.sv-modeBtn.is-active{background:color-mix(in srgb,var(--sp-link),transparent 88%);border-color:color-mix(in srgb,var(--sp-link),transparent 48%);color:var(--sp-text);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sp-link),transparent 62%);}
.sv-modeBtn.is-active:hover,.sv-modeBtn.is-active:focus-visible{background:color-mix(in srgb,var(--sp-link),transparent 84%);border-color:color-mix(in srgb,var(--sp-link),transparent 36%);}
.sv-statusStack{display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--sp-1);}
.sv-statusNote{padding:.2rem .55rem;border:var(--sp-border-1);border-radius:999px;background:var(--sp-surface-2);font-size:.84em;line-height:1.2;color:var(--sp-muted);}
.sv-statusPanel{display:flex;flex-direction:column;gap:var(--sp-1);}
.sv-statusToggle{display:inline-flex;align-items:center;gap:.45rem;flex:0 1 auto;max-width:100%;padding:.2rem .55rem;border:var(--sp-border-1);border-radius:999px;background:rgba(127,214,163,.055);border-color:rgba(127,214,163,.14);color:color-mix(in srgb,var(--sp-text-muted),var(--sv-link-accent) 18%);font-size:.84em;line-height:1.2;cursor:pointer;}
.sv-statusToggle:hover,.sv-statusToggle:focus-visible{background:rgba(127,214,163,.08);border-color:rgba(127,214,163,.22);color:color-mix(in srgb,var(--sp-text),var(--sv-link-accent) 18%);outline:none;}
.sv-statusToggleLabel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sv-statusToggleCaret{flex:0 0 auto;color:var(--sv-link-accent);}
.sv-statusDetails{display:none;flex-direction:column;gap:var(--sp-1);}
.sv-statusDetails.is-open{display:flex;}
.sv-fileList{list-style:none;margin:0;padding:0;}
.sv-fileList li + li{margin-top:var(--sp-0);}
.sv-fileItem{display:flex;gap:var(--sp-0);align-items:stretch;}
.sv-fileBtn{width:100%;text-align:left;appearance:none;background:transparent;color:inherit;border:var(--sp-border-1);border-radius:var(--sp-radius-2);padding:var(--sp-1) var(--sp-3);line-height:1.1;cursor:pointer;transition:background var(--sp-duration-2) var(--sp-ease-standard), border-color var(--sp-duration-2) var(--sp-ease-standard);}
.sv-fileItem .sv-fileBtn{flex:1 1 auto;}
.sv-fileBtn:hover,.sv-fileBtn:focus-visible{background:var(--sp-elev);border-color:var(--sp-border-strong);outline:none;}
.sv-fileBtn[aria-current="true"]{background:transparent;border-color:var(--sp-border);}
.sv-fileBtn:disabled{cursor:default;opacity:.62;}
.sv-fileArrow{
  margin-left:auto;
  color:var(--sv-link-accent);
  opacity:.82;
  transform:translateX(-.25rem);
  transition:opacity var(--sp-duration-2) var(--sp-ease-standard), transform var(--sp-duration-2) var(--sp-ease-standard), color var(--sp-duration-2) var(--sp-ease-standard);
}
.sv-fileItem--dir:hover .sv-fileArrow,.sv-fileItem--dir:focus-within .sv-fileArrow{opacity:1;transform:translateX(0);color:var(--sv-link-accent-hover);}
.sv-fileAction{flex:0 0 1.75rem;display:inline-flex;align-items:center;justify-content:center;min-width:1.75rem;width:1.75rem;padding:0;border:var(--sp-border-1);border-radius:var(--sp-radius-2);color:var(--sv-link-accent);text-decoration:none;background:transparent;font-size:.92em;line-height:1;transition:background var(--sp-duration-2) var(--sp-ease-standard), border-color var(--sp-duration-2) var(--sp-ease-standard), color var(--sp-duration-2) var(--sp-ease-standard);cursor:pointer;}
.sv-fileAction--text{flex:0 0 auto;min-width:2.35rem;width:auto;padding:0 .42rem;font-size:.74em;font-weight:600;letter-spacing:.01em;text-decoration:none;}
.sv-fileAction:hover,.sv-fileAction:focus-visible{background:rgba(127,214,163,.06);border-color:rgba(127,214,163,.18);color:var(--sv-link-accent-hover);text-decoration:underline;text-decoration-color:var(--sv-link-accent-line);outline:none;}
.sv-fileAction:disabled,.sv-fileAction.is-disabled{opacity:.45;pointer-events:none;cursor:default;text-decoration:none;}
.sv-fileRow{display:flex;justify-content:space-between;gap:var(--sp-3);align-items:center;}
.sv-fileName{display:flex;flex-wrap:nowrap;gap:.2rem;align-items:center;min-width:0;overflow:hidden;}
.sv-fileTitle{display:inline-block;white-space:nowrap;}
.sv-fileKind{font-size:.9em;color:var(--sp-muted);white-space:nowrap;flex:0 0 auto;opacity:.82;}
.sv-scroll{overflow:auto;min-height:0;flex:1 1 auto;}
.sv-scroll,.sv-drawerBody{
  scrollbar-width:thin;
  scrollbar-color:var(--sv-scroll-thumb-solid) var(--sv-scroll-track);
}
.sv-scroll::-webkit-scrollbar,
.sv-drawerBody::-webkit-scrollbar{
  width:.72rem;
  height:.72rem;
}
.sv-scroll::-webkit-scrollbar-track,
.sv-drawerBody::-webkit-scrollbar-track{
  background:var(--sv-scroll-track);
  border-radius:999px;
}
.sv-scroll::-webkit-scrollbar-thumb,
.sv-drawerBody::-webkit-scrollbar-thumb{
  background:var(--sv-scroll-thumb);
  border-radius:999px;
  border:2px solid transparent;
  background-clip:padding-box;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.sv-scroll::-webkit-scrollbar-thumb:hover,
.sv-drawerBody::-webkit-scrollbar-thumb:hover{
  background:var(--sv-scroll-thumb-hover);
  background-clip:padding-box;
}

.sv-preview{white-space:pre-wrap;word-break:break-word;font-family:var(--sp-font-mono);font-size:var(--sp-fs-1);line-height:var(--sp-lh-3);padding:var(--sp-3);border:var(--sp-border-1);border-radius:var(--sp-radius-2);background:var(--sp-surface-2);min-height:12rem;}
#preview .sp-card__header{padding-top:var(--sp-2);padding-bottom:var(--sp-2);}
#preview .sv-previewHeader{align-items:center;min-height:3.5rem;}
#preview .sv-previewHeading{align-items:center;}
#preview .sv-previewActionRow{align-items:center;gap:var(--sp-1);}
#preview .sv-previewActionRow .sp-btn{
  padding:.52rem .78rem;
  min-height:0;
  background:rgba(255,255,255,.035);
  border-color:rgba(98,120,208,.14);
  box-shadow:none;
  font-size:.94rem;
}
#preview .sv-previewActionRow .sp-btn:hover,
#preview .sv-previewActionRow .sp-btn:focus-visible{
  background:rgba(255,255,255,.055);
  border-color:rgba(116,138,226,.22);
}
#preview .sv-previewActionRow #saveBtn{opacity:.78;}
#preview .sp-card__body{display:flex;flex-direction:column;min-height:0;padding:0;}
#preview .sp-card__body.sp-stack{gap:0;}
#previewContent{flex:1 1 auto;min-height:0;overflow:auto;margin:0;}
#previewContent.sv-preview{height:100%;min-height:0;overflow:auto;border-radius:0 0 var(--sp-radius-2) var(--sp-radius-2);}
#previewContent.sv-preview--framed{padding:var(--sp-0);border-radius:0 0 var(--sp-radius-2) var(--sp-radius-2);}
#previewContent.sv-preview--framed .sv-previewBody{padding:var(--sp-0);margin:var(--sp-0);}
#previewContent.sv-preview--framed .sv-previewBody--text{margin:var(--sp-0);}
#previewContent.sv-preview--framed .sv-previewBody > *{margin:var(--sp-0);}

.sv-preview--console{background:radial-gradient(circle at top right,rgba(125,255,179,.08),transparent 32%),var(--sv-console-bg);color:var(--sv-console-fg);border-color:var(--sv-console-border);box-shadow:inset 0 0 0 1px rgba(125,255,179,.04);}
.sv-preview--editor{padding:0;display:flex;overflow:hidden;}
.sv-console{min-height:20rem;display:flex;flex-direction:column;gap:var(--sp-3);}
.sv-console__bar{display:flex;justify-content:space-between;gap:var(--sp-3);align-items:center;font-size:var(--sp-fs-1);color:color-mix(in srgb,var(--sv-console-fg),transparent 24%);}
.sv-console__dots{display:inline-flex;gap:.45rem;align-items:center;}
.sv-console__dot{width:.7rem;height:.7rem;border-radius:999px;background:color-mix(in srgb,var(--sv-console-accent),black 35%);opacity:.9;}
.sv-console__body{margin:0;white-space:pre-wrap;word-break:break-word;font-family:var(--sp-font-mono);font-size:var(--sp-fs-1);line-height:1.65;color:var(--sv-console-fg);}
.sv-console__prompt{color:var(--sv-console-accent);}
.sv-editorWrap{display:flex;flex-direction:column;min-height:100%;width:100%;}
.sv-editorStatus{display:flex;justify-content:space-between;gap:var(--sp-3);align-items:center;padding:var(--sp-2) var(--sp-3);border-bottom:var(--sp-border-1);background:var(--sp-surface-2);font-size:var(--sp-fs-1);color:var(--sp-muted);}
.sv-editorArea{flex:1 1 auto;min-height:24rem;width:100%;resize:none;border:0;background:transparent;color:inherit;font:inherit;font-family:var(--sp-font-mono);font-size:var(--sp-fs-1);line-height:1.55;padding:var(--sv-preview-text-pad, var(--sp-3));box-sizing:border-box;outline:none;}

#previewContent.sv-preview--editor{
  padding:0;
  display:block;
  background:rgba(5,10,24,.98);
  border-color:rgba(92,112,200,.15);
  box-shadow:none;
}
#previewContent.sv-preview--editor .sv-editorArea{
  display:block;
  width:100%;
  height:100%;
  min-height:100%;
  background:transparent;
  padding:var(--sp-3);
}

.sv-imagePreview{max-width:100%;border-radius:var(--sp-radius-2);border:var(--sp-border-1);display:block;}
.sv-metaLink{color:var(--sv-link-accent);text-decoration:underline;text-decoration-color:var(--sv-link-accent-line);text-underline-offset:var(--sp-underline-offset);word-break:break-all;}
.sv-metaLink:hover,.sv-metaLink:focus-visible{color:var(--sv-link-accent-hover);text-decoration-color:color-mix(in srgb,var(--sv-link-accent-hover),white 18%);}

.sp-header{
  position:relative;
  overflow:hidden;
  border-bottom:1px solid var(--sv-drawer-head-line);
  background:linear-gradient(135deg,var(--sv-drawer-head-start) 0%,var(--sv-drawer-head-mid) 54%,var(--sv-drawer-head-end) 100%);
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.03), 0 10px 22px rgba(0,0,0,.16);
}
.sp-header::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 18% 12%,rgba(95,168,255,.18),transparent 34%),radial-gradient(circle at 82% 22%,var(--sv-drawer-head-glow),transparent 38%);
  pointer-events:none;
}
.sp-header__inner{position:relative;z-index:1;}
.sp-header .sp-btn{
  background:rgba(255,255,255,.06);
  border-color:rgba(138,160,255,.18);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
}
.sp-header .sp-btn:hover,
.sp-header .sp-btn:focus-visible{
  background:rgba(255,255,255,.1);
  border-color:rgba(156,172,255,.28);
}

#browser{
  position:relative;
  background:linear-gradient(180deg,rgba(7,13,30,.985) 0%, rgba(8,15,34,.985) 58%, rgba(10,18,40,.985) 100%);
  border-color:rgba(92,114,202,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03), 0 16px 34px rgba(0,0,0,.27);
}
#browser .sp-card__header{
  background:linear-gradient(180deg,rgba(11,22,48,.94) 0%, rgba(8,16,36,.94) 100%);
  border-bottom:1px solid rgba(108,130,220,.16);
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.018);
}
#browser .sp-card__body{
  background:linear-gradient(180deg,rgba(5,10,24,.96) 0%, rgba(6,12,28,.98) 100%);
}
#browser .sv-fileBtn{
  background:rgba(255,255,255,.012);
  border-color:rgba(96,118,206,.15);
}
#browser .sv-fileBtn:hover,
#browser .sv-fileBtn:focus-visible{
  background:rgba(120,144,255,.06);
  border-color:rgba(124,146,234,.24);
}
#browser .sv-fileBtn[aria-current="true"]{
  background:rgba(110,134,230,.055);
  border-color:rgba(130,152,240,.24);
  box-shadow:inset 0 0 0 1px rgba(150,170,255,.06);
}
#browser .sv-fileBtn[aria-current="true"] .sv-fileArrow{
  opacity:1;
  transform:translateX(0);
  color:var(--sv-link-accent-hover);
}
#browser .sv-fileAction{
  color:var(--sv-link-accent);
  border-color:rgba(127,214,163,.18);
  background:rgba(127,214,163,.03);
}
#browser .sv-fileAction:hover,
#browser .sv-fileAction:focus-visible{
  color:var(--sv-link-accent-hover);
  border-color:rgba(127,214,163,.28);
  background:rgba(127,214,163,.08);
}
#browser .sv-statusToggle,
#browser .sv-statusNote{
  background:rgba(255,255,255,.035);
  border-color:rgba(112,134,224,.15);
}

#preview{
  position:relative;
  background:linear-gradient(180deg,rgba(2,7,18,.985) 0%, rgba(3,8,20,.985) 52%, rgba(7,14,32,.985) 100%);
  border-color:rgba(82,102,188,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.022), 0 18px 36px rgba(0,0,0,.32);
}
#preview .sp-card__header{
  background:linear-gradient(180deg,rgba(10,20,44,.95) 0%, rgba(6,12,28,.94) 100%);
  border-bottom:1px solid rgba(96,118,206,.15);
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.014);
}
#preview .sp-card__body{
  background:linear-gradient(180deg,rgba(2,7,18,.92) 0%, rgba(4,9,22,.98) 100%);
}
#previewContent.sv-preview{
  background:rgba(8,15,34,.94);
  border-color:rgba(92,112,200,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.022), inset 0 0 0 1px rgba(255,255,255,.018);
}
#previewContent.sv-preview--framed{
  background:rgba(5,10,24,.97);
  border-color:rgba(92,112,200,.15);
}
#preview .sv-previewInnerMeta,
#preview .sv-editorStatus{
  background:rgba(10,20,44,.94);
  border-bottom-color:rgba(96,118,206,.16);
}
#preview .sv-editorArea{
  background:rgba(5,10,24,.98);
}

.sv-drawer{position:fixed;inset:0 auto 0 0;width:var(--sv-drawer-w);max-width:calc(100vw - 2rem);transform:translateX(-104%);transition:transform var(--sp-duration-3) var(--sp-ease-standard);z-index:60;display:flex;flex-direction:column;background:var(--sp-surface);border-right:var(--sp-border-1);box-shadow:var(--sp-shadow-4);}
.sv-drawer.is-open{transform:translateX(0);}
.sv-drawerBackdrop{position:fixed;inset:0;background:rgba(0,0,0,.44);opacity:0;pointer-events:none;transition:opacity var(--sp-duration-3) var(--sp-ease-standard);z-index:50;}
.sv-drawerBackdrop.is-open{opacity:1;pointer-events:auto;}
.sv-drawerHeader{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;gap:var(--sp-3);align-items:center;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--sv-drawer-head-line);background:linear-gradient(135deg,var(--sv-drawer-head-start) 0%,var(--sv-drawer-head-mid) 54%,var(--sv-drawer-head-end) 100%);box-shadow:inset 0 -1px 0 rgba(255,255,255,.03), 0 10px 22px rgba(0,0,0,.16);overflow:hidden;}
.sv-drawerBody{padding:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-4);overflow:auto;min-height:0;}
.sv-drawerBody{padding:var(--sp-3);padding-top:var(--sp-2);gap:var(--sp-3);}
.sv-drawerSection{gap:var(--sp-1);}
.sv-drawerSectionTitle{font-size:.82rem;opacity:.78;letter-spacing:.05em;margin-bottom:.15rem;}

.sv-drawerBody .sp-btn,
.sv-drawerBody .sp-input{font-size:1rem;border-radius:1.08rem;}
.sv-drawerBody .sp-btn{
  font-weight:680;
  letter-spacing:.005em;
  border-color:var(--sv-drawer-btn-border);
  background:var(--sv-drawer-btn-bg);
  box-shadow:var(--sv-drawer-btn-shadow);
}
.sv-drawerBody .sp-btn:hover,
.sv-drawerBody .sp-btn:focus-visible{
  background:var(--sv-drawer-btn-hover);
  border-color:rgba(140,166,245,.44);
  transform:translateY(-1px);
}
.sv-drawerBody .sp-btn--primary{
  box-shadow:0 12px 26px rgba(18,96,42,.28), inset 0 1px 0 rgba(255,255,255,.06);
  font-weight:700;
}
.sv-drawerBody .sp-input{
  background:var(--sv-drawer-input-bg);
  border-color:rgba(95,121,190,.26);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.sv-previewModes .sp-btn,
.sv-drawerActionsStack .sp-btn,
.sv-searchRow .sp-btn,
.sv-publishRow .sp-btn{padding:.78rem .98rem;min-height:0;}
.sv-searchRow .sp-input,
.sv-publishRow .sp-input{padding:.78rem .98rem;min-height:0;}
#searchBtn{
  background:linear-gradient(180deg,rgba(34,86,58,.98) 0%, rgba(24,66,44,.98) 100%);
  border-color:rgba(127,214,163,.34);
  color:color-mix(in srgb,var(--sp-text),var(--sv-link-accent) 18%);
  box-shadow:0 10px 22px rgba(8,28,18,.24), inset 0 1px 0 rgba(255,255,255,.05);
}
#searchBtn:hover,
#searchBtn:focus-visible{
  background:linear-gradient(180deg,rgba(43,102,70,.99) 0%, rgba(28,78,52,.99) 100%);
  border-color:rgba(154,230,180,.42);
  color:var(--sp-text);
}

.sv-drawerHeader::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 12%,rgba(95,168,255,.18),transparent 34%),radial-gradient(circle at 82% 22%,var(--sv-drawer-head-glow),transparent 38%);pointer-events:none;}
.sv-drawerHeader > *{position:relative;z-index:1;}
.sv-drawerHeader .sp-stack strong{font-size:1.08rem;letter-spacing:.01em;color:rgba(255,255,255,.98);}
.sv-drawerHeader .sp-btn{background:rgba(255,255,255,.06);border-color:rgba(138,160,255,.18);box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);}
.sv-drawerHeader .sp-btn:hover,.sv-drawerHeader .sp-btn:focus-visible{background:rgba(255,255,255,.1);border-color:rgba(156,172,255,.28);}

.sv-footerWrap{margin-top:.2rem;padding:0 var(--sp-2) var(--sp-1);}
.sv-footerWrap .sp-card{
  background:linear-gradient(180deg,rgba(9,17,38,.96) 0%, rgba(8,15,34,.98) 100%);
  border:1px solid rgba(96,118,206,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.028), 0 10px 24px rgba(0,0,0,.18);
}
.sv-footerWrap .sp-card__body{
  padding:.46rem .82rem;
  background:linear-gradient(180deg,rgba(10,19,42,.88) 0%, rgba(8,15,34,.95) 100%);
}
.demo-footer__row{display:flex;justify-content:space-between;gap:var(--sp-2);align-items:center;flex-wrap:wrap;color:color-mix(in srgb,var(--sp-text-muted),white 10%);font-size:.84rem;line-height:1.2;}
.demo-footer__meta{display:flex;align-items:center;gap:.38rem;flex-wrap:wrap;min-width:0;}
.demo-footer__credit{color:color-mix(in srgb,var(--sp-text-muted),white 8%);opacity:.96;}
.demo-footer__sep{opacity:.6;}
.demo-footer__links{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center;}
.demo-footer__link{color:color-mix(in srgb,var(--sv-link-accent),var(--sp-text-muted) 52%);text-decoration:none;white-space:nowrap;}
.demo-footer__link:hover{color:var(--sv-link-accent-hover);text-decoration:underline;text-decoration-color:var(--sv-link-accent-line);}

@media (max-width:820px){body{overflow:auto}.sv-main{overflow:visible}.sv-shell{grid-template-columns:1fr;height:auto;padding:var(--sp-2) var(--sp-2) var(--sp-1)}.sv-panel{height:auto}.sv-drawer{width:min(90vw,26rem)}.sv-searchRow,.sv-publishRow{flex-direction:column;align-items:stretch}.sv-newMenu{left:0;right:auto}.demo-footer__row{align-items:flex-start}.demo-footer__meta{gap:.3rem}}