:root{
  --bg0:#f7f8ff;
  --bg1:#eef2ff;
  --panel:rgba(11,16,36,.04);
  --panel2:rgba(11,16,36,.06);
  --stroke:rgba(11,16,36,.12);
  --text:rgba(11,16,36,.94);
  --muted:rgba(11,16,36,.72);
  --muted2:rgba(11,16,36,.58);
  --paper: rgba(255,255,255,.86);
  --paper2: rgba(255,255,255,.76);
  --paperStroke: rgba(11,16,36,.12);
  --ink: rgba(11,16,36,.94);
  --ink2: rgba(11,16,36,.72);
  --ink3: rgba(11,16,36,.58);
  --accent1:#7c4dff;
  --accent2:#16e0ff;
  --accent3:#2cff8f;
  --danger:#ff4d6d;
  --shadow: 0 24px 80px rgba(11,16,36,.12);
  --radius: 18px;
  --radius2: 26px;
  --max: 1180px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(1200px 800px at 15% 12%, rgba(124,77,255,.18), transparent 55%),
    radial-gradient(900px 700px at 85% 18%, rgba(22,224,255,.14), transparent 52%),
    radial-gradient(1000px 900px at 55% 90%, rgba(44,255,143,.10), transparent 55%),
    linear-gradient(180deg, var(--bg0), var(--bg1));
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  letter-spacing:.2px;
}
body.with-topbar{padding-top:49px}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(1200px 900px at 55% 35%, rgba(255,255,255,.70), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.55), transparent 45%);
  z-index:-1;
}
a{color:inherit; text-decoration:none}
.wrap{max-width:var(--max); margin:0 auto; padding:0 20px}
.container{max-width:var(--max); margin:0 auto; padding:0 20px}
.topbar{
  position:fixed; top:0; left:0; right:0; z-index:100;
  backdrop-filter: blur(14px);
  background:
    radial-gradient(920px 320px at 16% 0%, rgba(124,77,255,.50), transparent 62%),
    radial-gradient(900px 360px at 86% 12%, rgba(124,77,255,.44), transparent 62%),
    radial-gradient(820px 340px at 86% 46%, rgba(44,255,143,.16), transparent 64%),
    linear-gradient(180deg, rgba(20,26,64,.92), rgba(14,18,46,.80));
  border-bottom: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.88);
  box-shadow: 0 26px 80px rgba(11,16,36,.26);
}
.topbar a{color:inherit}
.workbench-subnav{
  position: sticky;
  top: 49px;
  z-index: 9;
  backdrop-filter: blur(14px);
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,.50));
  border-bottom: 1px solid var(--paperStroke);
}
.workbench-subnav-inner{
  display:flex;
  align-items:flex-end;
  gap: 22px;
  padding: 10px 0 6px;
  overflow:auto;
  scrollbar-width: none;
}
.workbench-subnav-inner::-webkit-scrollbar{display:none}
.workbench-tab{
  flex: 0 0 auto;
  padding: 10px 2px 14px;
  color: var(--ink3);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .2px;
  position: relative;
  transition: color .2s ease;
}
.workbench-tab:hover{
  color: var(--ink);
}
.workbench-tab:after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom: 6px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(22,224,255,.86), rgba(124,77,255,.80));
  opacity: 0;
  transform: scaleX(.2);
  transform-origin: left center;
  transition: opacity .2s ease, transform .2s ease;
  pointer-events:none;
}
.workbench-tab:hover:after{
  opacity: .55;
  transform: scaleX(.7);
}
.workbench-tab.active{
  color: var(--ink);
}
.workbench-tab.active:after{
  opacity: 1;
  transform: scaleX(1);
}
.topbar-inner{
  display:flex; align-items:center; justify-content:space-between;
  height:49px;
}
.topbar-left{
  display:flex;
  align-items:center;
  gap: 12px;
  min-width: 0;
}
.topbar-right{
  display:flex;
  align-items:center;
  gap: 12px;
  flex: 0 0 auto;
}
.brand{
  display:flex; align-items:center; gap:12px;
  font-weight:750;
  font-size: 16px;
  letter-spacing:.6px;
}
.topbar .brand{color: rgba(255,255,255,.92)}
.logo{
  width:32px; height:32px; border-radius:12px;
  display:block;
  object-fit:cover;
  box-shadow: 0 14px 40px rgba(0,0,0,.36), 0 0 22px rgba(22,224,255,.20);
  border: 1px solid rgba(255,255,255,.10);
}
.nav{
  display:flex; align-items:center; gap:18px;
  color: rgba(255,255,255,.92);
  font-size:14px;
}
.nav a{opacity:1}
.nav a:hover{opacity:.86; color: rgba(255,255,255,.76)}
.topbar-actions{
  display:flex;
  align-items:center;
  gap:12px;
}
.city-switch{
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.88);
  padding: 9px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  box-shadow: 0 14px 40px rgba(0,0,0,.22);
}
.city-switch:hover{
  background: rgba(255,255,255,.10);
  border-color: rgba(22,224,255,.22);
  color: rgba(255,255,255,.94);
}
.city-switch:after{
  content:"▾";
  font-size: 12px;
  opacity: .76;
  margin-left: 10px;
}
.topbar-account{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  max-width: 220px;
}
.topbar-account:after{display:none}
.topbar-account svg{
  width: 14px;
  height: 14px;
  display:block;
  opacity: .95;
}

