:root{
  --bf-navy:#0B1F3A;
  --bf-ink:#0A1626;
  --bf-cyan:#1FB6C4;
  --bf-cyan-bright:#2DD9E8;
  --bf-blue:#2F6BFF;
  --bf-ivory:#F5F2EC;
  --bf-line:rgba(245,242,236,0.12);
  --bf-line-strong:rgba(245,242,236,0.22);
  --bf-glass:rgba(18,41,74,0.62);
}

.bf-shell-nav{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:1000;
  display:grid;
  grid-template-columns:minmax(280px,1fr) auto minmax(280px,1fr);
  align-items:center;
  gap:24px;
  padding:16px 40px;
  background:linear-gradient(180deg,rgba(10,22,38,0.94),rgba(10,22,38,0.62));
  border-bottom:0;
  backdrop-filter:blur(10px);
  color:var(--bf-ivory);
  font-family:'Segoe UI',-apple-system,'PingFang TC','Microsoft JhengHei',sans-serif;
}

.bf-shell-logo{
  display:flex;
  align-items:center;
  gap:11px;
  grid-column:1;
  justify-self:start;
  color:var(--bf-ivory);
  text-decoration:none;
  font-weight:800;
  letter-spacing:.5px;
  font-size:17px;
  white-space:nowrap;
}

.bf-shell-logo b{color:var(--bf-cyan-bright)}

.bf-shell-cube{
  width:34px;
  height:34px;
  border-radius:11px;
  background:linear-gradient(135deg,var(--bf-blue),var(--bf-cyan));
  display:grid;
  place-items:center;
  box-shadow:0 4px 18px rgba(47,107,255,.45);
  flex:0 0 auto;
}

.bf-shell-cube svg{width:22px;height:22px}

.bf-shell-links{
  position:absolute;
  left:50vw;
  transform:translateX(-50%);
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:center;
  justify-self:center;
  gap:14px;
  flex-wrap:wrap;
  color:rgba(245,242,236,.62);
  font-size:13px;
  line-height:1.4;
}

.bf-shell-links a{
  color:inherit;
  text-decoration:none;
  transition:.2s;
  white-space:nowrap;
}

.bf-shell-links a:hover{color:var(--bf-ivory)}
.bf-shell-links a.nav-active{color:var(--bf-cyan-bright);font-weight:700}

.bf-shell-right{
  display:flex;
  align-items:center;
  gap:14px;
  grid-column:3;
  justify-self:end;
  flex:0 0 auto;
  z-index:2;
}

.lang-toggle{
  display:flex;
  gap:2px;
  background:rgba(18,41,74,.6);
  border:1px solid var(--bf-line);
  border-radius:20px;
  padding:3px;
}

.lang-opt{
  font-size:12px;
  font-weight:700;
  padding:6px 13px;
  border-radius:16px;
  cursor:pointer;
  border:none;
  background:transparent;
  color:rgba(245,242,236,.55);
  transition:.2s;
  font-family:inherit;
  line-height:1.2;
}

.lang-opt.active{
  background:linear-gradient(120deg,var(--bf-blue),var(--bf-cyan));
  color:#fff;
}

.lang-opt:hover:not(.active){color:var(--bf-ivory)}

.bf-shell-main-offset{padding-top:108px!important}

body.lang-en{
  font-family:'Segoe UI',-apple-system,'Helvetica Neue',Arial,sans-serif;
}

.bf-footer{
  border-top:1px solid rgba(245,242,236,.11);
  background:
    radial-gradient(900px 220px at 50% 0%, rgba(31,182,196,.11), transparent 65%),
    rgba(10,22,38,.72);
  padding:30px 40px 34px;
  margin:0;
  margin-top:auto;
  text-align:center;
  color:rgba(245,242,236,.62);
  font-family:'Segoe UI',-apple-system,'PingFang TC','Microsoft JhengHei',sans-serif;
}

body:has(.bf-footer){
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

body:has(.bf-footer) > main,
body:has(.bf-footer) > .page,
body:has(.bf-footer) > header.hero,
body:has(.bf-footer) > section,
body:has(.bf-footer) > div:not(.modal-overlay):not(.bf-shell-right){
  flex-shrink:0;
}

.bf-footer .bf-footer-brand{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:11px;
  color:var(--bf-ivory);
  font-size:17px;
  font-weight:800;
  letter-spacing:.5px;
  margin-bottom:10px;
}

.bf-footer .bf-footer-brand b{color:var(--bf-cyan-bright)}
.bf-footer p{font-size:12.5px;line-height:1.65;margin:0;color:rgba(245,242,236,.46)}

main.bf-shell-main-offset{
  padding-top:120px!important;
  padding-bottom:40px!important;
}

body.text-slate-100{
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(47,107,255,0.16), transparent 60%),
    radial-gradient(900px 500px at 10% 110%, rgba(31,182,196,0.12), transparent 55%),
    var(--bf-ink)!important;
}

body .bg-darkCard{
  background:rgba(18,41,74,.66)!important;
  border-color:rgba(245,242,236,.12)!important;
}

body .card-shadow{box-shadow:0 16px 44px rgba(0,0,0,.22)!important}
body .rounded-xl{border-radius:18px!important}
body .text-textGray{color:rgba(245,242,236,.62)!important}

