/* Snippet Builder by Octopush */
.fxb,.fxb-single,.fxb-shell{
	--fxb-bg:#1a1e29;--fxb-sf:#222736;--fxb-sf2:#2b3143;--fxb-ln:#323950;
	--fxb-tx:#dde2ee;--fxb-mut:#8891a8;--fxb-ac:#7aa2ff;--fxb-ac2:#9bb9ff;--fxb-st:#ffb86b;--fxb-err:#ff8a8a;
	--fxb-sans:'Instrument Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
	--fxb-mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
	--fxb-ease:cubic-bezier(.23,1,.32,1);
}
.fx-c{color:#6c7593;font-style:italic}.fx-k{color:#c792ea}.fx-s{color:#ffb86b}.fx-v{color:#8fd3ff}.fx-n{color:#f78c6c}.fx-f{color:#82aaff}.fx-ph{color:#f07178}

/* ---------- App shell (page template) ---------- */
body.fxb-app-body{margin:0;background:#1a1e29}
.fxb-shell{display:flex;flex-direction:column;height:100vh;height:100dvh;background:var(--fxb-bg);color:var(--fxb-tx);font-family:var(--fxb-sans)}
.admin-bar .fxb-shell{height:calc(100vh - 32px);height:calc(100dvh - 32px)}
.fxb-top{display:flex;align-items:center;gap:14px;padding:14px 20px;border-bottom:1px solid var(--fxb-ln)}
.fxb-wm{font:500 15px/1 var(--fxb-mono);color:var(--fxb-tx)!important;text-decoration:none!important;white-space:nowrap}
.fxb-wm span{color:var(--fxb-ac)}
.fxb-crumb{font:12px/1 var(--fxb-mono);color:var(--fxb-mut);padding:5px 8px;border:1px solid var(--fxb-ln);border-radius:5px}
.fxb-nav{margin-left:auto}
.fxb-nav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0}
.fxb-nav a{color:var(--fxb-mut)!important;text-decoration:none!important;font-size:14.5px}
.fxb-nav a:hover{color:var(--fxb-tx)!important}
.fxb-main{flex:1;min-height:0}

/* ---------- Builder ---------- */
.fxb{position:relative;display:flex;flex-direction:column;height:min(86vh,920px);min-height:560px;background:var(--fxb-bg);color:var(--fxb-tx);font:15px/1.5 var(--fxb-sans);border-radius:14px;overflow:hidden;text-align:left;-webkit-font-smoothing:antialiased}
.fxb--full{height:100%;min-height:0;border-radius:0}
.fxb *,.fxb *::before,.fxb *::after{box-sizing:border-box}
.fxb,.fxb *,.fxb-single *{-webkit-tap-highlight-color:transparent}
.fxb button,.fxb input{font:inherit;color:inherit;letter-spacing:normal;text-transform:none;text-shadow:none;box-shadow:none;margin:0;min-height:0;min-width:0;line-height:inherit}
.fxb p{margin:0}
.fxb code{font-family:var(--fxb-mono);background:none;padding:0;border:0;border-radius:0;color:inherit;font-size:inherit}
.fxb [hidden]{display:none!important}
.fxb ::selection{background:rgba(122,162,255,.32);color:var(--fxb-tx)}
.fxb input{caret-color:var(--fxb-ac)}
.fxb-groups,.fxb-code,.fxb-codebox pre{scrollbar-width:thin;scrollbar-color:var(--fxb-ln) transparent}
.fxb :focus-visible{outline:2px solid var(--fxb-ac);outline-offset:2px}
.fxb-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.fxb-app{display:grid;grid-template-columns:340px minmax(0,1fr);flex:1;min-height:0}

/* sidebar */
.fxb-side{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--fxb-ln)}
.fxb-head{padding:22px 16px 14px;border-bottom:1px solid var(--fxb-ln)}
.fxb-intro{margin:0 4px 16px!important;font-size:15px;line-height:1.5;color:var(--fxb-mut)}
.fxb-intro h1{display:block;margin:0 0 6px;padding:0;color:var(--fxb-tx);font:500 22px/1.2 var(--fxb-sans);letter-spacing:-.02em;text-transform:none}
.fxb-intro p{margin:0}
.fxb-static{flex:1;overflow:auto;max-width:720px;margin:0 auto;padding:24px 20px;line-height:1.6}
.fxb-static h1{font-size:28px;font-weight:500;margin:0 0 8px}
.fxb-static h2{font-size:17px;font-weight:500;margin:24px 0 6px}
.fxb-static ul{margin:0;padding-left:1.2em}
.fxb-static a{color:var(--fxb-ac,#7aa2ff)}
.fxb-search{display:flex;align-items:center;gap:10px;height:40px;padding:0 10px 0 12px;border:1px solid var(--fxb-ln);border-radius:8px;background:var(--fxb-sf);color:var(--fxb-mut);cursor:text}
.fxb-search:focus-within{border-color:var(--fxb-ac);box-shadow:0 0 0 3px rgba(122,162,255,.18)}
.fxb-search svg{flex:none}
.fxb-search input{flex:1;height:100%;padding:0;border:0!important;outline:0;background:transparent!important;color:var(--fxb-tx);font-size:15px;-webkit-appearance:none;appearance:none}
.fxb-search input:focus,.fxb-search input:focus-visible{outline:0!important;box-shadow:none!important}
.fxb-search input::placeholder{color:var(--fxb-mut);opacity:1}
.fxb-search input::-webkit-search-cancel-button{display:none}
.fxb-search kbd{font:12px/1 var(--fxb-mono);border:1px solid var(--fxb-ln);border-radius:4px;padding:3px 6px;color:var(--fxb-mut);background:none;box-shadow:none}
.fxb-search:focus-within kbd{display:none}
.fxb-presets{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:12px 2px 0;font-size:13px;color:var(--fxb-mut)}
.fxb-pre{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 6px 0 11px;border:1px solid var(--fxb-ln);border-radius:15px;background:transparent;color:var(--fxb-tx);font:500 13px/1 var(--fxb-sans);cursor:pointer;transition:border-color .15s ease,background-color .15s ease,transform .16s var(--fxb-ease)}
.fxb-pre span{min-width:18px;padding:3px 5px;border-radius:9px;background:var(--fxb-sf2);color:var(--fxb-mut);font:11.5px/1 var(--fxb-mono);text-align:center;transition:background-color .15s ease,color .15s ease}
.fxb-pre:active{transform:scale(.97)}
.fxb-pre[aria-pressed="true"]{border-color:var(--fxb-ac);background:rgba(122,162,255,.1)}
.fxb-pre[aria-pressed="true"] span{background:var(--fxb-ac);color:#0e1422}
@media (hover:hover) and (pointer:fine){.fxb-pre:not([aria-pressed="true"]):hover{border-color:var(--fxb-mut)}}
@media (prefers-reduced-motion:reduce){.fxb-pre,.fxb-pre span{transition:none}.fxb-pre:active{transform:none}}
.fxb-groups{flex:1;overflow-y:auto;padding:4px 12px 40px;overscroll-behavior:contain}
.fxb-g h2{font:500 13px/1.4 var(--fxb-sans);color:var(--fxb-mut);margin:20px 8px 4px;padding:0;letter-spacing:0;text-transform:none;border:0}
.fxb-sw{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:start;width:100%;padding:10px 8px;border:0;border-radius:8px;background:transparent;text-align:left;cursor:pointer}
.fxb-item{border-radius:10px;transition:background-color .2s ease}
.fxb-item.is-on{background:var(--fxb-sf)}
@media (hover:hover) and (pointer:fine){.fxb-item:not(.is-on) .fxb-sw:hover{background:var(--fxb-sf)}}
.fxb-sw:focus-visible{outline-offset:-2px}
.fxb-tg{position:relative;width:34px;height:20px;margin-top:1px;border-radius:10px;background:var(--fxb-sf2);border:1px solid var(--fxb-ln);transition:background .2s,border-color .2s}
.fxb-tg::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--fxb-mut);transition:transform .2s,background .2s}
.fxb-sw[aria-checked="true"] .fxb-tg{background:var(--fxb-ac);border-color:var(--fxb-ac)}
.fxb-sw[aria-checked="true"] .fxb-tg::after{transform:translateX(14px);background:#fff}
.fxb-sw strong{display:block;font-weight:500;font-size:15px;line-height:1.3;color:var(--fxb-tx)}
.fxb-sw code{display:block;margin-top:3px;font-size:11.5px;color:var(--fxb-mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fxb-more{padding:0 8px 14px 54px;font-size:13.5px;line-height:1.5;color:var(--fxb-mut)}
.fxb-more>p{margin:0 0 8px}
.fxb-warn{color:var(--fxb-st)}
.fxb-conf{color:var(--fxb-err)}
.fxb-param{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 0 12px;padding-top:10px;border-top:1px solid var(--fxb-ln)}
.fxb-param span{font-size:13px;color:var(--fxb-tx)}
.fxb-param input{width:96px;flex:none;text-align:right;height:34px;padding:0 10px;border:1px solid var(--fxb-ln);border-radius:7px;background:var(--fxb-bg);color:var(--fxb-tx);font:13.5px var(--fxb-mono);outline:0}
.fxb-param input:focus{border-color:var(--fxb-ac)}
.fxb-meta-line{display:flex;flex-wrap:wrap;gap:4px 14px}
.fxb-meta-line:empty{display:none}
.fxb-link{color:var(--fxb-ac)!important;text-decoration:underline;text-underline-offset:3px}
.fxb-none{padding:18px 8px!important;color:var(--fxb-mut);font-size:14px}

/* editor */
.fxb-ed{display:flex;flex-direction:column;min-width:0;min-height:0}
.fxb-bar{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;padding-right:12px;border-bottom:1px solid var(--fxb-ln);background:var(--fxb-sf)}
.fxb-tab{margin-bottom:-1px;padding:14px 18px 13px;font:13px/1 var(--fxb-mono);background:var(--fxb-bg);border-right:1px solid var(--fxb-ln);border-top:2px solid var(--fxb-ac)}
.fxb-stat{margin-right:auto;font-size:13.5px;color:var(--fxb-mut)}
.fxb-php{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 4px;border:0;background:none;color:var(--fxb-mut);font-size:13.5px;white-space:nowrap;cursor:pointer;transition:color .15s ease}
.fxb-php code{padding:0;background:none;color:inherit;font:12.5px var(--fxb-mono)}
.fxb-php-tr{position:relative;flex:none;width:28px;height:16px;border-radius:8px;background:var(--fxb-ln);transition:background-color .2s var(--fxb-ease)}
.fxb-php-tr::after{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:var(--fxb-tx);transition:transform .2s var(--fxb-ease)}
.fxb-php[aria-checked="true"]{color:var(--fxb-tx)}
.fxb-php[aria-checked="true"] .fxb-php-tr{background:var(--fxb-ac)}
.fxb-php[aria-checked="true"] .fxb-php-tr::after{transform:translateX(12px);background:#0e1422}
.fxb-php:focus-visible{outline:2px solid var(--fxb-ac);outline-offset:2px;border-radius:6px}
@media (hover:hover) and (pointer:fine){.fxb-php:hover{color:var(--fxb-tx)}}
.fxb-hint{color:var(--fxb-tx)}
.fxb-actions{display:flex;gap:8px;padding:7px 0}
.fxb-b{height:34px;padding:0 13px;border:1px solid var(--fxb-ln);border-radius:7px;background:transparent;color:var(--fxb-tx);font-size:14px;font-weight:500;white-space:nowrap;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,opacity .15s ease,transform .16s var(--fxb-ease)}
.fxb-b:active{transform:scale(.97)}
.fxb-b[aria-disabled="true"]{opacity:.45;cursor:not-allowed}
.fxb-b[aria-disabled="true"]:active{transform:none}
@media (hover:hover) and (pointer:fine){.fxb-b:hover{border-color:var(--fxb-mut);background:transparent;color:var(--fxb-tx)}}
.fxb-b--p{background:var(--fxb-ac);border-color:var(--fxb-ac);color:#0e1422}
.fxb .fxb-b--p,.fxb .fxb-b--p:active{color:#0e1422}
@media (hover:hover) and (pointer:fine){.fxb .fxb-b--p:hover{background:var(--fxb-ac2);border-color:var(--fxb-ac2);color:#0e1422}}
.fxb-code{position:relative;flex:1;overflow:auto;padding:16px 0 48px;background:var(--fxb-bg);font:13px/1.8 var(--fxb-mono);tab-size:4}
.fxb-in{min-width:max-content}
.fxb-note{margin:0!important;padding:9px 16px;border-top:1px solid var(--fxb-ln);background:var(--fxb-sf);color:var(--fxb-mut);font-size:12.5px}
.fxb-note a{color:var(--fxb-tx);text-underline-offset:3px}
.fxb-ln{display:flex}
.fxb-n{flex:none;width:54px;padding-right:20px;text-align:right;color:#4d5570;user-select:none;-webkit-user-select:none}
.fxb-c{white-space:pre;padding-right:24px}
.fxb-ln.is-new{animation:fxbFlash 1.4s ease-out}
@keyframes fxbFlash{from{background:rgba(122,162,255,.22)}to{background:transparent}}

/* toast, mobile tabs */
@keyframes fxbToastIn{from{opacity:0;translate:0 8px}}
.fxb-toast{animation:fxbToastIn .25s var(--fxb-ease);position:absolute;left:50%;bottom:20px;z-index:5;transform:translateX(-50%);display:flex;align-items:center;gap:12px;width:max-content;max-width:calc(100% - 32px);padding:10px 12px 10px 16px;border-radius:10px;background:#f1f4fb;color:#141826;font-size:14px;line-height:1.4;box-shadow:0 12px 30px -10px rgba(0,0,0,.55)}
.fxb-toast button{flex:none;padding:6px 4px;border:0;background:none;color:#2f5fd0;font-weight:600;cursor:pointer}
.fxb-mtabs{display:none}

@media (max-width:860px){
	.fxb-shell,.admin-bar .fxb-shell{height:auto}
	.fxb-nav{display:none}
	.fxb,.fxb--full{height:auto;min-height:0;border-radius:0;overflow:visible;padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
	.fxb-app{display:block}
	.fxb-side{border-right:0}
	.fxb-groups{overflow:visible;padding-bottom:16px}
	.fxb[data-view="list"] .fxb-ed,.fxb[data-view="code"] .fxb-side{display:none}
	.fxb-sw{padding:12px 8px}
	.fxb-search input,.fxb-param input{font-size:16px}
	.fxb-search kbd{display:none}
	.fxb-bar{position:sticky;top:0;z-index:3;flex-wrap:wrap;gap:0;padding:0}
	.admin-bar .fxb-bar{top:46px}
	.fxb-stat{display:none}
	.fxb .fxb-php{margin-left:auto;height:44px;padding:0 12px;font-size:13px}
	.fxb-actions{order:4;display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.25fr);gap:8px;width:100%;padding:10px 12px;border-top:1px solid var(--fxb-ln)}
	.fxb-actions .fxb-b{height:42px;min-width:0;padding:0 14px;overflow:hidden;text-overflow:ellipsis}
	.fxb-xl{display:none}
	.fxb-app-body .fxb{padding-bottom:0}
	.fxb-note{padding:10px 16px;line-height:1.5}
	.fxb-code{min-height:60vh;overflow-y:visible}
	.fxb-mtabs{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:1000;display:flex;gap:4px;padding:4px;border:1px solid var(--fxb-ln);border-radius:12px;background:rgba(34,39,54,.94);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 12px 30px -10px rgba(0,0,0,.6)}
	.fxb-mtabs button{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;height:44px;border:0;border-radius:9px;background:transparent;color:var(--fxb-mut);font-size:15px;font-weight:500;cursor:pointer}
	.fxb-mtabs button[aria-pressed="true"]{background:var(--fxb-bg);color:var(--fxb-tx)}
	.fxb-count{min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--fxb-ac);color:#0e1422;font-size:12px;font-weight:600;line-height:22px;text-align:center}
	.fxb-toast{position:fixed;bottom:calc(78px + env(safe-area-inset-bottom,0px));z-index:1001}
}
@media (max-width:782px){.admin-bar .fxb-shell{height:auto}}

/* ---------- Single snippet ---------- */
.fxb-single{margin:0 0 2em}
.fxb-lead{font-size:1.15em;line-height:1.55;margin:0 0 1.2em}
.fxb-meta{display:flex;flex-wrap:wrap;gap:12px 36px;margin:0 0 1.5em;padding:14px 0;border-top:1px solid rgba(127,127,127,.25);border-bottom:1px solid rgba(127,127,127,.25)}
.fxb-meta div{margin:0}
.fxb-meta dt{margin:0;font-size:13px;font-weight:400;opacity:.7}
.fxb-meta dd{margin:2px 0 0;font-size:15px;line-height:1.4}
.fxb-meta dd code{font:14px/1.4 var(--fxb-mono);background:none;padding:0;border:0}
.fxb-single .fxb-warn{display:flex;gap:10px;align-items:flex-start;margin:0 0 1.5em;padding:12px 14px;border:1px solid rgba(255,184,107,.3);border-radius:10px;background:rgba(255,184,107,.08);color:inherit;line-height:1.5}
.fxb-single .fxb-warn svg{flex:none;margin-top:3px;color:var(--fxb-st)}
.fxb-codebox{overflow:hidden;border-radius:12px;background:var(--fxb-bg);color:var(--fxb-tx)}
.fxb-codebox pre{margin:0;padding:20px 22px;overflow-x:auto;border:0;border-radius:0;background:none;color:var(--fxb-tx);font:13.5px/1.8 var(--fxb-mono);white-space:pre;tab-size:4}
.fxb-codebox code{padding:0;background:none;color:inherit;font:inherit}
.fxb-codebox-bar{display:flex;flex-wrap:wrap;gap:8px;padding:12px 16px;border-top:1px solid var(--fxb-ln);background:var(--fxb-sf)}
.fxb-btn{display:inline-flex;align-items:center;height:38px;padding:0 16px;border:1px solid var(--fxb-ac);border-radius:8px;background:var(--fxb-ac);color:#0e1422!important;font:500 14px/1 var(--fxb-sans);text-decoration:none!important;cursor:pointer}
.fxb-btn:hover{background:var(--fxb-ac2);border-color:var(--fxb-ac2)}
.fxb-btn--ghost{background:transparent;border-color:var(--fxb-ln);color:var(--fxb-tx)!important}
.fxb-btn--ghost:hover{background:transparent;border-color:var(--fxb-mut)}
.fxb-hint{margin:.8em 0 0;font-size:.9em;opacity:.75}

@media (prefers-reduced-motion:reduce){
	.fxb *,.fxb *::before,.fxb *::after{transition:none!important;animation:none!important}
}

/* No ligatures in code: => must stay =>, not an arrow glyph. Keep last, after every font shorthand. */
.fxb-code,.fxb-code *,.fxb code,.fxb-codebox pre,.fxb-codebox code,.fxb-meta dd{font-variant-ligatures:none;font-feature-settings:"liga" 0,"calt" 0}