.topbar .topbar-user-trigger{color: inherit}
.topbar .topbar-user-trigger:after{opacity: .76}
.topbar .topbar-user-menu{
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(180deg, rgba(11,16,36,.94), rgba(11,16,36,.82));
  box-shadow: 0 26px 80px rgba(11,16,36,.34);
}
.topbar .topbar-user-item{
  color: rgba(255,255,255,.88);
}
.topbar .topbar-user-item:hover{
  background: rgba(255,255,255,.08);
}
.city-modal{
  position: fixed;
  inset: 0;
  z-index: 200;
}
.city-modal-backdrop{
  position: absolute;
  inset: 0;
  background: rgba(11,16,36,.42);
  backdrop-filter: blur(6px);
}
.city-modal-panel{
  position: relative;
  width: min(980px, calc(100vw - 40px));
  max-height: calc(100vh - 80px);
  margin: 40px auto;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.18);
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78));
  backdrop-filter: blur(18px);
  box-shadow: 0 24px 80px rgba(11,16,36,.22);
  overflow: hidden;
}
.city-modal-head{
  padding: 16px 18px;
  background: linear-gradient(90deg, rgba(22,224,255,.18), rgba(124,77,255,.16));
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
}
.city-modal-title{
  font-size: 14px;
  font-weight: 900;
  color: rgba(11,16,36,.94);
}
.city-modal-controls{
  display: flex;
  gap: 10px;
  align-items: center;
  flex: 1;
  justify-content: center;
}
.city-province{
  min-width: 160px;
  height: 36px;
  border-radius: 10px;
  border: 1px solid rgba(11,16,36,.16);
  background: rgba(255,255,255,.86);
  padding: 0 10px;
  font-weight: 800;
  color: rgba(11,16,36,.88);
}
.city-search{
  width: min(360px, 100%);
  height: 36px;
  border-radius: 10px;
  border: 1px solid rgba(11,16,36,.16);
  background: rgba(255,255,255,.86);
  padding: 0 12px;
  font-weight: 800;
  color: rgba(11,16,36,.88);
}
.city-modal-close{
  width: 36px;
  height: 36px;
  border-radius: 10px;
  border: 1px solid rgba(11,16,36,.16);
  background: rgba(255,255,255,.78);
  cursor: pointer;
  font-size: 18px;
  font-weight: 900;
  color: rgba(11,16,36,.80);
}
.city-modal-close:hover{background: rgba(255,255,255,.92); color: rgba(11,16,36,.94)}
.city-modal-body{
  padding: 18px;
  overflow: auto;
  max-height: calc(100vh - 160px);
}
.city-section{margin-bottom: 18px}
.city-section-title{
  font-size: 13px;
  font-weight: 900;
  color: rgba(11,16,36,.86);
  margin-bottom: 10px;
}
.city-hot{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.city-chip{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid rgba(11,16,36,.14);
  background: rgba(255,255,255,.78);
  color: rgba(11,16,36,.88);
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
}
.city-chip:hover{background: rgba(255,255,255,.92)}
.city-chip-auto{
  gap: 8px;
  border-color: rgba(44,255,143,.34);
  background: linear-gradient(135deg, rgba(44,255,143,.20), rgba(22,224,255,.18), rgba(124,77,255,.12));
  color: rgba(11,16,36,.94);
  box-shadow: 0 14px 40px rgba(44,255,143,.10), 0 14px 40px rgba(22,224,255,.08);
}
.city-chip-auto:hover{
  background: linear-gradient(135deg, rgba(44,255,143,.26), rgba(22,224,255,.20), rgba(124,77,255,.14));
}
.city-chip-icon{
  width: 14px;
  height: 14px;
  display:block;
  opacity: .95;
}
.city-chip.active{
  border-color: rgba(22,224,255,.34);
  background: linear-gradient(135deg, rgba(22,224,255,.20), rgba(124,77,255,.16));
}
.city-initials{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.city-initial{
  width: 34px;
  height: 34px;
  border-radius: 12px;
  border: 1px solid rgba(11,16,36,.14);
  background: rgba(255,255,255,.78);
  font-weight: 900;
  cursor: pointer;
  color: rgba(11,16,36,.82);
}
.city-initial:hover{background: rgba(255,255,255,.92)}
.city-initial.active{
  border-color: rgba(22,224,255,.34);
  background: linear-gradient(135deg, rgba(22,224,255,.20), rgba(124,77,255,.16));
  color: rgba(11,16,36,.94);
}
.city-list{
  border-top: 1px solid rgba(11,16,36,.10);
  padding-top: 10px;
}
.city-group{
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 10px 0;
  border-bottom: 1px solid rgba(11,16,36,.06);
}
.city-group-letter{
  width: 26px;
  font-weight: 900;
  color: rgba(124,77,255,.86);
  flex: 0 0 auto;
}
.city-group-items{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.lang-switch{display:flex; gap:8px; align-items:center}
.lang-btn{
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(255,255,255,.70);
  color: var(--ink2);
  padding: 9px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.lang-btn:hover{background: rgba(255,255,255,.86); border-color: rgba(11,16,36,.16); color: var(--ink)}
.lang-btn.active{
  border-color: rgba(22,224,255,.34);
  background: linear-gradient(135deg, rgba(22,224,255,.18), rgba(124,77,255,.16));
  color: rgba(11,16,36,.94);
}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:10px;
  padding:12px 16px;
  border-radius: 14px;
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(255,255,255,.72);
  color: var(--ink);
  box-shadow: 0 14px 40px rgba(11,16,36,.10);
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
  font-weight:600;
}
.btn-sm{
  padding: 8px 12px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 800;
  box-shadow: 0 12px 34px rgba(11,16,36,.10);
}
.btn-icon{
  gap: 8px;
}
.btn-icon svg{
  width: 14px;
  height: 14px;
  display:block;
}
.btn:hover{transform: translateY(-1px); background: rgba(255,255,255,.86); border-color: rgba(11,16,36,.16)}
.btn-primary{
  border-color: rgba(22,224,255,.30);
  background: linear-gradient(135deg, rgba(22,224,255,.22), rgba(124,77,255,.20));
  color: rgba(11,16,36,.94);
  box-shadow: 0 18px 56px rgba(22,224,255,.10), 0 18px 56px rgba(124,77,255,.08);
}
.btn-primary:hover{border-color: rgba(22,224,255,.40)}

.topbar-user{
  position: relative;
}
.topbar-user > summary{
  list-style: none;
}
.topbar-user > summary::-webkit-details-marker{display:none}
.topbar-user-trigger{
  cursor: pointer;
  user-select: none;
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.topbar-user-trigger:after{
  content:"▾";
  font-size: 12px;
  opacity: .76;
  margin-left: 10px;
}
.topbar-user-menu{
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  min-width: 180px;
  padding: 8px;
  border-radius: 16px;
  border: 1px solid rgba(11,16,36,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.72));
  backdrop-filter: blur(14px);
  box-shadow: 0 24px 80px rgba(11,16,36,.14);
}
.topbar-user-item{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  border-radius: 12px;
  color: rgba(11,16,36,.88);
  font-size: 13px;
  font-weight: 700;
}
.topbar-user-item:hover{
  background: rgba(11,16,36,.06);
}

.panel .btn,
.plan .btn,
.doc-card .btn,
.blog-post-card .btn,
.blog-post-detail .btn,
.comments-section .btn,
.empty-state .btn{
  border-color: rgba(11,16,36,.12);
  background: rgba(11,16,36,.04);
  color: var(--ink);
  box-shadow: 0 14px 40px rgba(0,0,0,.10);
}
.panel .btn:hover,
.plan .btn:hover,
.doc-card .btn:hover,
.blog-post-card .btn:hover,
.blog-post-detail .btn:hover,
.comments-section .btn:hover,
.empty-state .btn:hover{
  background: rgba(11,16,36,.06);
  border-color: rgba(11,16,36,.16);
}
.panel .btn-primary,
.plan .btn-primary,
.doc-card .btn-primary,
.blog-post-card .btn-primary,
.blog-post-detail .btn-primary,
.comments-section .btn-primary,
.empty-state .btn-primary{
  border-color: rgba(22,224,255,.30);
  background: linear-gradient(135deg, rgba(22,224,255,.22), rgba(124,77,255,.20));
  color: rgba(11,16,36,.94);
  box-shadow: 0 18px 56px rgba(22,224,255,.10), 0 18px 56px rgba(124,77,255,.08);
}

.hero{
  padding: 48px 0 30px;
  background: rgba(255,255,255,.86);
  border-bottom: 1px solid var(--paperStroke);
  color: var(--ink);
}
.auth-login .hero{padding: 34px 0 20px}
.auth-login-wrap{max-width: 660px}
.auth-login .section-head{margin-bottom: 10px; align-items:flex-start}
.auth-login h2{font-size: clamp(19px, 2.2vw, 26px)}
.auth-login .lead{font-size: 14px; line-height: 1.55}
.auth-login .card-inner{padding: 12px}
.auth-login .demo-top{padding: 8px 10px}
.auth-login .demo-body{padding: 10px}
.auth-login-card{border-radius: 22px}
.auth-login-card .demo-title{font-size: 13px}
.auth-login-card .spark{font-size: 11px}
.auth-login .btn{padding: 10px 14px}
.auth-login #qrcode{padding: 0 !important}
.auth-login #qrcode iframe{width: 260px !important; height: 260px !important}
.auth-login #qrStatus{margin-top: 6px !important; font-size: 12px}
.auth-login-form{display:grid; gap:10px; margin-bottom:4px}
.auth-login-actions{display:flex; justify-content:flex-end; margin-top:6px}
.auth-login-submit{min-width:110px}
.auth-login-divider{margin:10px 0 8px; text-align:center; font-size:12px; color:var(--ink3)}
.auth-login-divider span{position:relative; padding:0 10px}
.auth-login-divider span:before,
.auth-login-divider span:after{
  content:"";
  position:absolute;
  top:50%;
  width:56px;
  height:1px;
  background:rgba(11,16,36,.12);
}
.auth-login-divider span:before{right:100%}
.auth-login-divider span:after{left:100%}
.auth-login-providers{display:grid; gap:8px; margin-top:4px}
.auth-provider-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:100%;
  padding:9px 14px;
  border-radius:999px;
  border:1px solid rgba(11,16,36,.12);
  background:#fff;
  cursor:pointer;
  font-size:14px;
  font-weight:500;
}
.auth-provider-btn:hover{
  background:rgba(255,255,255,.96);
  border-color:rgba(11,16,36,.18);
}
.auth-provider-btn--google{
  border-color:rgba(60,64,67,.30);
  box-shadow:0 1px 2px rgba(0,0,0,.10);
}
.auth-provider-btn--wechat{
  border-color:rgba(7,193,96,.36);
}
.auth-provider-icon{
  display:flex;
  align-items:center;
  justify-content:center;
}
.auth-provider-text{white-space:nowrap}
.auth-login-wechat{
  margin-top:12px;
  padding:10px 10px 12px;
  border-radius:16px;
  border:1px dashed rgba(11,16,36,.14);
  background:rgba(255,255,255,.82);
}
.auth-login-wechat-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:6px;
}
.auth-login-wechat-close{
  padding:0 10px;
  min-width:auto;
}
.console-shell{
  position: relative;
  padding: 18px 0 28px;
  min-height: calc(100vh - 49px);
}
.console-shell::before{
  content:"";
  position:absolute;
  inset: 0 0 auto;
  height: 380px;
  background:
    radial-gradient(circle at 14% 20%, rgba(22,224,255,.16), transparent 34%),
    radial-gradient(circle at 88% 8%, rgba(124,77,255,.16), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.36), rgba(255,255,255,0));
  pointer-events:none;
}
.console-wrap{
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 18px;
}
.console-layout{
  display:grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 16px;
  align-items:start;
  position: relative;
  z-index: 1;
}
.console-sidebar,
.console-panel{
  border-radius: 28px;
  border: 1px solid var(--paperStroke);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.76)),
    linear-gradient(135deg, rgba(22,224,255,.08), rgba(124,77,255,.08));
  box-shadow:
    0 24px 80px rgba(11,16,36,.10),
    inset 0 1px 0 rgba(255,255,255,.65);
  backdrop-filter: blur(24px);
}
.console-sidebar{
  position: sticky;
  top: 72px;
  padding: 14px;
  overflow: hidden;
}
.console-sidebar::before{
  content:"";
  position:absolute;
  inset: -40px auto auto -40px;
  width: 160px;
  height: 160px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(22,224,255,.16), rgba(22,224,255,0) 72%);
  pointer-events:none;
}
.console-brand{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 10px 10px 12px;
  border-radius: 18px;
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(11,16,36,.06);
}
.console-brand strong{
  display:block;
  color: var(--ink);
  font-size: 14px;
}
.console-brand small{
  display:block;
  margin-top: 3px;
  color: var(--ink3);
  font-size: 12px;
}
.console-brand-mark{
  display:grid;
  place-items:center;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(22,224,255,.92), rgba(124,77,255,.92));
  color:#fff;
  font-weight: 900;
  box-shadow: 0 18px 56px rgba(22,224,255,.24);
}
.console-page-head h2,
.console-hero h2{
  margin: 6px 0 0;
  font-size: clamp(24px, 2.8vw, 34px);
  line-height: 1.04;
  letter-spacing: -.04em;
  color: var(--ink);
}
.console-page-head p,
.console-hero p,
.console-panel-head p{
  margin: 6px 0 0;
  color: var(--ink3);
  font-size: 12px;
  line-height: 1.6;
}
.console-eyebrow{
  display:inline-flex;
  align-items:center;
  padding: 5px 9px;
  border-radius: 999px;
  border: 1px solid rgba(22,224,255,.20);
  background: rgba(22,224,255,.08);
  color: #1971a6;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.console-nav{
  display:grid;
  gap: 8px;
  margin-top: 14px;
}
.console-nav-link{
  display:flex;
  align-items:center;
  min-height: 42px;
  padding: 0 12px;
  border-radius: 14px;
  border: 1px solid rgba(11,16,36,.08);
  background: rgba(255,255,255,.54);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.console-nav-link span{
  font-size: 13px;
  font-weight: 800;
  color: var(--ink);
}
.console-nav-link:hover,
.console-nav-link.active{
  transform: translateY(-1px);
  border-color: rgba(22,224,255,.24);
  box-shadow: 0 16px 42px rgba(22,224,255,.10), 0 16px 42px rgba(124,77,255,.08);
}
.console-sidebar-foot{
  display:grid;
  gap: 8px;
  margin-top: 12px;
}
.console-side-link{
  display:block;
  padding: 9px 10px;
  border-radius: 12px;
  color: var(--ink);
  background: rgba(255,255,255,.76);
  border: 1px solid rgba(11,16,36,.08);
  font-size: 12px;
}
.console-main{
  display:grid;
  gap: 12px;
}
.console-stage{
  display:grid;
  gap: 12px;
}
.console-hero{
  display:grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(240px, .7fr);
  gap: 14px;
  padding: 12px 16px 16px;
  border-radius: 24px;
  border: 1px solid rgba(11,16,36,.08);
  background:
    radial-gradient(circle at 0% 0%, rgba(22,224,255,.10), transparent 36%),
    radial-gradient(circle at 100% 20%, rgba(124,77,255,.12), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.76));
  box-shadow: 0 28px 88px rgba(11,16,36,.10);
}
.console-hero-main{
  display:grid;
  gap: 10px;
  align-content:start;
}
.console-hero-tags{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
}
.console-pill{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.80);
  border: 1px solid rgba(11,16,36,.08);
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}
.console-inline-pill{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(22,224,255,.08);
  border: 1px solid rgba(22,224,255,.16);
  color: #1575a0;
  font-size: 12px;
  font-weight: 700;
}
.console-hero-side{
  display:grid;
  align-content:center;
  justify-items:start;
  gap: 6px;
  padding: 16px;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(17,24,39,.96), rgba(22,33,62,.92));
  color:#fff;
  box-shadow: 0 24px 72px rgba(17,24,39,.20);
}
.console-spotlight-number{
  font-size: clamp(34px, 5vw, 54px);
  line-height: .95;
  font-weight: 900;
  letter-spacing: -.05em;
}
.console-spotlight-label{
  font-size: 14px;
  font-weight: 800;
}
.console-spotlight-meta{
  color: rgba(255,255,255,.72);
  font-size: 12px;
  line-height: 1.7;
}
.console-hero-detail{
  grid-template-columns: minmax(0, 1fr) auto;
}
.console-hero-actions{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
}
.console-metrics{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.console-metrics-detail{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.console-metric-card{
  padding: 14px 14px 13px;
  border-radius: 18px;
  border: 1px solid rgba(11,16,36,.08);
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.72));
  box-shadow: 0 18px 56px rgba(11,16,36,.08);
}
.console-metric-card span{
  display:block;
  color: var(--ink3);
  font-size: 12px;
}
.console-metric-card strong{
  display:block;
  margin-top: 8px;
  color: var(--ink);
  font-size: clamp(22px, 2.5vw, 30px);
  line-height: 1;
  letter-spacing: -.04em;
}
.console-metric-card small{
  display:block;
  margin-top: 8px;
  color: var(--ink3);
  font-size: 12px;
  line-height: 1.5;
}
.console-metric-text{
  font-size: 18px !important;
  line-height: 1.3 !important;
  letter-spacing: -.02em !important;
}
.console-panel{
  padding: 14px;
}
.console-panel-deep{
  padding: 16px;
}
.console-panel-wide{
  width: 100%;
}
.console-panel-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.console-panel-head h3{
  margin: 0;
  font-size: 16px;
  color: var(--ink);
}
.console-bubble-tabs{
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
  margin-bottom: 12px;
}
.console-bubble-tab{
  display:inline-flex;
  align-items:center;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid rgba(11,16,36,.08);
  background: rgba(255,255,255,.56);
  color: var(--ink2);
  text-decoration:none;
  font-size: 13px;
  font-weight: 700;
  transition: border-color .18s ease, color .18s ease, transform .18s ease;
}
.console-bubble-tab:hover,
.console-bubble-tab.active{
  color: var(--brand);
  border-color: rgba(22,224,255,.26);
  transform: translateY(-1px);
}
.console-bubble-cloud{
  position: relative;
  width: 100%;
  height: 100%;
}
.console-bubble-stage{
  position: relative;
  height: 420px;
  padding: 0;
  border-radius: 18px;
  border: 1px solid rgba(11,16,36,.06);
  background:
    radial-gradient(circle at 50% 50%, rgba(22,224,255,.06), transparent 40%),
    linear-gradient(180deg, rgba(255,255,255,.46), rgba(255,255,255,.20));
  overflow: hidden;
}
.console-bubble{
  position: absolute;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding: 12px;
  border-radius: 999px;
  border: 1px solid rgba(22,224,255,.18);
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.76), rgba(255,255,255,.18) 28%, rgba(124,77,255,.12) 62%, rgba(22,224,255,.18));
  box-shadow: 0 20px 60px rgba(124,77,255,.12), inset 0 1px 0 rgba(255,255,255,.50);
  color: var(--ink);
  text-decoration:none;
  transition: transform .18s ease, box-shadow .18s ease;
  transform: translate(-50%, -50%);
}
.console-bubble:hover{
  transform: translate(-50%, calc(-50% - 3px)) scale(1.02);
  box-shadow: 0 24px 80px rgba(22,224,255,.14), 0 24px 80px rgba(124,77,255,.12);
}
.console-bubble.active{
  border-color: rgba(22,224,255,.38);
  box-shadow: 0 26px 88px rgba(22,224,255,.18), 0 24px 80px rgba(124,77,255,.14);
}
.console-bubble strong{
  display:block;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
}
.console-bubble span{
  display:block;
  margin-top: 6px;
  font-size: 11px;
  color: var(--ink3);
}
.console-bubble.bubble-sm{width: 96px; height: 96px;}
.console-bubble.bubble-md{width: 126px; height: 126px;}
.console-bubble.bubble-lg{width: 156px; height: 156px;}
.console-bubble.bubble-xl{width: 190px; height: 190px;}
.console-bubble:nth-child(1){left: 12%; top: 24%;}
.console-bubble:nth-child(2){left: 27%; top: 16%;}
.console-bubble:nth-child(3){left: 44%; top: 28%;}
.console-bubble:nth-child(4){left: 61%; top: 18%;}
.console-bubble:nth-child(5){left: 78%; top: 26%;}
.console-bubble:nth-child(6){left: 91%; top: 16%;}
.console-bubble:nth-child(7){left: 18%; top: 54%;}
.console-bubble:nth-child(8){left: 35%; top: 44%;}
.console-bubble:nth-child(9){left: 53%; top: 56%;}
.console-bubble:nth-child(10){left: 70%; top: 46%;}
.console-bubble:nth-child(11){left: 85%; top: 58%;}
.console-bubble:nth-child(12){left: 10%; top: 76%;}
.console-bubble:nth-child(13){left: 26%; top: 72%;}
.console-bubble:nth-child(14){left: 42%; top: 82%;}
.console-bubble:nth-child(15){left: 58%; top: 74%;}
.console-bubble:nth-child(16){left: 74%; top: 82%;}
.console-bubble:nth-child(17){left: 90%; top: 76%;}
.console-bubble:nth-child(18){left: 50%; top: 12%;}
.console-bubble:nth-child(19){left: 66%; top: 68%;}
.console-bubble:nth-child(20){left: 33%; top: 60%;}
.console-bubble:nth-child(21){left: 22%; top: 34%;}
.console-bubble:nth-child(22){left: 48%; top: 42%;}
.console-bubble:nth-child(23){left: 80%; top: 38%;}
.console-bubble:nth-child(24){left: 63%; top: 88%;}
.console-grid-two{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.console-stack{
  display:grid;
  gap: 12px;
}
.console-ranking{
  display:grid;
  gap: 10px;
}
.console-ranking-item{
  display:grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 10px;
  align-items:center;
  padding: 10px 12px;
  border-radius: 16px;
  background: rgba(255,255,255,.60);
  border: 1px solid rgba(11,16,36,.06);
}
.console-ranking-index{
  display:grid;
  place-items:center;
  width: 40px;
  height: 40px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(22,224,255,.16), rgba(124,77,255,.16));
  color: var(--ink);
  font-weight: 900;
}
.console-ranking-body strong,
.console-mini-list-item strong{
  display:block;
  color: var(--ink);
}
.console-ranking-body small{
  display:block;
  margin-top: 4px;
  color: var(--ink3);
  font-size: 12px;
}
.console-mini-list{
  display:grid;
  gap: 8px;
}
.console-mini-list-item,
.console-mini-kpis > div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.60);
  border: 1px solid rgba(11,16,36,.06);
}
.console-mini-list-item span,
.console-mini-kpis span{
  color: var(--ink2);
  font-size: 13px;
}
.console-mini-kpis{
  display:grid;
  gap: 10px;
}
.console-filters{
  display:grid;
  grid-template-columns: minmax(220px, 1.4fr) repeat(4, minmax(130px, .78fr)) auto;
  gap: 10px;
  margin-bottom: 10px;
}
.console-filters input,
.console-filters select{
  width:100%;
  min-height: 42px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(255,255,255,.78);
  color: var(--ink);
  font-size: 14px;
}
.console-results-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.54);
  border: 1px solid rgba(11,16,36,.06);
  color: var(--ink2);
  font-size: 13px;
}
.console-results-bar-actions{
  flex-wrap: wrap;
}
.console-clear-link{
  color: var(--brand);
  text-decoration:none;
  font-weight: 700;
}
.console-clear-link:hover{
  text-decoration: underline;
}
.console-table{
  display:grid;
  gap: 8px;
}
.console-table-head,
.console-table-row{
  display:grid;
  grid-template-columns: minmax(200px, 1.5fr) minmax(110px, .8fr) minmax(100px, .7fr) minmax(84px, .55fr) minmax(120px, .75fr);
  gap: 10px;
  align-items:center;
}
.console-table-head{
  padding: 0 10px;
  color: var(--ink3);
  font-size: 12px;
  font-weight: 800;
}
.console-table-row{
  padding: 12px 10px;
  border-radius: 16px;
  border: 1px solid rgba(11,16,36,.08);
  background: rgba(255,255,255,.66);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.console-table-row:hover{
  transform: translateY(-2px);
  border-color: rgba(22,224,255,.18);
  box-shadow: 0 18px 56px rgba(22,224,255,.10), 0 18px 56px rgba(124,77,255,.08);
}
.console-table-row strong{
  display:block;
  color: var(--ink);
  font-size: 14px;
}
.console-table-row small{
  display:block;
  margin-top: 4px;
  color: var(--ink3);
  font-size: 12px;
}
.console-table-enterprises .console-table-head,
.console-table-enterprises .console-table-row{
  grid-template-columns: 42px minmax(220px, 1.7fr) minmax(110px, .8fr) minmax(84px, .65fr) minmax(84px, .65fr) minmax(120px, .9fr) minmax(110px, .8fr) minmax(92px, .75fr);
}
.console-sort-link{
  color: inherit;
  text-decoration: none;
}
.console-sort-link.active{
  color: var(--brand);
}
.console-cell-link{
  display:block;
  color: inherit;
  text-decoration: none;
}
.console-cell-link:hover strong{
  color: var(--brand);
}
.console-check-wrap{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.console-check-wrap input{
  width:16px;
  height:16px;
}
.console-detail-grid{
  display:grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
  gap: 12px;
}
.console-kv-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}
.console-kv-grid span{
  display:block;
  color: var(--ink3);
  font-size: 12px;
}
.console-kv-grid strong{
  display:block;
  margin-top: 6px;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.6;
  word-break: break-word;
}
.console-richtext{
  margin-top: 12px;
  padding: 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.60);
  border: 1px solid rgba(11,16,36,.08);
  color: var(--ink2);
  line-height: 1.72;
}
.console-tag-list{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
}
.console-tag{
  display:inline-flex;
  align-items:center;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(22,224,255,.18);
  background: rgba(22,224,255,.08);
  color: #1971a6;
  font-size: 12px;
  font-weight: 700;
}
.console-empty{
  padding: 14px;
  border-radius: 14px;
  border: 1px dashed rgba(11,16,36,.12);
  color: var(--ink3);
  background: rgba(255,255,255,.42);
}
.console-bars{
  display:grid;
  gap: 10px;
}
.console-bar-card{
  padding: 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.58);
  border: 1px solid rgba(11,16,36,.06);
}
.console-bar-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.console-bar-head strong{
  color: var(--ink);
  font-size: 14px;
}
.console-bar-head span,
.console-bar-card small{
  color: var(--ink3);
  font-size: 12px;
}
.console-progress{
  height: 12px;
  border-radius: 999px;
  background: rgba(11,16,36,.08);
  overflow:hidden;
}
.console-progress-fill{
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(22,224,255,.96), rgba(124,77,255,.92));
  box-shadow: 0 10px 28px rgba(22,224,255,.18);
}
.console-progress-fill.wechat{
  background: linear-gradient(90deg, #22c55e, #16a34a);
}
.console-progress-fill.ai{
  background: linear-gradient(90deg, #7c3aed, #8b5cf6);
}
.console-progress-fill.official{
  background: linear-gradient(90deg, #06b6d4, #3b82f6);
}
.console-progress-fill.w-10{width: 10%;}
.console-progress-fill.w-20{width: 20%;}
.console-progress-fill.w-30{width: 30%;}
.console-progress-fill.w-40{width: 40%;}
.console-progress-fill.w-50{width: 50%;}
.console-progress-fill.w-60{width: 60%;}
.console-progress-fill.w-70{width: 70%;}
.console-progress-fill.w-80{width: 80%;}
.console-progress-fill.w-90{width: 90%;}
.console-progress-fill.w-100{width: 100%;}
.console-pagination{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap: 12px;
  margin-top: 12px;
}
.console-page-btn{
  padding: 9px 14px;
  border-radius: 999px;
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(255,255,255,.76);
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
}
.console-page-state{
  color: var(--ink3);
  font-size: 12px;
}
@media (max-width: 1100px){
  .console-layout{
    grid-template-columns: 1fr;
  }
  .console-sidebar{
    position: static;
  }
  .console-metrics{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .console-metrics-detail{
    grid-template-columns: 1fr;
  }
  .console-detail-grid{
    grid-template-columns: 1fr;
  }
  .console-grid-two,
  .console-hero,
  .console-hero-detail{
    grid-template-columns: 1fr;
  }
  .console-filters{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 820px){
  .console-table-head,
  .console-table-row{
    grid-template-columns: minmax(140px, 1.3fr) repeat(4, minmax(72px, .7fr));
  }
  .console-table-enterprises .console-table-head,
  .console-table-enterprises .console-table-row{
    grid-template-columns: 42px minmax(180px, 1.35fr) minmax(88px, .8fr) minmax(72px, .6fr) minmax(72px, .6fr) minmax(100px, .85fr) minmax(100px, .8fr) minmax(84px, .7fr);
  }
}
@media (max-width: 720px){
  .console-shell{
    padding-top: 12px;
  }
  .console-wrap{
    padding: 0 12px;
  }
  .console-metrics{
    grid-template-columns: 1fr;
  }
  .console-filters,
  .console-kv-grid{
    grid-template-columns: 1fr;
  }
  .console-results-bar,
  .console-hero-tags{
    display:grid;
  }
  .console-bubble-stage{
    height: 520px;
  }
  .console-bubble:nth-child(1){left: 18%; top: 14%;}
  .console-bubble:nth-child(2){left: 52%; top: 10%;}
  .console-bubble:nth-child(3){left: 82%; top: 18%;}
  .console-bubble:nth-child(4){left: 26%; top: 34%;}
  .console-bubble:nth-child(5){left: 68%; top: 30%;}
  .console-bubble:nth-child(6){left: 46%; top: 50%;}
  .console-bubble:nth-child(7){left: 16%; top: 62%;}
  .console-bubble:nth-child(8){left: 80%; top: 58%;}
  .console-bubble:nth-child(9){left: 30%; top: 82%;}
  .console-bubble:nth-child(10){left: 66%; top: 84%;}
  .console-table-head{
    display:none;
  }
  .console-table-row{
    grid-template-columns: 1fr;
  }
  .console-table-enterprises .console-table-row{
    grid-template-columns: 1fr;
  }
  .console-pagination{
    justify-content: space-between;
  }
}
.hero-grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 26px;
  align-items: stretch;
}
.kicker{
  display:inline-flex; align-items:center; gap:10px;
  padding:7px 10px;
  border-radius: 999px;
  border:1px solid var(--paperStroke);
  background: rgba(255,255,255,.78);
  color: var(--ink2);
  font-size: 12px;
}
.dot{
  width:8px; height:8px; border-radius:99px;
  background: radial-gradient(circle at 30% 30%, #fff, var(--accent2));
  box-shadow: 0 0 20px rgba(22,224,255,.55);
}
h1{
  margin: 8px 0 6px;
  font-size: 28px;
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: -.5px;
}
.subtitle{
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
  max-width: 52ch;
}
.hero-cta{
  display:flex; gap:12px; flex-wrap:wrap; align-items:center;
  margin-top: 18px;
}
.meta{
  margin-top: 12px;
  display:flex; gap:14px; flex-wrap:wrap;
  color: var(--muted2);
  font-size: 12px;
}
.meta-item{
  display:flex; align-items:center; gap:10px;
  padding: 8px 10px;
  border: 1px solid var(--paperStroke);
  background: rgba(255,255,255,.80);
  border-radius: 12px;
  color: var(--ink2);
}
.pill{
  width:10px; height:10px; border-radius: 99px;
  background: linear-gradient(180deg, var(--accent1), var(--accent2));
  box-shadow: 0 0 18px rgba(124,77,255,.26);
}
.card{
  border-radius: var(--radius2);
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  box-shadow: 0 26px 80px rgba(0,0,0,.34);
  overflow:hidden;
  color: var(--ink);
}
.card-inner{padding:18px}
.demo{
  display:grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.demo-top{
  display:flex; align-items:center; justify-content:space-between; gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(11,16,36,.10);
  background: rgba(255,255,255,.55);
}
.demo-title{font-weight:650; font-size: 14px; color: var(--ink2)}
.spark{display:flex; align-items:center; gap:8px; color: var(--ink3); font-size: 12px}
.spark i{
  width: 10px; height: 10px; border-radius:99px;
  background: radial-gradient(circle at 30% 30%, #fff, var(--accent3));
  box-shadow: 0 0 14px rgba(44,255,143,.35);
  display:inline-block;
}
.demo-body{padding: 16px}
.jobs-hero-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.jobs-file-input{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  border:0;
}
.jobs-upload-btn{
  cursor:pointer;
  user-select:none;
  border-color: rgba(11,16,36,.14);
  background: rgba(255,255,255,.66);
  backdrop-filter: blur(10px);
}
.jobs-upload-btn:disabled{
  opacity:.55;
  cursor:not-allowed;
  box-shadow: none;
  transform: none;
}
.jobs-upload-btn:hover{
  border-color: rgba(22,224,255,.26);
  box-shadow: 0 18px 56px rgba(22,224,255,.10), 0 18px 56px rgba(124,77,255,.08);
}
.jobs-submit-btn{
  position:relative;
  overflow:hidden;
}
.jobs-submit-btn:before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(420px 120px at 10% 0%, rgba(255,255,255,.60), transparent 55%);
  opacity:.55;
  transform: translateX(-30%);
  transition: transform .35s ease, opacity .35s ease;
  pointer-events:none;
}
.jobs-submit-btn:hover:before{
  transform: translateX(0%);
  opacity:.72;
}
.jobs-file-hint{
  font-size: 12px;
  color: var(--ink3);
  max-width: 240px;
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jobs-list{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
  align-items: stretch;
}
.job-card{
  position: relative;
  border-radius: var(--radius2);
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  box-shadow: 0 26px 80px rgba(0,0,0,.22);
  padding: 18px;
  overflow:hidden;
  color: var(--ink);
}
.job-card:after{
  content:"";
  position:absolute;
  inset: -1px;
  border-radius: var(--radius2);
  pointer-events:none;
  background: linear-gradient(135deg, rgba(22,224,255,.14), rgba(124,77,255,.12), rgba(44,255,143,.10));
  filter: blur(18px);
  opacity: .16;
  z-index: 0;
}
.job-head,
.job-desc,
.job-actions,
.job-dismiss-panel{position:relative; z-index:1}
.job-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 14px;
}
.job-main{min-width:0}
.job-title{
  font-size: 18px;
  font-weight: 760;
  letter-spacing: -.3px;
  margin: 0 0 8px;
  line-height: 1.25;
}
.job-meta{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
  color: var(--ink3);
  font-size: 12px;
  line-height: 1.4;
}
.job-sep{opacity:.55}
.job-time{
  font-size: 12px;
  color: var(--ink3);
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(11,16,36,.04);
  padding: 8px 10px;
  border-radius: 999px;
  white-space: nowrap;
}
.job-desc{
  margin-top: 12px;
  color: var(--ink2);
  font-size: 14px;
  line-height: 1.7;
  overflow-wrap: anywhere;
}
.job-actions{
  margin-top: 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  flex-wrap:wrap;
}
.job-link{
  display:inline-flex;
  align-items:center;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(11,16,36,.04);
  color: var(--ink2);
  font-size: 12px;
  font-weight: 700;
}
.job-link:hover{
  background: rgba(11,16,36,.06);
  border-color: rgba(11,16,36,.14);
  color: var(--ink);
}
.job-dismiss{
  padding: 10px 12px;
  min-width: auto;
  font-size: 12px;
  border-radius: 999px;
}
.job-dismiss-panel{
  margin-top: 14px;
  border-top: 1px solid rgba(11,16,36,.10);
  padding-top: 12px;
}

.job-detail-meta{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
  color: var(--ink2);
  margin-top: 6px;
}
.job-detail-pill{
  display:inline-flex;
  align-items:center;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(255,255,255,.78);
  color: var(--ink2);
  font-size: 12px;
  font-weight: 800;
}
.job-detail-pill-link{
  gap: 8px;
  padding-right: 8px;
  user-select:none;
}
.enterprise-hero-dark .job-detail-pill-link{
  border-color: rgba(22,224,255,.22);
  background: linear-gradient(135deg, rgba(22,224,255,.14), rgba(124,77,255,.10));
  box-shadow: 0 18px 56px rgba(22,224,255,.08), 0 18px 56px rgba(124,77,255,.06);
  color: rgba(11,16,36,.92);
  cursor:pointer;
}
.enterprise-hero-dark .job-detail-pill-link:hover{
  border-color: rgba(22,224,255,.32);
  background: linear-gradient(135deg, rgba(22,224,255,.18), rgba(124,77,255,.12));
  transform: translateY(-1px);
}
.enterprise-hero-dark .job-detail-pill-link:active{
  transform: translateY(0);
}
.job-detail-pill-link svg{
  width: 14px;
  height: 14px;
  opacity: .92;
}
.job-detail-pill-link:hover{
  background: rgba(11,16,36,.04);
  border-color: rgba(22,224,255,.18);
}
.job-detail-actions{
  margin-top: 14px;
  display:flex;
  gap: 10px;
  flex-wrap:wrap;
}
.job-detail-grid{
  display:grid;
  grid-template-columns: 1fr 320px;
  gap: 14px;
  align-items:start;
  margin-top: 12px;
}
.job-detail-kv{
  margin-top: 12px;
  display:grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
.job-detail-kv .k{
  display:inline-block;
  min-width: 52px;
  color: var(--ink3);
  font-weight: 900;
  font-size: 12px;
}
.job-detail-kv .v{
  color: var(--ink2);
  font-size: 13px;
  line-height: 1.6;
}
.job-detail-foot{
  margin-top: 14px;
}
@media (max-width: 980px){
  .job-detail-grid{grid-template-columns: 1fr}
}

.enterprise-searchbar{
  margin-top: 18px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width: min(80%, 880px);
  margin-left: 0;
  margin-right: auto;
  gap: 0;
  flex-wrap: nowrap;
}
.enterprise-search-input{
  flex: 1;
  min-width: 0;
  height: 52px;
  border-radius: 14px 0 0 14px;
  border: 2px solid rgba(76,29,149,1);
  background: rgba(255,255,255,.92);
  padding: 0 14px;
  font-size: 14px;
  color: var(--ink);
  outline: none;
  border-right: 0;
}
.enterprise-search-input::placeholder{
  color: var(--ink3);
}
.enterprise-search-input:focus{
  border-color: rgba(76,29,149,1);
  box-shadow: 0 18px 56px rgba(124,77,255,.12), 0 18px 56px rgba(22,224,255,.06);
}
.enterprise-search-btn{
  height: 52px;
  padding: 0 22px;
  border-radius: 0 14px 14px 0;
  margin-left: -2px;
  border-left: 0;
  white-space: nowrap;
  border: 2px solid rgba(76,29,149,1);
  background: rgba(76,29,149,1);
  box-shadow: 0 18px 56px rgba(76,29,149,.12);
  color: rgba(255,255,255,.94);
}
.enterprise-search-btn:hover{
  border-color: rgba(76,29,149,1);
  background: rgba(76,29,149,1);
}
.enterprise-hero-dark .enterprise-search-input{
  border-color: rgba(76,29,149,1);
  background: rgba(255,255,255,.94);
  color: var(--ink);
}
.enterprise-hero-dark .enterprise-search-input::placeholder{
  color: var(--ink3);
}
.enterprise-hero-dark .enterprise-search-input:focus{
  border-color: rgba(76,29,149,1);
  box-shadow: 0 18px 56px rgba(124,77,255,.12), 0 18px 56px rgba(22,224,255,.06);
}
.enterprise-hero-dark .enterprise-search-btn{
  border: 2px solid rgba(76,29,149,1);
  background: rgba(76,29,149,1);
  box-shadow: 0 18px 56px rgba(76,29,149,.12);
  color: rgba(255,255,255,.94);
}
.enterprise-hero-dark .enterprise-search-btn:hover{
  border-color: rgba(76,29,149,1);
  background: rgba(76,29,149,1);
}
@media (max-width: 980px){
  .enterprise-searchbar{
    width: 100%;
  }
  .enterprise-search-input{
    height: 48px;
    border-radius: 12px 0 0 12px;
  }
  .enterprise-search-btn{
    height: 48px;
    border-radius: 0 12px 12px 0;
  }
}
.enterprise-list{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.enterprise-card{
  position: relative;
  border-radius: var(--radius2);
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  box-shadow: 0 26px 80px rgba(0,0,0,.20);
  padding: 18px;
  overflow:hidden;
  color: var(--ink);
}
.enterprise-card:after{
  content:"";
  position:absolute;
  inset: -1px;
  border-radius: var(--radius2);
  pointer-events:none;
  background: linear-gradient(135deg, rgba(22,224,255,.14), rgba(124,77,255,.12), rgba(44,255,143,.10));
  filter: blur(18px);
  opacity: .16;
  z-index: 0;
}
.enterprise-card-top,
.enterprise-card-meta,
.enterprise-card-actions,
.enterprise-card-recent{position:relative; z-index:1}
.enterprise-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.enterprise-card-title{
  font-size: 18px;
  font-weight: 780;
  letter-spacing: -.2px;
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
  min-width: 0;
}
.enterprise-card-title-link{
  color: var(--ink);
  text-decoration: none;
}
.enterprise-card-title-link:hover{
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
  text-decoration-color: rgba(124,77,255,.45);
}
.enterprise-card-title-link:focus-visible{
  outline: 2px solid rgba(124,77,255,.40);
  outline-offset: 2px;
  border-radius: 8px;
}
.enterprise-card-website-btn{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(124,77,255,.22);
  background: linear-gradient(135deg, rgba(124,77,255,.10), rgba(22,224,255,.08));
  color: var(--ink2);
  font-size: 12px;
  font-weight: 900;
  text-decoration:none;
  user-select:none;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.enterprise-card-website-btn svg{
  width: 14px;
  height: 14px;
  opacity: .9;
}
.enterprise-card-website-btn:hover{
  border-color: rgba(124,77,255,.34);
  background: linear-gradient(135deg, rgba(124,77,255,.14), rgba(22,224,255,.10));
  box-shadow: 0 18px 56px rgba(124,77,255,.08), 0 18px 56px rgba(22,224,255,.06);
  transform: translateY(-1px);
}
.enterprise-card-website-btn:active{
  transform: translateY(0);
}
.enterprise-card-badge{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(11,16,36,.04);
  color: var(--ink2);
  font-size: 12px;
  font-weight: 800;
}
.enterprise-card-meta{
  margin-top: 10px;
  display:flex;
  flex-wrap: wrap;
  gap: 6px;
  color: var(--ink3);
  font-size: 12px;
  line-height: 1.5;
}
.enterprise-card-recent{
  margin-top: 12px;
  display:flex;
  align-items:center;
  gap: 10px;
}
.enterprise-card-recent-label{
  flex: 0 0 auto;
  padding: 6px 8px;
  border-radius: 999px;
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(11,16,36,.04);
  color: var(--ink3);
  font-size: 11px;
  font-weight: 950;
  user-select:none;
}
.enterprise-card-recent-list{
  flex: 1;
  min-width: 0;
  display:flex;
  align-items:center;
  gap: 8px;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.enterprise-card-recent-list::-webkit-scrollbar{display:none}
.enterprise-card-recent-item{
  flex: 0 0 auto;
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(22,224,255,.18);
  background: linear-gradient(135deg, rgba(22,224,255,.10), rgba(124,77,255,.08));
  color: var(--ink2);
  text-decoration:none;
  font-size: 12px;
  font-weight: 850;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.enterprise-card-recent-item:hover{
  border-color: rgba(22,224,255,.28);
  background: linear-gradient(135deg, rgba(22,224,255,.14), rgba(124,77,255,.10));
  box-shadow: 0 18px 56px rgba(22,224,255,.06), 0 18px 56px rgba(124,77,255,.06);
  transform: translateY(-1px);
}
.enterprise-card-recent-item:active{
  transform: translateY(0);
}
.enterprise-card-recent-title{
  max-width: 180px;
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.enterprise-card-recent-date{
  flex: 0 0 auto;
  opacity: .66;
  font-weight: 900;
  font-size: 11px;
}
.enterprise-card-sep{opacity:.55}
.enterprise-card-actions{
  margin-top: 14px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}
.enterprise-card-link{
  padding: 10px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
}
@media (max-width: 980px){
  .enterprise-card-recent-item{
    padding: 7px 9px;
  }
  .enterprise-card-recent-title{
    max-width: 150px;
  }
}
.enterprise-pager{
  margin-top: 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  flex-wrap: wrap;
}
.enterprise-page-indicator{
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(255,255,255,.70);
  color: var(--ink2);
  font-size: 12px;
  font-weight: 900;
}
.enterprise-info{position:relative}
.enterprise-info-grid{margin-top: 12px}
.enterprise-hero-meta{
  margin-top: 16px;
  position: relative;
  z-index: 0;
}
.enterprise-hero-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.enterprise-hero-head h1{
  margin: 0;
}
.enterprise-hero-actions{
  display:flex;
  gap: 10px;
  align-items:center;
  justify-content:flex-end;
  flex-wrap: wrap;
}
.enterprise-hero-dark{
  background: rgba(255,255,255,.86);
  border-bottom: 1px solid var(--paperStroke);
  color: var(--ink);
}
.enterprise-hero-dark .subtitle{
  color: var(--ink2);
}
.enterprise-hero-dark .enterprise-intro{
  font-size: 13px;
  color: var(--ink2);
}
.enterprise-hero-dark .enterprise-intro-wrap{
  padding: 10px 12px;
  border-radius: 16px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(11,16,36,.12);
}
.enterprise-hero-dark .enterprise-intro-wrap:after{
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.92));
}
.enterprise-hero-dark .enterprise-intro-wrap:before{
  background: rgba(255,255,255,.92);
}
.enterprise-hero-dark .meta{
  color: var(--ink3);
}
.enterprise-hero-dark .meta-item{
  border-color: rgba(11,16,36,.12);
  background: rgba(255,255,255,.78);
  color: var(--ink2);
}
.enterprise-hero-dark .pill{
  box-shadow: 0 0 18px rgba(22,224,255,.20);
}
.enterprise-hero-dark .btn:not(.enterprise-search-btn){
  border-color: rgba(11,16,36,.12);
  background: rgba(255,255,255,.70);
  color: var(--ink);
  box-shadow: 0 14px 40px rgba(11,16,36,.10);
}
.enterprise-hero-dark .btn:not(.enterprise-search-btn):hover{
  background: rgba(255,255,255,.82);
  border-color: rgba(22,224,255,.20);
  color: var(--ink);
}
.enterprise-hero-dark .btn-primary:not(.enterprise-search-btn){
  border-color: rgba(22,224,255,.30);
  background: linear-gradient(135deg, rgba(22,224,255,.22), rgba(124,77,255,.20));
  color: rgba(11,16,36,.94);
  box-shadow: 0 18px 56px rgba(22,224,255,.10), 0 18px 56px rgba(124,77,255,.08);
}
.enterprise-hero-dark .btn-primary:not(.enterprise-search-btn):hover{
  border-color: rgba(22,224,255,.36);
}
.enterprise-intro-wrap{
  position: relative;
  margin-top: 10px;
  margin-bottom: 12px;
  z-index: 1;
}
.enterprise-intro{
  max-width: 100%;
}
.enterprise-intro.is-collapsed{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.enterprise-intro-wrap:after{
  content:"";
  position:absolute;
  right:0;
  bottom:0;
  width: clamp(180px, 46%, 420px);
  height: 1.6em;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.92) 55%);
}
.enterprise-intro-wrap:before{
  content:"";
  position:absolute;
  right:0;
  bottom:0;
  width: 82px;
  height: 1.6em;
  pointer-events:none;
  background: rgba(255,255,255,.92);
}
.enterprise-intro-wrap.is-expanded:after{display:none}
.enterprise-intro-wrap.is-expanded:before{display:none}
.enterprise-intro-toggle{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(255,255,255,.74);
  color: var(--ink2);
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
  height: 1.6em;
  white-space: nowrap;
  position: absolute;
  right: 0;
  bottom: 0;
}
.enterprise-intro-toggle:hover{
  background: rgba(255,255,255,.86);
  border-color: rgba(22,224,255,.20);
  color: var(--ink);
}
.enterprise-intro-wrap.is-expanded .enterprise-intro{
  max-height: none;
  display: block;
}
.enterprise-intro-wrap.is-expanded .enterprise-intro-toggle{
  position: static;
  margin-top: 10px;
  height: auto;
  padding: 8px 10px;
}
.enterprise-jobs-split{
  display:grid;
  grid-template-columns: 360px 1fr;
  gap: 14px;
  align-items: start;
}
.enterprise-jobs-left{
  padding: 0;
  overflow:hidden;
}
.enterprise-jobs-left-head{
  padding: 16px 16px 14px;
  border-bottom: 1px solid rgba(11,16,36,.10);
  background: rgba(255,255,255,.55);
}
.enterprise-jobs-filter{
  margin-top: 10px;
  width: 100%;
  height: 38px;
  border-radius: 12px;
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(255,255,255,.78);
  padding: 0 12px;
  color: var(--ink);
  font-size: 13px;
  outline:none;
}
.enterprise-jobs-filter:focus{
  border-color: rgba(22,224,255,.34);
}
.enterprise-jobs-list{
  padding: 8px;
  max-height: 640px;
  overflow:auto;
}
.enterprise-job-row{
  display:block;
  width:100%;
  text-align:left;
  border: 1px solid rgba(11,16,36,.08);
  background: rgba(255,255,255,.52);
  border-radius: 16px;
  padding: 12px 12px;
  cursor:pointer;
  margin-bottom: 10px;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.enterprise-job-row:hover{
  transform: translateY(-1px);
  border-color: rgba(11,16,36,.14);
  background: rgba(255,255,255,.70);
}
.enterprise-job-row.active{
  border-color: rgba(22,224,255,.28);
  background: linear-gradient(135deg, rgba(22,224,255,.12), rgba(124,77,255,.10));
}
.enterprise-job-row-title{
  font-size: 13px;
  font-weight: 850;
  letter-spacing: -.1px;
  color: rgba(11,16,36,.92);
}
.enterprise-job-row-meta{
  margin-top: 8px;
  display:flex;
  gap: 8px;
  flex-wrap: wrap;
  color: var(--ink3);
  font-size: 12px;
}
.enterprise-jobs-right{
  min-height: 520px;
}
.enterprise-job-detail-head{
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(11,16,36,.10);
}
.enterprise-job-detail-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.enterprise-job-detail-title{
  font-size: 20px;
  font-weight: 880;
  letter-spacing: -.3px;
  margin: 0;
  line-height: 1.25;
}
.enterprise-job-detail-meta{
  margin-top: 10px;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--ink3);
  font-size: 12px;
}
.enterprise-job-detail-actions{
  margin-top: 12px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}
.enterprise-job-detail-body{
  margin-top: 16px;
}
.enterprise-job-detail-section{
  margin-top: 16px;
}
.enterprise-job-detail-section-title{
  font-size: 12px;
  font-weight: 900;
  color: var(--ink3);
  letter-spacing: .2px;
  margin-bottom: 10px;
}
.enterprise-job-detail-text{
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(11,16,36,.04);
  border-radius: 16px;
  padding: 14px;
  color: var(--ink2);
  line-height: 1.75;
  font-size: 13px;
  overflow-wrap:anywhere;
}
.enterprise-job-detail-kv{
  display:grid;
  grid-template-columns: 1fr;
  gap: 8px;
}
.enterprise-job-detail-kv .k{
  display:inline-block;
  min-width: 44px;
  color: var(--ink3);
  font-weight: 900;
  font-size: 12px;
}
.enterprise-job-detail-kv .v{
  color: var(--ink2);
  font-size: 13px;
  line-height: 1.6;
}
@media (max-width: 980px){
  .enterprise-jobs-split{grid-template-columns: 1fr}
  .enterprise-jobs-left{overflow: visible}
  .enterprise-jobs-list{max-height: none; overflow: visible}
  .enterprise-jobs-right{display:none}
}
.demo-grid{
  display:grid;
  grid-template-columns: .9fr .1fr 1fr;
  gap: 14px;
  align-items: start;
}
.mock-form{
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(255,255,255,.62);
  border-radius: var(--radius);
  padding: 14px;
}
.field{display:flex; flex-direction:column; gap:8px; margin-bottom: 12px}
.label{font-size: 12px; color: var(--ink3)}
.input{
  height: 40px;
  border-radius: 12px;
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(255,255,255,.78);
  color: var(--ink);
  display:flex; align-items:center;
  padding: 0 12px;
  font-size: 13px;
  overflow:hidden;
  min-width: 0;
}
.demo-grid > *{min-width:0}
.input span{
  display:block;
  min-width: 0;
  overflow:hidden;
  text-overflow: ellipsis;
  white-space:nowrap;
}
.input span{opacity:.9}
.hint{color: var(--ink3); font-size: 12px; line-height: 1.55}
.arrow{display:flex; align-items:center; justify-content:center; height: 100%; min-height: 220px; position: relative}
.arrow:before{
  content:"";
  width: 44px; height: 44px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(135deg, rgba(22,224,255,.14), rgba(124,77,255,.14));
  box-shadow: 0 18px 44px rgba(0,0,0,.25);
}
.arrow svg{position:absolute}
.out{
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(255,255,255,.62);
  border-radius: var(--radius);
  padding: 14px;
}
.tabs{display:flex; gap:8px; margin-bottom: 10px; flex-wrap:wrap}
.tab{
  font-size: 12px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(255,255,255,.70);
  color: var(--ink2);
  user-select:none;
}
.tab.active{
  border-color: rgba(22,224,255,.26);
  background: linear-gradient(135deg, rgba(22,224,255,.16), rgba(124,77,255,.14));
  color: rgba(11,16,36,.92);
}
.table{border-radius: 14px; overflow:hidden; border: 1px solid rgba(11,16,36,.10)}
.row{
  display:grid;
  grid-template-columns: 1.1fr 1.1fr .8fr;
  gap: 0;
  background: rgba(255,255,255,.62);
}
.row.header{
  background: rgba(255,255,255,.86);
  color: var(--ink2);
  font-size: 12px;
  font-weight:650;
}
.cell{
  padding: 10px 10px;
  border-right: 1px solid rgba(11,16,36,.08);
  border-bottom: 1px solid rgba(11,16,36,.08);
  font-size: 12px;
  color: var(--ink2);
  overflow:hidden;
  white-space:nowrap;
  text-overflow: ellipsis;
}
.row .cell:last-child{border-right:none}
.glow{position: relative}
.glow:after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius: var(--radius2);
  pointer-events:none;
  background: linear-gradient(135deg, rgba(22,224,255,.18), rgba(124,77,255,.18), rgba(44,255,143,.12));
  filter: blur(18px);
  opacity: .55;
  z-index:-1;
}
section{padding: 20px 0}
.section-title{
  font-size: 12px;
  color: var(--ink3);
  letter-spacing: .5px;
  text-transform: uppercase;
}
.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 18px;
  margin-bottom: 22px;
}
h2{
  margin: 10px 0 0;
  font-size: 22px;
  font-weight: 650;
  letter-spacing: -.25px;
}
.lead{
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
  max-width: 70ch;
}
.grid3{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.tile{
  border-radius: var(--radius2);
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  padding: 18px;
  min-height: 148px;
  color: var(--ink);
}
.icon{
  width: 40px; height: 40px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(135deg, rgba(22,224,255,.14), rgba(124,77,255,.14));
  display:flex; align-items:center; justify-content:center;
  margin-bottom: 12px;
}
.icon svg{opacity:.95}
.tile h3{margin: 6px 0 8px; font-size: 14px}
.tile p{margin:0; color: var(--ink2); line-height: 1.6; font-size: 13px}
.two{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 14px;
  align-items: stretch;
}
.steps{display:grid; gap: 10px}
.step{
  display:flex;
  gap: 12px;
  align-items:flex-start;
  padding: 16px;
  border-radius: var(--radius2);
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  color: var(--ink);
}
.num{
  width: 36px; height: 36px;
  border-radius: 14px;
  border: 1px solid rgba(11,16,36,.14);
  background: rgba(255,255,255,.68);
  display:flex; align-items:center; justify-content:center;
  font-weight:700;
  color: var(--ink2);
}
.step b{display:block; margin-bottom: 6px}
.step span{display:block; color: var(--ink2); line-height: 1.6; font-size: 14px}
.panel{
  border-radius: var(--radius2);
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  padding: 18px;
  color: var(--ink);
}
.callout{
  display:flex; align-items:flex-start; gap: 12px;
  padding: 16px;
  border-radius: var(--radius2);
  border: 1px solid rgba(22,224,255,.18);
  background: linear-gradient(135deg, rgba(22,224,255,.10), rgba(124,77,255,.08));
}
.callout strong{display:block; margin-bottom:6px}
.callout p{margin:0; color: var(--ink2); line-height: 1.7; font-size: 14px}
.panel .section-title{color: var(--ink3)}
.prompt-example-box{
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(11,16,36,.06);
  border-radius: 18px;
  padding: 14px;
  color: var(--ink);
  line-height: 1.75;
  font-size: 13px;
}
.prompt-example-box code{
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(11,16,36,.10);
  border-radius: 10px;
  padding: 2px 6px;
  color: var(--ink);
}
.pricing{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.plan{
  border-radius: var(--radius2);
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  padding: 18px;
  display:flex;
  flex-direction:column;
  min-height: 270px;
  color: var(--ink);
}
.plan.highlight{
  border-color: rgba(22,224,255,.28);
  background:
    linear-gradient(135deg, rgba(22,224,255,.14), rgba(124,77,255,.12)),
    linear-gradient(180deg, var(--paper), var(--paper2));
}
.plan .name{font-weight:750}
.plan .price{margin-top: 10px; font-size: 26px; letter-spacing: -.4px}
.plan .desc{color: var(--ink2); margin: 10px 0 14px; line-height: 1.65; font-size: 14px}
.plan ul{margin:0; padding:0 0 0 16px; color: var(--ink2); line-height: 1.7; font-size: 14px}
.plan .foot{margin-top:auto; padding-top: 16px}
.footer{
  padding: 34px 0 44px;
  border-top: 1px solid var(--paperStroke);
  background: rgba(255,255,255,.60);
}
.footer-inner{
  display:flex;
  gap: 18px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  color: var(--ink3);
  font-size: 13px;
}
.links{display:flex; gap:14px; flex-wrap:wrap}
.links a{opacity:.86}
.links a:hover{opacity:1}
.divider{
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(11,16,36,.12), transparent);
  margin: 42px 0 0;
}

.legal-main{
  background: rgba(255,255,255,.62);
  border-top: 1px solid rgba(11,16,36,.06);
  border-bottom: 1px solid rgba(11,16,36,.06);
}

.usecases-section{
  position: relative;
  padding: 96px 0;
  min-height: auto;
  background: rgba(255,255,255,.62);
  border-top: 1px solid rgba(11,16,36,.06);
  border-bottom: 1px solid rgba(11,16,36,.06);
}
.usecases-section:before{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;
  background:
    radial-gradient(900px 520px at 20% 45%, rgba(22,224,255,.10), transparent 60%),
    radial-gradient(760px 520px at 85% 20%, rgba(124,77,255,.10), transparent 58%),
    radial-gradient(820px 560px at 78% 88%, rgba(44,255,143,.08), transparent 60%);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center;
  opacity: .95;
}
.usecases-section > .wrap{position:relative}
.usecases-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  align-items: stretch;
}
.usecase-card{
  position: relative;
  border-radius: var(--radius2);
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  box-shadow: 0 26px 80px rgba(0,0,0,.24);
  padding: 22px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  color: var(--ink);
}
.usecase-card:after{
  content:"";
  position:absolute;
  inset: -1px;
  border-radius: var(--radius2);
  pointer-events:none;
  background: linear-gradient(135deg, rgba(22,224,255,.18), rgba(124,77,255,.18), rgba(44,255,143,.12));
  filter: blur(18px);
  opacity: .18;
  z-index: 0;
}
.usecase-top,
.usecase-title,
.usecase-desc,
.usecase-flow,
.usecase-case{position:relative; z-index:1}
.usecase-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.usecase-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius: 999px;
  border:1px solid rgba(11,16,36,.12);
  background: rgba(255,255,255,.74);
  color: var(--ink2);
  font-size: 13px;
  font-weight: 650;
}
.usecase-badge{
  font-size: 12px;
  color: var(--ink3);
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(11,16,36,.06);
  padding: 8px 10px;
  border-radius: 14px;
  white-space: normal;
  max-width: 100%;
  overflow-wrap: anywhere;
  line-height: 1.35;
}
.usecase-title{
  margin: 6px 0 8px;
  font-size: 18px;
  font-weight: 750;
  letter-spacing: -.3px;
}
.usecase-desc{
  margin: 0;
  color: var(--ink2);
  line-height: 1.7;
  font-size: 14px;
}
.usecase-flow{
  margin-top: 14px;
  display:flex;
  gap: 8px;
  flex-wrap:wrap;
}
.usecase-flow span{
  font-size: 12px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(11,16,36,.04);
  color: var(--ink2);
}
.usecase-case{
  margin-top: 16px;
  border-top: 1px solid rgba(11,16,36,.10);
  padding-top: 14px;
}
.usecase-case-title{
  font-size: 12px;
  color: var(--ink3);
  letter-spacing: .6px;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.usecase-case ul{
  margin:0;
  padding:0 0 0 16px;
  color: var(--ink2);
  line-height: 1.75;
  font-size: 13px;
}
.usecase-card[data-variant="create"]{
  border-color: rgba(22,224,255,.22);
}
.usecase-card[data-variant="decide"]{
  border-color: rgba(124,77,255,.22);
}
.usecase-card[data-variant="build"]{
  border-color: rgba(44,255,143,.20);
}

#compliance{
  position: relative;
  padding: 96px 0 108px;
  background: rgba(255,255,255,.62);
  border-top: 1px solid rgba(11,16,36,.06);
  border-bottom: 1px solid rgba(11,16,36,.06);
}
#compliance:before{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;
  background:
    radial-gradient(880px 540px at 18% 30%, rgba(124,77,255,.10), transparent 60%),
    radial-gradient(920px 560px at 78% 55%, rgba(22,224,255,.10), transparent 62%),
    radial-gradient(720px 520px at 55% 95%, rgba(44,255,143,.07), transparent 60%);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center;
  opacity: .9;
}
#compliance > .wrap{position: relative}
#compliance .section-head{margin-bottom: 28px}
#compliance .grid3{gap: 18px}
#compliance .tile{
  padding: 22px;
  min-height: 176px;
  background: linear-gradient(180deg, var(--paper), var(--paper2));
}

.doc-wrap{max-width:880px;margin:0 auto;padding:32px 20px 60px}
.doc-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.muted{color:var(--ink3);font-size:13px}
.doc-card{border:1px solid var(--paperStroke);background:linear-gradient(180deg, var(--paper), var(--paper2));border-radius:18px;padding:18px;color:var(--ink)}
.doc-card h1{margin:0 0 12px;font-size:22px}
.doc-card .muted{color:var(--ink3)}
.doc-card p,.doc-card li,.doc-card code{line-height:1.7;color:var(--ink2)}
.doc-card pre{margin:12px 0 0;padding:12px;border-radius:14px;background:rgba(11,16,36,.06);border:1px solid rgba(11,16,36,.10);overflow:auto;color:var(--ink)}

.blog-hero{padding: 40px 0 22px}
.blog-hero .hero-content{
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  border-radius: var(--radius2);
  padding: 22px;
  color: var(--ink);
}
.blog-hero h1{margin:0 0 6px; font-size: 26px; line-height: 1.16; letter-spacing: -.45px}
.blog-hero p{margin:0; color: var(--ink2); line-height: 1.55}

.blog-hero-featured .hero-content{padding: 18px}
.hero-featured-head{display:flex; align-items:flex-end; justify-content:space-between; gap: 12px; margin-bottom: 14px}
.hero-featured-grid{display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px}
.hero-featured-card{
  display:flex;
  flex-direction:column;
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(255,255,255,.70);
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
  color: var(--ink);
  min-width: 0;
}
.hero-featured-card:hover{transform: translateY(-2px); border-color: rgba(22,224,255,.26); background: rgba(255,255,255,.82)}
.hero-featured-media{height: 132px; position: relative; overflow:hidden}
.hero-featured-media-image img{width:100%; height:100%; object-fit:cover; display:block}
.hero-featured-media-color{
  display:flex;
  align-items:center;
  justify-content:center;
  color: rgba(255,255,255,.92);
  font-weight: 800;
  letter-spacing: .6px;
  font-size: 32px;
}
.hero-featured-media-color.v1{background: linear-gradient(135deg, rgba(22,224,255,.92), rgba(124,77,255,.88))}
.hero-featured-media-color.v2{background: linear-gradient(135deg, rgba(44,255,143,.90), rgba(22,224,255,.84))}
.hero-featured-media-color.v3{background: linear-gradient(135deg, rgba(124,77,255,.90), rgba(255,77,109,.78))}
.hero-featured-media-color.v4{background: linear-gradient(135deg, rgba(255,77,109,.86), rgba(22,224,255,.78))}
.hero-featured-media-color.v5{background: linear-gradient(135deg, rgba(22,224,255,.86), rgba(44,255,143,.78))}
.hero-featured-letter{filter: drop-shadow(0 10px 20px rgba(0,0,0,.22))}
.hero-featured-body{padding: 12px 14px 14px; min-width: 0}
.hero-featured-meta{display:flex; gap: 8px; align-items:center; color: var(--ink3); font-size: 12px; line-height: 1.35}
.hero-featured-title{
  margin-top: 8px;
  font-size: 16px;
  line-height: 1.25;
  letter-spacing: -.25px;
  font-weight: 750;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.hero-featured-excerpt{
  margin-top: 8px;
  color: var(--ink2);
  font-size: 13px;
  line-height: 1.55;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.blog-header{margin: 18px 0 16px}
.blog-header .page-title{margin:0 0 8px; font-size: 22px; letter-spacing: -.25px; color: var(--text)}
.blog-header .page-description,
.blog-header .search-info{margin:0; color: var(--muted); line-height: 1.55}

.blog-posts{display:grid; gap: 14px}
.blog-post-card{
  display:flex;
  gap: 16px;
  border-radius: var(--radius2);
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  overflow:hidden;
  color: var(--ink);
}
.blog-post-card .post-image{flex: 0 0 220px; width: 220px; background: rgba(11,16,36,.04)}
.blog-post-card .post-image img{width:100%; height:100%; object-fit:cover; display:block}
.blog-post-card .post-content{padding: 18px; flex: 1 1 auto; min-width: 0}
.blog-post-card .post-meta{display:flex; flex-wrap:wrap; gap: 10px; color: var(--ink3); font-size: 12px}
.blog-post-card .post-meta a{opacity:.9}
.blog-post-card .post-title{margin: 8px 0 8px; font-size: 18px; letter-spacing: -.25px}
.blog-post-card .post-title a{color: var(--ink)}
.blog-post-card .post-excerpt{color: var(--ink2); line-height: 1.6; font-size: 14px}
.post-tags{display:flex; gap: 8px; flex-wrap:wrap; margin-top: 12px}
.tag-item{
  font-size: 12px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(11,16,36,.04);
  color: var(--ink2);
}
.read-more{display:inline-flex; gap: 8px; align-items:center; margin-top: 12px; color: var(--ink2); font-weight: 650}
.read-more:hover{color: var(--ink)}

.pagination{display:flex; gap: 10px; flex-wrap:wrap; margin-top: 18px}
.pagination a,
.pagination .current{
  font-size: 13px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(255,255,255,.72);
  color: var(--ink2);
}
.pagination .current{border-color: rgba(22,224,255,.28); background: linear-gradient(135deg, rgba(22,224,255,.18), rgba(124,77,255,.18))}

.empty-state{
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  border-radius: var(--radius2);
  padding: 22px;
  color: var(--ink);
}
.empty-state p{color: var(--ink2); line-height: 1.6}

.blog-post-detail{
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  border-radius: var(--radius2);
  padding: 22px;
  color: var(--ink);
}
.blog-post-detail .post-title{margin:0 0 12px; font-size: 26px; line-height: 1.2; letter-spacing: -.45px}
.blog-post-detail .post-meta{display:flex; flex-wrap:wrap; gap: 12px; color: var(--ink3); font-size: 12px}
.blog-post-detail .post-meta a{opacity:.9}
.blog-post-detail .post-image{margin-top: 16px; border-radius: var(--radius); overflow:hidden; border: 1px solid rgba(11,16,36,.10)}
.blog-post-detail .post-image img{width:100%; height:auto; display:block}
.blog-post-detail .post-body{margin-top: 18px}
.blog-post-detail .post-body p,
.blog-post-detail .post-body li{color: var(--ink2); line-height: 1.7}
.blog-post-detail .post-body h2,
.blog-post-detail .post-body h3{color: var(--ink); margin: 18px 0 10px}
.blog-post-detail .post-body a{color: rgba(22,224,255,.92)}
.blog-post-detail .post-body code{background: rgba(11,16,36,.06); border: 1px solid rgba(11,16,36,.10); border-radius: 10px; padding: 2px 6px; color: var(--ink)}
.blog-post-detail .post-body pre{background: rgba(11,16,36,.06); border: 1px solid rgba(11,16,36,.10); border-radius: 14px; padding: 12px; overflow:auto}
.blog-post-detail .post-body pre code{border:none; background: transparent; padding:0}

.comments-section{
  margin-top: 18px;
  border: 1px solid var(--paperStroke);
  background: linear-gradient(180deg, var(--paper), var(--paper2));
  border-radius: var(--radius2);
  padding: 18px;
  color: var(--ink);
}
.comments-section .section-title{color: var(--ink3)}
.comment-form-wrapper{margin-top: 12px}
.comment-user-info{display:flex; gap: 12px; align-items:center; margin-bottom: 12px}
.user-avatar,
.comment-avatar{
  width: 38px; height: 38px;
  border-radius: 14px;
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(11,16,36,.06);
  display:flex; align-items:center; justify-content:center;
  font-weight: 750;
  color: var(--ink2);
}
.form-control{
  width: 100%;
  border-radius: 14px;
  border: 1px solid rgba(11,16,36,.12);
  background: rgba(255,255,255,.82);
  padding: 12px 14px;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.6;
}
.form-control:focus{outline:none; border-color: rgba(22,224,255,.36); box-shadow: 0 0 0 4px rgba(22,224,255,.12)}

.comments-list{display:grid; gap: 12px; margin-top: 14px}
.comment-item{display:flex; gap: 12px; align-items:flex-start}
.comment-content{flex:1 1 auto; min-width: 0}
.comment-header{display:flex; gap: 10px; align-items:baseline; flex-wrap:wrap}
.comment-author{font-weight: 750; color: var(--ink)}
.comment-date{color: var(--ink3); font-size: 12px}
.comment-text{color: var(--ink2); line-height: 1.7; margin-top: 6px}

.login-prompt{
  margin-top: 12px;
  border: 1px solid rgba(11,16,36,.10);
  background: rgba(11,16,36,.04);
  border-radius: var(--radius2);
  padding: 16px;
  color: var(--ink);
}
.login-prompt p{margin: 8px 0 0; color: var(--ink2)}
.login-btn{display:inline-flex; align-items:center; justify-content:center; margin-top: 12px; padding: 12px 16px; border-radius: 14px; border: 1px solid rgba(11,16,36,.12); background: rgba(255,255,255,.82); color: var(--ink); font-weight: 650}
.login-btn:hover{border-color: rgba(22,224,255,.36)}

@media (max-width: 980px){
  .blog-post-card{flex-direction:column}
  .blog-post-card .post-image{width:100%; flex: 0 0 auto}
}

@media (max-width: 980px){
  .hero-featured-grid{grid-template-columns: 1fr}
  .hero-featured-media{height: 150px}
}

@media (max-width: 980px){
  .hero-grid{grid-template-columns: 1fr}
  .demo-grid{grid-template-columns: 1fr; gap: 12px}
  .arrow{min-height: 52px}
  .arrow:before{width: 52px; height: 52px}
  .grid3{grid-template-columns: 1fr}
  .two{grid-template-columns: 1fr}
  .pricing{grid-template-columns: 1fr}
  .usecases-section{min-height: auto; padding: 60px 0}
  .usecases-grid{grid-template-columns: 1fr}
  .usecase-badge{white-space: normal}
  #compliance{padding: 72px 0 84px}
}