/* 千面浏览器主题 — Reset + Tailwind utility classes */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;line-height:1.6;-webkit-text-size-adjust:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;background:#06101d;color:#edf5ff;min-height:100vh}
a{color:inherit;text-decoration:none}
img,svg,video{max-width:100%;height:auto;display:block}
button,input,textarea,select{font:inherit;color:inherit}

/* CSS variables */
:root{
  --bg:#06101d;--panel:#0d1a2c;--border:#1d3453;
  --text:#edf5ff;--muted:#8fa6c2;
  --brand:#11d7bd;--brand2:#10b7e6;
}

/* Layout */
.bg-bg{background:var(--bg)}
.bg-panel{background:var(--panel)}
.bg-panel\/30{background:rgba(13,26,44,0.3)}
.bg-panel\/50{background:rgba(13,26,44,0.5)}
.bg-bg\/90{background:rgba(6,16,29,0.9)}
.text-text{color:var(--text)}
.text-muted{color:var(--muted)}
.text-brand{color:var(--brand)}
.text-bg{color:var(--bg)}
.border-border{border-color:var(--border)}
.border-brand{border-color:var(--brand)}
.border-brand\/30{border-color:rgba(17,215,189,0.3)}
.bg-brand\/10{background:rgba(17,215,189,0.1)}
.bg-brand\/20{background:rgba(17,215,189,0.2)}
.bg-brand\/5{background:rgba(17,215,189,0.05)}
.bg-brand2\/5{background:rgba(16,183,230,0.05)}
.bg-brand\/10{background:rgba(17,215,189,0.1)}
.bg-brand2\/10{background:rgba(16,183,230,0.1)}

/* Typography */
.font-sans{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
.font-bold{font-weight:700}
.font-medium{font-weight:500}
.text-xs{font-size:.75rem}
.text-sm{font-size:.875rem}
.text-base{font-size:1rem}
.text-lg{font-size:1.125rem}
.text-xl{font-size:1.25rem}
.text-2xl{font-size:1.5rem}
.text-3xl{font-size:1.875rem;line-height:1.2}
.text-4xl{font-size:2.25rem;line-height:1.2}
.text-5xl{font-size:3rem;line-height:1.1}
.text-6xl{font-size:3.75rem;line-height:1.1}
.uppercase{text-transform:uppercase}
.tracking-wider{letter-spacing:0.05em}
.leading-tight{line-height:1.25}
.leading-relaxed{line-height:1.625}
.text-center{text-align:center}
.antialiased{-webkit-font-smoothing:antialiased}

/* Spacing */
.p-2{padding:.5rem}
.p-4{padding:1rem}
.p-6{padding:1.5rem}
.p-8{padding:2rem}
.p-12{padding:3rem}
.px-3{padding-left:.75rem;padding-right:.75rem}
.px-4{padding-left:1rem;padding-right:1rem}
.px-5{padding-left:1.25rem;padding-right:1.25rem}
.px-6{padding-left:1.5rem;padding-right:1.5rem}
.px-8{padding-left:2rem;padding-right:2rem}
.py-1{padding-top:.25rem;padding-bottom:.25rem}
.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}
.py-2{padding-top:.5rem;padding-bottom:.5rem}
.py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-4{padding-top:1rem;padding-bottom:1rem}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.py-12{padding-top:3rem;padding-bottom:3rem}
.py-16{padding-top:4rem;padding-bottom:4rem}
.py-20{padding-top:5rem;padding-bottom:5rem}
.py-24{padding-top:6rem;padding-bottom:6rem}
.pt-8{padding-top:2rem}
.pt-20{padding-top:5rem}
.pb-8{padding-bottom:2rem}
.pb-2{padding-bottom:.5rem}
.pb-24{padding-bottom:6rem}
.mb-2{margin-bottom:.5rem}
.mb-3{margin-bottom:.75rem}
.mb-4{margin-bottom:1rem}
.mb-6{margin-bottom:1.5rem}
.mb-8{margin-bottom:2rem}
.mb-10{margin-bottom:2.5rem}
.mb-12{margin-bottom:3rem}
.mb-16{margin-bottom:4rem}
.mt-4{margin-top:1rem}
.mt-6{margin-top:1.5rem}
.mt-8{margin-top:2rem}
.mt-12{margin-top:3rem}
.mt-24{margin-top:6rem}
.mx-auto{margin-left:auto;margin-right:auto}
.mx-2{margin-left:.5rem;margin-right:.5rem}

/* Sizing */
.w-8{width:2rem}
.w-9{width:2.25rem}
.w-12{width:3rem}
.h-8{height:2rem}
.h-9{height:2.25rem}
.h-12{height:3rem}
.h-16{height:4rem}
.min-h-screen{min-height:100vh}
.max-w-2xl{max-width:42rem}
.max-w-3xl{max-width:48rem}
.max-w-4xl{max-width:56rem}
.max-w-5xl{max-width:64rem}
.max-w-7xl{max-width:80rem}

/* Flex / Grid */
.flex{display:flex}
.inline-flex{display:inline-flex}
.inline-block{display:inline-block}
.grid{display:grid}
.hidden{display:none}
.items-center{align-items:center}
.items-end{align-items:flex-end}
.justify-center{justify-content:center}
.justify-between{justify-content:space-between}
.flex-wrap{flex-wrap:wrap}
.flex-col{flex-direction:column}
.flex-1{flex:1 1 0%}
.gap-2{gap:.5rem}
.gap-3{gap:.75rem}
.gap-4{gap:1rem}
.gap-6{gap:1.5rem}
.gap-8{gap:2rem}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.space-y-2>*+*{margin-top:.5rem}