#solutions.mb-32{margin-bottom:64px!important}

.tmj-workbar{
  height:52px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 24px;
  background:rgba(10,22,38,.72);
  border-bottom:1px solid rgba(245,242,236,.1);
  flex-shrink:0;
}

.tmj-workbar .nav-btn{
  border:1px solid rgba(245,242,236,.12);
  background:rgba(18,41,74,.55);
  color:rgba(245,242,236,.66);
  border-radius:999px;
  padding:8px 14px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  transition:.2s;
  line-height:1;
  white-space:nowrap;
}

.tmj-workbar .nav-btn:hover{
  color:var(--bf-ivory);
  border-color:rgba(31,182,196,.45);
}

.tmj-workbar .nav-btn.active{
  background:linear-gradient(120deg,var(--bf-blue),var(--bf-cyan));
  border-color:transparent;
  color:#fff;
  box-shadow:0 8px 24px rgba(47,107,255,.26);
}

body:has(.tmj-workbar){
  background:var(--bf-ink)!important;
  color:var(--bf-ivory)!important;
}

body:has(.tmj-workbar) main,
body:has(.tmj-workbar) .main-wrap{
  background:var(--bf-ink)!important;
}

body:has(.tmj-workbar) aside,
body:has(.tmj-workbar) .chat-panel,
body:has(.tmj-workbar) .card,
body:has(.tmj-workbar) .pat-bar,
body:has(.tmj-workbar) .anim-card,
body:has(.tmj-workbar) .r-card,
body:has(.tmj-workbar) .pipe,
body:has(.tmj-workbar) .sc,
body:has(.tmj-workbar) .reg,
body:has(.tmj-workbar) .fbox,
body:has(.tmj-workbar) .upload-zone,
body:has(.tmj-workbar) .case-item,
body:has(.tmj-workbar) .ai-note{
  background:rgba(18,41,74,.72)!important;
  border-color:rgba(245,242,236,.12)!important;
  box-shadow:0 16px 44px rgba(0,0,0,.22)!important;
  color:var(--bf-ivory)!important;
}

body:has(.tmj-workbar) .case-item:hover,
body:has(.tmj-workbar) .case-item.active,
body:has(.tmj-workbar) .pipe.active,
body:has(.tmj-workbar) .pipe.done,
body:has(.tmj-workbar) .upload-zone:hover,
body:has(.tmj-workbar) .upload-zone.filled{
  background:rgba(31,182,196,.12)!important;
  border-color:rgba(31,182,196,.42)!important;
}

body:has(.tmj-workbar) .ct-slice,
body:has(.tmj-workbar) .mandible-canvas,
body:has(.tmj-workbar) .anim-card canvas,
body:has(.tmj-workbar) canvas{
  background:#071225!important;
}

body:has(.tmj-workbar) .pat-name,
body:has(.tmj-workbar) .c-name,
body:has(.tmj-workbar) .pipe-title,
body:has(.tmj-workbar) .anim-title,
body:has(.tmj-workbar) .u-title,
body:has(.tmj-workbar) .reg-n,
body:has(.tmj-workbar) .otable td,
body:has(.tmj-workbar) .card h1,
body:has(.tmj-workbar) .card h2,
body:has(.tmj-workbar) .card h3{
  color:var(--bf-ivory)!important;
}

body:has(.tmj-workbar) .pat-sub,
body:has(.tmj-workbar) .c-meta,
body:has(.tmj-workbar) .pipe-desc,
body:has(.tmj-workbar) .u-sub,
body:has(.tmj-workbar) .sl,
body:has(.tmj-workbar) .st-l,
body:has(.tmj-workbar) .anim-sub,
body:has(.tmj-workbar) .ai-note-body,
body:has(.tmj-workbar) .otable th{
  color:rgba(245,242,236,.58)!important;
}

body:has(.tmj-workbar) .card-title,
body:has(.tmj-workbar) .r-title,
body:has(.tmj-workbar) .ai-note-title,
body:has(.tmj-workbar) .st-v{
  color:var(--bf-cyan-bright)!important;
}

body:has(.tmj-workbar) .pat-av{
  background:linear-gradient(135deg,rgba(47,107,255,.22),rgba(31,182,196,.24))!important;
  border-color:rgba(31,182,196,.35)!important;
  color:var(--bf-cyan-bright)!important;
}

body:has(.tmj-workbar) .pat-tag,
body:has(.tmj-workbar) .cs,
body:has(.tmj-workbar) .chip{
  background:rgba(31,182,196,.13)!important;
  color:var(--bf-cyan-bright)!important;
}

body:has(.tmj-workbar) .otable th,
body:has(.tmj-workbar) .otable td,
body:has(.tmj-workbar) .aside-footer,
body:has(.tmj-workbar) .chat-hdr{
  border-color:rgba(245,242,236,.12)!important;
}

@media(max-width:1100px){
  .bf-shell-nav{display:flex;justify-content:space-between;padding:14px 20px}
  .bf-shell-links{display:none}
  .bf-shell-logo{font-size:15px}
  .tmj-workbar{overflow-x:auto;padding-inline:16px}
}
