.djhf-code-snippet{
  --cs-border: rgba(0,229,255,.28);
  --cs-bg: rgba(5,10,24,.92);
  --cs-bg-soft: rgba(255,255,255,.03);
  --cs-text: #eaf7ff;
  --cs-muted: rgba(234,247,255,.78);
  --cs-accent: #00e5ff;
  --cs-comment: #7ba3b7;
  --cs-string: #ffd479;
  --cs-number: #8af3ff;
  --cs-keyword: #8db6ff;
  --cs-function: #86f0c0;
  --cs-operator: #d9f2ff;
  --cs-font-size: 15px;
  --cs-code-gap: var(--cs-font-size);
  --cs-font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  position: relative;
  white-space: normal;
  margin: 1px 0;
  border: 1px solid var(--cs-border);
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(12,20,44,.97) 0%, rgba(4,9,20,.98) 100%);
  box-shadow: 0 0 0 1px rgba(0,229,255,.08), inset 0 0 36px rgba(0,229,255,.06), 0 0 24px rgba(0,229,255,.10), 0 0 48px rgba(0,110,255,.10), 0 14px 36px rgba(0,0,0,.30);
  overflow: hidden;
  isolation: isolate;
}
.djhf-code-snippet::before{
  content:'';
  position:absolute;
  inset:-2px;
  border-radius:inherit;
  pointer-events:none;
  border:1px solid rgba(0,229,255,.32);
  box-shadow:0 0 14px rgba(0,229,255,.18), 0 0 28px rgba(0,229,255,.14), 0 0 56px rgba(0,110,255,.10);
}
.djhf-code-snippet::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:radial-gradient(110% 90% at 50% 0%, rgba(0,229,255,.08), rgba(0,229,255,0) 58%), radial-gradient(80% 60% at 15% 18%, rgba(132,76,255,.08), rgba(132,76,255,0) 62%);
  opacity:.94;
}
.djhf-code-snippet > *{position:relative; z-index:1;}
.djhf-code-snippet .cs-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  padding:11px 14px 4px;
  background: linear-gradient(180deg, rgba(255,255,255,.04) 0%, rgba(255,255,255,.015) 100%);
}
.djhf-code-snippet .cs-heading{ min-width:0; flex:1 1 auto; }
.djhf-code-snippet .cs-title{
  font-weight:800;
  letter-spacing:.01em;
  color:var(--cs-text);
  word-break:break-word;
  text-shadow:0 0 16px rgba(0,229,255,.08);
}
.djhf-code-snippet .cs-toolbar{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  padding:4px 14px 6px;
  border-bottom:1px solid rgba(255,255,255,.06);
  box-shadow: inset 0 -1px 0 rgba(0,229,255,.06);
}
.djhf-code-snippet.compact-top-spacing .cs-toolbar{
  padding-top:2px;
  padding-bottom:5px;
}
.djhf-code-snippet .cs-meta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:0;
}
.djhf-code-snippet .cs-meta span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 10px;
  border-radius:999px;
  border:1px solid rgba(0,229,255,.18);
  background:rgba(0,229,255,.08);
  box-shadow:0 0 14px rgba(0,229,255,.06);
  color:var(--cs-muted);
  font-size:.8rem;
}
.djhf-code-snippet .cs-language{ color:#c8f8ff; }
.djhf-code-snippet .cs-lock-badge{ color:#ffdca3; border-color:rgba(255,210,126,.18); background:rgba(255,210,126,.08); }
.djhf-code-snippet .cs-font-badge{ color:#eef7ff; }
.djhf-code-snippet .cs-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
  margin-left:auto;
}
.djhf-code-snippet .cs-actions-below{
  justify-content:flex-start;
  margin-left:0;
  padding:var(--cs-code-gap) 14px var(--cs-code-gap);
  border-top:1px solid rgba(255,255,255,.06);
  box-shadow: inset 0 1px 0 rgba(0,229,255,.06);
}
.djhf-code-snippet .cs-actions .btn{
  min-width:84px;
  box-shadow:0 0 0 1px rgba(0,229,255,.10) inset, 0 0 14px rgba(0,229,255,.08);
}
.djhf-code-snippet .cs-description{
  padding:4px 14px 2px;
  color:var(--cs-muted);
  line-height:1.56;
  white-space:pre-line;
}
.djhf-code-snippet.compact-top-spacing .cs-description{
  padding-bottom:0;
}
.djhf-code-snippet.compact-top-spacing .cs-description p{
  margin-bottom:.22em;
}
.djhf-code-snippet.compact-top-spacing .cs-description > :last-child,
.djhf-code-snippet.compact-top-spacing .cs-description p:last-child{
  margin-bottom:0;
}
.djhf-code-snippet .cs-description a{ color:#33e8ff; }
.djhf-code-snippet .cs-description > :first-child{ margin-top:0; }
.djhf-code-snippet .cs-description > :last-child{ margin-bottom:0; }
.djhf-code-snippet .cs-description p{ margin:0 0 .42em; }
.djhf-code-snippet .cs-description br + br{ display:none; }
.djhf-code-snippet .cs-raw{ display:none !important; }
.djhf-code-snippet .cs-code-shell{
  padding:calc(var(--cs-code-gap) * 1.5) 0 calc(var(--cs-code-gap) * 1.5);
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:rgba(0,229,255,.26) rgba(255,255,255,.04);
}
.djhf-code-snippet .cs-code-shell::-webkit-scrollbar{ width:10px; height:10px; }
.djhf-code-snippet .cs-code-shell::-webkit-scrollbar-track{ background:rgba(255,255,255,.04); }
.djhf-code-snippet .cs-code-shell::-webkit-scrollbar-thumb{ background:rgba(0,229,255,.26); border-radius:999px; }
.djhf-code-snippet.compact-top-spacing .cs-code-shell{
  padding-top:calc(var(--cs-code-gap) * 1.5);
  padding-bottom:calc(var(--cs-code-gap) * 1.5);
}
.djhf-code-snippet.has-auto-scroll .cs-code-shell{
  max-height: calc(max(var(--cs-visible-lines, 0), 1) * 1.58em + 1.7rem);
}
.djhf-code-snippet .cs-pre,
.djhf-code-snippet .cs-code{
  margin:0;
  font-family: var(--cs-font-family);
  font-size: var(--cs-font-size);
  line-height:1.58;
  color:var(--cs-text);
}
.djhf-code-snippet .cs-pre{
  padding:0 14px 1px;
  background:transparent;
  min-width:max-content;
}
.djhf-code-snippet.wrap-long-lines .cs-pre{ min-width:0; }
.djhf-code-snippet .cs-code{ display:block; }
.djhf-code-snippet .cs-line{
  display:grid;
  grid-template-columns: 3.2em minmax(0, 1fr);
  gap:10px;
  align-items:start;
  white-space:pre;
  padding:2px 0;
}
.djhf-code-snippet .cs-line:hover{ background:rgba(255,255,255,.02); }
.djhf-code-snippet .cs-line:first-child{ padding-top:0; }
.djhf-code-snippet .cs-line:last-child{ padding-bottom:0; }
.djhf-code-snippet.hide-line-numbers .cs-line{ grid-template-columns:minmax(0,1fr); }
.djhf-code-snippet .cs-ln{
  user-select:none;
  color:rgba(234,247,255,.38);
  text-align:right;
  padding-right:2px;
  text-shadow:0 0 12px rgba(0,229,255,.06);
}
.djhf-code-snippet.hide-line-numbers .cs-ln{ display:none; }
.djhf-code-snippet .cs-line-text{
  display:block;
  min-width:0;
}
.djhf-code-snippet.wrap-long-lines .cs-line,
.djhf-code-snippet.wrap-long-lines .cs-line-text{
  white-space:pre-wrap;
  min-width:0;
  word-break:break-word;
}
.djhf-code-snippet .tok-comment{ color:var(--cs-comment); }
.djhf-code-snippet .tok-string{ color:var(--cs-string); }
.djhf-code-snippet .tok-number{ color:var(--cs-number); }
.djhf-code-snippet .tok-keyword{ color:var(--cs-keyword); font-weight:700; }
.djhf-code-snippet .tok-fn{ color:var(--cs-function); }
.djhf-code-snippet .tok-op,
.djhf-code-snippet .tok-punc{ color:var(--cs-operator); }
.djhf-code-snippet .tok-const{ color:#ffb2d3; }
.djhf-code-snippet .cs-share-btn.is-copied,
.djhf-code-snippet .cs-copy-btn.is-copied{
  box-shadow: 0 0 0 1px rgba(0,229,255,.28), 0 0 18px rgba(0,229,255,.22), 0 0 34px rgba(0,110,255,.14);
}
@media (max-width: 720px){
  .djhf-code-snippet .cs-header{
    flex-direction:column;
    align-items:stretch;
  }
  .djhf-code-snippet .cs-toolbar{
    flex-direction:column;
    align-items:stretch;
    gap:8px;
  }
  .djhf-code-snippet .cs-actions{
    justify-content:flex-start;
    margin-left:0;
  }
  .djhf-code-snippet .cs-pre{ padding:0 10px; }
  .djhf-code-snippet .cs-line{ gap:10px; grid-template-columns: 2.7em minmax(0, 1fr); }
}

body.cs-share-open{overflow:hidden; touch-action:none;}
.cs-share-modal{position:fixed; inset:0; z-index:10060; display:flex; align-items:center; justify-content:center; padding:18px; background:rgba(0,0,0,.56); -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px);}
.cs-share-modal[hidden]{display:none !important;}
.cs-share-backdrop{position:absolute; inset:0;}
.cs-share-sheet{position:relative; width:min(560px,100%); border-radius:20px; border:1px solid rgba(0,229,255,.22); background:linear-gradient(180deg, rgba(10,18,42,.98), rgba(4,9,21,.98)); box-shadow:0 0 0 1px rgba(0,229,255,.08) inset, 0 0 28px rgba(0,229,255,.12), 0 20px 46px rgba(0,0,0,.42); overflow:hidden;}
.cs-share-head,.cs-share-body,.cs-share-actions{position:relative; padding:14px 16px;}
.cs-share-head{display:flex; align-items:flex-start; justify-content:space-between; gap:12px; border-bottom:1px solid rgba(255,255,255,.08);}
.cs-share-kicker{font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; opacity:.72; margin-bottom:4px;}
.cs-share-title{font-size:1.05rem; font-weight:800; color:#eefbff; word-break:break-word;}
.cs-share-body{display:grid; gap:10px;}
.cs-share-label{font-size:.82rem; letter-spacing:.06em; text-transform:uppercase; opacity:.76;}
.cs-share-input{width:100%; padding:12px 14px; border-radius:14px; border:1px solid rgba(0,229,255,.24); background:rgba(255,255,255,.04); color:#eaf7ff; font:inherit; box-sizing:border-box;}
.cs-share-input:focus{outline:none; border-color:rgba(0,229,255,.52); box-shadow:0 0 0 1px rgba(0,229,255,.16) inset, 0 0 0 2px rgba(0,229,255,.10), 0 0 20px rgba(0,229,255,.14);}
.cs-share-hint{font-size:.86rem; color:rgba(234,247,255,.84); min-height:1.2em;}
.cs-share-actions{display:flex; flex-wrap:wrap; gap:10px; border-top:1px solid rgba(255,255,255,.08);}
.cs-share-actions .btn{flex:1 1 140px;}
@media (max-width: 640px){
  .cs-share-modal{padding:14px; align-items:flex-end;}
  .cs-share-sheet{border-radius:18px;}
}