/* Border / Radius */
.border{border-width:1px;border-style:solid}
.border-b{border-bottom-width:1px;border-bottom-style:solid}
.border-t{border-top-width:1px;border-top-style:solid}
.border-l-brand{border-left:4px solid var(--brand)}
.rounded-lg{border-radius:.5rem}
.rounded-xl{border-radius:.75rem}
.rounded-2xl{border-radius:1rem}
.rounded-full{border-radius:9999px}

/* Position */
.relative{position:relative}
.absolute{position:absolute}
.sticky{position:sticky}
.top-0{top:0}
.inset-0{top:0;right:0;bottom:0;left:0}
.z-50{z-index:50}
.overflow-hidden{overflow:hidden}

/* Effects */
.opacity-90{opacity:.9}
.shadow-2xl{box-shadow:0 25px 50px -12px rgba(0,0,0,.5)}
.shadow-brand\/10{box-shadow:0 25px 50px -12px rgba(17,215,189,.1)}
.backdrop-blur{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.transition{transition:all .15s ease}

/* Gradients */
.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}
.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}
.from-brand{--tw-gradient-from:var(--brand);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(17,215,189,0))}
.from-brand\/5{--tw-gradient-from:rgba(17,215,189,.05);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(17,215,189,0))}
.from-brand\/10{--tw-gradient-from:rgba(17,215,189,.1);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(17,215,189,0))}
.from-panel{--tw-gradient-from:var(--panel);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to,rgba(13,26,44,0))}
.via-transparent{--tw-gradient-stops:var(--tw-gradient-from),transparent,var(--tw-gradient-to)}
.via-bg{--tw-gradient-stops:var(--tw-gradient-from),var(--bg),var(--tw-gradient-to)}
.to-brand2{--tw-gradient-to:var(--brand2)}
.to-brand2\/5{--tw-gradient-to:rgba(16,183,230,.05)}
.to-brand2\/10{--tw-gradient-to:rgba(16,183,230,.1)}
.to-panel{--tw-gradient-to:var(--panel)}
.bg-clip-text{-webkit-background-clip:text;background-clip:text}
.text-transparent{color:transparent}

/* aspect ratio */
.aspect-\[16\/9\]{aspect-ratio:16/9}

/* Hover states */
.group:hover .group-hover\:text-brand{color:var(--brand)}
.group:hover .group-hover\:bg-brand\/20{background:rgba(17,215,189,.2)}
.hover\:text-brand:hover{color:var(--brand)}
.hover\:border-brand:hover{border-color:var(--brand)}
.hover\:opacity-90:hover{opacity:.9}
.hover\:underline:hover{text-decoration:underline}

/* Line clamp */
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* Prose for article content */
.prose{color:var(--text);line-height:1.75;font-size:1.0625rem}
.prose h1{font-size:2rem;font-weight:700;margin:2em 0 .8em;color:var(--text)}
.prose h2{font-size:1.625rem;font-weight:700;margin:2em 0 .8em;padding-bottom:.4em;border-bottom:1px solid var(--border);color:var(--text)}
.prose h3{font-size:1.25rem;font-weight:700;margin:1.5em 0 .6em;color:var(--text)}
.prose h4{font-size:1.1rem;font-weight:700;margin:1.25em 0 .5em;color:var(--text)}
.prose p{margin:1em 0}
.prose a{color:var(--brand);text-decoration:none}
.prose a:hover{text-decoration:underline}
.prose strong{color:var(--text);font-weight:700}
.prose code{color:var(--brand);background:var(--panel);padding:.15em .4em;border-radius:.25em;font-size:.9em;font-family:Consolas,Monaco,monospace}
.prose pre{background:var(--panel);border:1px solid var(--border);border-radius:.5em;padding:1em;overflow-x:auto;margin:1.5em 0}
.prose pre code{background:transparent;padding:0;color:inherit}
.prose blockquote{border-left:4px solid var(--brand);background:rgba(17,215,189,0.05);padding:.6em 1em;margin:1.5em 0;color:var(--muted)}
.prose ul,.prose ol{margin:1em 0;padding-left:1.5em}
.prose ul{list-style:disc}
.prose ol{list-style:decimal}
.prose li{margin:.4em 0}
.prose img{margin:1.5em 0;border-radius:.75em;border:1px solid var(--border)}
.prose hr{border:0;border-top:1px solid var(--border);margin:2em 0}
.prose table{width:100%;border-collapse:collapse;margin:1.5em 0}
.prose th,.prose td{padding:.6em 1em;border:1px solid var(--border);text-align:left}
.prose th{background:var(--panel);font-weight:700}
.prose-lg{font-size:1.125rem;line-height:1.8}

/* Responsive */
@media (min-width:768px){
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .md\:flex{display:flex}
  .md\:text-2xl{font-size:1.5rem}
  .md\:text-4xl{font-size:2.25rem}
  .md\:text-5xl{font-size:3rem}
  .md\:text-6xl{font-size:3.75rem}
}
@media (min-width:1024px){
  .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* Radial gradient for hero */
.bg-\[radial-gradient\(circle_at_30\%_30\%\,rgba\(17\,215\,189\,0\.15\)\,transparent_50\%\)\]{
  background-image:radial-gradient(circle at 30% 30%,rgba(17,215,189,.15),transparent 50%);
}