/* ============================================================================
   Supreme 主题样式主文件（唯一前端样式表）
   ----------------------------------------------------------------------------
   第 1 部分：原子工具类 / 基础重置（原 tailwind.css 按需迁移产物，已剔除死代码）
   第 2 部分：主题自定义样式（组件、布局、暗色、短代码等）
   两部分保持原加载顺序（工具类在前、主题样式在后），级联覆盖关系不变。
   ============================================================================ */
::backdrop {
--tw-border-spacing-x:0;
--tw-border-spacing-y:0;
--tw-translate-x:0;
--tw-translate-y:0;
--tw-rotate:0;
--tw-skew-x:0;
--tw-skew-y:0;
--tw-scale-x:1;
--tw-scale-y:1;
--tw-pan-x:;
--tw-pan-y:;
--tw-pinch-zoom:;
--tw-scroll-snap-strictness:proximity;
--tw-gradient-from-position:;
--tw-gradient-via-position:;
--tw-gradient-to-position:;
--tw-ordinal:;
--tw-slashed-zero:;
--tw-numeric-figure:;
--tw-numeric-spacing:;
--tw-numeric-fraction:;
--tw-ring-inset:;
--tw-ring-offset-width:0px;
--tw-ring-offset-color:#fff;
--tw-ring-color:rgba(59,130,246,.5);
--tw-ring-offset-shadow:0 0 #0000;
--tw-ring-shadow:0 0 #0000;
--tw-shadow:0 0 #0000;
--tw-shadow-colored:0 0 #0000;
--tw-blur:;
--tw-brightness:;
--tw-contrast:;
--tw-grayscale:;
--tw-hue-rotate:;
--tw-invert:;
--tw-saturate:;
--tw-sepia:;
--tw-drop-shadow:;
--tw-backdrop-blur:;
--tw-backdrop-brightness:;
--tw-backdrop-contrast:;
--tw-backdrop-grayscale:;
--tw-backdrop-hue-rotate:;
--tw-backdrop-invert:;
--tw-backdrop-opacity:;
--tw-backdrop-saturate:;
--tw-backdrop-sepia:;
--tw-contain-size:;
--tw-contain-layout:;
--tw-contain-paint:;
--tw-contain-style:;
}
/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/
*,:after,:before {
--tw-border-spacing-x:0;
--tw-border-spacing-y:0;
--tw-translate-x:0;
--tw-translate-y:0;
--tw-rotate:0;
--tw-skew-x:0;
--tw-skew-y:0;
--tw-scale-x:1;
--tw-scale-y:1;
--tw-pan-x:;
--tw-pan-y:;
--tw-pinch-zoom:;
--tw-scroll-snap-strictness:proximity;
--tw-gradient-from-position:;
--tw-gradient-via-position:;
--tw-gradient-to-position:;
--tw-ordinal:;
--tw-slashed-zero:;
--tw-numeric-figure:;
--tw-numeric-spacing:;
--tw-numeric-fraction:;
--tw-ring-inset:;
--tw-ring-offset-width:0px;
--tw-ring-offset-color:#fff;
--tw-ring-color:rgba(59,130,246,.5);
--tw-ring-offset-shadow:0 0 #0000;
--tw-ring-shadow:0 0 #0000;
--tw-shadow:0 0 #0000;
--tw-shadow-colored:0 0 #0000;
--tw-blur:;
--tw-brightness:;
--tw-contrast:;
--tw-grayscale:;
--tw-hue-rotate:;
--tw-invert:;
--tw-saturate:;
--tw-sepia:;
--tw-drop-shadow:;
--tw-backdrop-blur:;
--tw-backdrop-brightness:;
--tw-backdrop-contrast:;
--tw-backdrop-grayscale:;
--tw-backdrop-hue-rotate:;
--tw-backdrop-invert:;
--tw-backdrop-opacity:;
--tw-backdrop-saturate:;
--tw-backdrop-sepia:;
--tw-contain-size:;
--tw-contain-layout:;
--tw-contain-paint:;
--tw-contain-style:;
border:0 solid #e5e7eb;
box-sizing:border-box;
}
:after,:before {
--tw-content:"";
}
:host,html {
line-height:1.5;
-webkit-text-size-adjust:100%;
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
font-feature-settings:normal;
font-variation-settings:normal;
-moz-tab-size:4;
-o-tab-size:4;
tab-size:4;
-webkit-tap-highlight-color:transparent;
}
hr {
border-top-width:1px;
color:inherit;
height:0;
}
abbr:where([title]) {
-webkit-text-decoration:underline dotted;
text-decoration:underline dotted;
}
h1,h2,h3,h4,h5,h6 {
font-size:inherit;
font-weight:inherit;
}
a {
color:inherit;
text-decoration:inherit;
}
b,strong {
font-weight:bolder;
}
code,kbd,pre,samp {
font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;
font-feature-settings:normal;
font-size:1em;
font-variation-settings:normal;
}
small {
font-size:80%;
}
sub,sup {
font-size:75%;
line-height:0;
position:relative;
vertical-align:baseline;
}
sub {
bottom:-.25em;
}
sup {
top:-.5em;
}
table {
border-collapse:collapse;
border-color:inherit;
text-indent:0;
}
button,input,optgroup,select,textarea {
color:inherit;
font-family:inherit;
font-feature-settings:inherit;
font-size:100%;
font-variation-settings:inherit;
font-weight:inherit;
letter-spacing:inherit;
line-height:inherit;
margin:0;
padding:0;
}
button,select {
text-transform:none;
}
button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]) {
-webkit-appearance:button;
background-color:transparent;
background-image:none;
}
:-moz-focusring {
outline:auto;
}
:-moz-ui-invalid {
box-shadow:none;
}
progress {
vertical-align:baseline;
}
::-webkit-inner-spin-button,::-webkit-outer-spin-button {
height:auto;
}
[type=search] {
-webkit-appearance:textfield;
outline-offset:-2px;
}
::-webkit-search-decoration {
-webkit-appearance:none;
}
::-webkit-file-upload-button {
-webkit-appearance:button;
font:inherit;
}
summary {
display:list-item;
}
blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre {
margin:0;
}
fieldset {
margin:0;
}
fieldset,legend {
padding:0;
}
menu,ol,ul {
list-style:none;
margin:0;
padding:0;
}
dialog {
padding:0;
}
textarea {
resize:vertical;
}
input::-moz-placeholder,textarea::-moz-placeholder {
color:#9ca3af;
opacity:1;
}
input::placeholder,textarea::placeholder {
color:#9ca3af;
opacity:1;
}
[role=button],button {
cursor:pointer;
}
:disabled {
cursor:default;
}
audio,canvas,embed,iframe,img,object,svg,video {
display:block;
vertical-align:middle;
}
img,video {
height:auto;
max-width:100%;
}
[hidden]:where(:not([hidden=until-found])) {
display:none;
}
.container {
width:100%;
}
@media (min-width:640px) {
.container {
max-width:640px;
}
}
@media (min-width:768px) {
.container {
max-width:768px;
}
}
@media (min-width:1024px) {
.container {
max-width:1024px;
}
}
@media (min-width:1280px) {
.container {
max-width:1280px;
}
}
@media (min-width:1536px) {
.container {
max-width:1536px;
}
}
.pointer-events-none {
pointer-events:none;
}
.visible {
visibility:visible;
}
.invisible {
visibility:hidden;
}
.static {
position:static;
}
.fixed {
position:fixed;
}
.absolute {
position:absolute;
}
.relative {
position:relative;
}
.sticky {
position:sticky;
}
.-inset-4 {
inset:-1rem;
}
.inset-0 {
inset:0;
}
.bottom-0 {
bottom:0;
}
.bottom-1 {
bottom:.25rem;
}
.bottom-2 {
bottom:.5rem;
}
.bottom-8 {
bottom:2rem;
}
.left-0 {
left:0;
}
.left-1\.5 {
left:.375rem;
}
.left-1\/2 {
left:50%;
}
.left-2 {
left:.5rem;
}
.right-0 {
right:0;
}
.right-1 {
right:.25rem;
}
.right-1\.5 {
right:.375rem;
}
.right-2 {
right:.5rem;
}
.right-3 {
right:.75rem;
}
.right-4 {
right:1rem;
}
.top-0 {
top:0;
}
.top-1\.5 {
top:.375rem;
}
.top-1\/2 {
top:50%;
}
.top-2 {
top:.5rem;
}
.top-20 {
top:5rem;
}
.top-24 {
top:6rem;
}
.top-4 {
top:1rem;
}
.top-full {
top:100%;
}
.z-0 {
z-index:0;
}
.z-10 {
z-index:10;
}
.z-20 {
z-index:20;
}
.z-50 {
z-index:50;
}
.mx-1\.5 {
margin-left:.375rem;
margin-right:.375rem;
}
.mx-2 {
margin-left:.5rem;
margin-right:.5rem;
}
.mx-auto {
margin-left:auto;
margin-right:auto;
}
.my-4 {
margin-bottom:1rem;
margin-top:1rem;
}
.mb-1 {
margin-bottom:.25rem;
}
.mb-1\.5 {
margin-bottom:.375rem;
}
.mb-2 {
margin-bottom:.5rem;
}
.mb-3 {
margin-bottom:.75rem;
}
.mb-4 {
margin-bottom:1rem;
}
.mb-6 {
margin-bottom:1.5rem;
}
.ml-1 {
margin-left:.25rem;
}
.ml-1\.5 {
margin-left:.375rem;
}
.ml-2 {
margin-left:.5rem;
}
.ml-8 {
margin-left:2rem;
}
.ml-auto {
margin-left:auto;
}
.mr-1 {
margin-right:.25rem;
}
.mr-1\.5 {
margin-right:.375rem;
}
.mr-2 {
margin-right:.5rem;
}
.mr-3 {
margin-right:.75rem;
}
.mt-0\.5 {
margin-top:.125rem;
}
.mt-1 {
margin-top:.25rem;
}
.mt-2 {
margin-top:.5rem;
}
.mt-4 {
margin-top:1rem;
}
.mt-8 {
margin-top:2rem;
}
.mt-auto {
margin-top:auto;
}
.line-clamp-1 {
-webkit-line-clamp:1;
}
.line-clamp-1,.line-clamp-2 {
display:-webkit-box;
overflow:hidden;
-webkit-box-orient:vertical;
}
.line-clamp-2 {
-webkit-line-clamp:2;
}
.block {
display:block;
}
.inline-block {
display:inline-block;
}
.flex {
display:flex;
}
.table {
display:table;
}
.grid {
display:grid;
}
.contents {
display:contents;
}
.hidden {
display:none;
}
.h-10 {
height:2.5rem;
}
.h-12 {
height:3rem;
}
.h-2 {
height:.5rem;
}
.h-24 {
height:6rem;
}
.h-48 {
height:12rem;
}
.h-5 {
height:1.25rem;
}
.h-6 {
height:1.5rem;
}
.h-7 {
height:1.75rem;
}
.h-8 {
height:2rem;
}
.h-9 {
height:2.25rem;
}
.h-full {
height:100%;
}
.max-h-48 {
max-height:12rem;
}
.min-h-screen {
min-height:100vh;
}
.w-10 {
width:2.5rem;
}
.w-12 {
width:3rem;
}
.w-2 {
width:.5rem;
}
.w-48 {
width:12rem;
}
.w-5 {
width:1.25rem;
}
.w-56 {
width:14rem;
}
.w-6 {
width:1.5rem;
}
.w-7 {
width:1.75rem;
}
.w-72 {
width:18rem;
}
.w-8 {
width:2rem;
}
.w-9 {
width:2.25rem;
}
.w-\[120px\] {
width:120px;
}
.w-auto {
width:auto;
}
.w-full {
width:100%;
}
.min-w-0 {
min-width:0;
}
.max-w-\[1400px\] {
max-width:1400px;
}
.max-w-md {
max-width:28rem;
}
.max-w-sm {
max-width:24rem;
}
.max-w-none {
max-width:none;
}
.max-w-xs {
max-width:20rem;
}
.flex-1 {
flex:1 1 0%;
}
.flex-shrink {
flex-shrink:1;
}
.flex-shrink-0,.shrink-0 {
flex-shrink:0;
}
.-translate-x-1\/2 {
--tw-translate-x:-50%;
}
.-translate-x-1\/2,.-translate-y-1\/2 {
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.-translate-y-1\/2 {
--tw-translate-y:-50%;
}
.translate-x-0 {
--tw-translate-x:0px;
}
.translate-x-0,.translate-x-full {
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-x-full {
--tw-translate-x:100%;
}
.translate-y-0 {
--tw-translate-y:0px;
}
.translate-y-0,.translate-y-2 {
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.translate-y-2 {
--tw-translate-y:0.5rem;
}
.rotate-180 {
--tw-rotate:180deg;
}
.rotate-180,.scale-110 {
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.scale-110 {
--tw-scale-x:1.1;
--tw-scale-y:1.1;
}
.scale-\[1\.02\] {
--tw-scale-x:1.02;
--tw-scale-y:1.02;
}
.scale-\[1\.02\],.transform {
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
@keyframes fadeIn {

0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}

}
@keyframes float {

0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}

}
.cursor-pointer {
cursor:pointer;
}
.resize-none {
resize:none;
}
.grid-cols-1 {
grid-template-columns:repeat(1,minmax(0,1fr));
}
.grid-cols-2 {
grid-template-columns:repeat(2,minmax(0,1fr));
}
.grid-cols-8 {
grid-template-columns:repeat(8,minmax(0,1fr));
}
.flex-col {
flex-direction:column;
}
.flex-wrap {
flex-wrap:wrap;
}
.items-start {
align-items:flex-start;
}
.items-end {
align-items:flex-end;
}
.items-center {
align-items:center;
}
.justify-end {
justify-content:flex-end;
}
.justify-center {
justify-content:center;
}
.justify-between {
justify-content:space-between;
}
.justify-around {
justify-content:space-around;
}
.gap-1 {
gap:.25rem;
}
.gap-2 {
gap:.5rem;
}
.gap-3 {
gap:.75rem;
}
.gap-4 {
gap:1rem;
}
.gap-6 {
gap:1.5rem;
}
.gap-y-2 {
row-gap:.5rem;
}
.space-x-1>:not([hidden])~:not([hidden]) {
--tw-space-x-reverse:0;
margin-left:calc(.25rem*(1 - var(--tw-space-x-reverse)));
margin-right:calc(.25rem*var(--tw-space-x-reverse));
}
.space-x-2>:not([hidden])~:not([hidden]) {
--tw-space-x-reverse:0;
margin-left:calc(.5rem*(1 - var(--tw-space-x-reverse)));
margin-right:calc(.5rem*var(--tw-space-x-reverse));
}
.space-x-3>:not([hidden])~:not([hidden]) {
--tw-space-x-reverse:0;
margin-left:calc(.75rem*(1 - var(--tw-space-x-reverse)));
margin-right:calc(.75rem*var(--tw-space-x-reverse));
}
.space-x-4>:not([hidden])~:not([hidden]) {
--tw-space-x-reverse:0;
margin-left:calc(1rem*(1 - var(--tw-space-x-reverse)));
margin-right:calc(1rem*var(--tw-space-x-reverse));
}
.space-x-6>:not([hidden])~:not([hidden]) {
--tw-space-x-reverse:0;
margin-left:calc(1.5rem*(1 - var(--tw-space-x-reverse)));
margin-right:calc(1.5rem*var(--tw-space-x-reverse));
}
.space-y-2>:not([hidden])~:not([hidden]) {
--tw-space-y-reverse:0;
margin-bottom:calc(.5rem*var(--tw-space-y-reverse));
margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)));
}
.space-y-4>:not([hidden])~:not([hidden]) {
--tw-space-y-reverse:0;
margin-bottom:calc(1rem*var(--tw-space-y-reverse));
margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));
}
.divide-y>:not([hidden])~:not([hidden]) {
--tw-divide-y-reverse:0;
border-bottom-width:calc(1px*var(--tw-divide-y-reverse));
border-top-width:calc(1px*(1 - var(--tw-divide-y-reverse)));
}
.divide-dashed>:not([hidden])~:not([hidden]) {
border-style:dashed;
}
.divide-gray-200>:not([hidden])~:not([hidden]) {
--tw-divide-opacity:1;
border-color:rgb(229 231 235/var(--tw-divide-opacity,1));
}
.divide-gray-300>:not([hidden])~:not([hidden]) {
--tw-divide-opacity:1;
border-color:rgb(209 213 219/var(--tw-divide-opacity,1));
}
.overflow-hidden {
overflow:hidden;
}
.overflow-x-auto {
overflow-x:auto;
}
.overflow-y-auto {
overflow-y:auto;
}
.truncate {
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
.break-words {
overflow-wrap:break-word;
}
.break-all {
word-break:break-all;
}
.rounded {
border-radius:.25rem;
}
.rounded-full {
border-radius:9999px;
}
.rounded-lg {
border-radius:.5rem;
}
.rounded-xl {
border-radius:.75rem;
}
.border {
border-width:1px;
}
.border-0 {
border-width:0;
}
.border-2 {
border-width:2px;
}
.border-b {
border-bottom-width:1px;
}
.border-l-4 {
border-left-width:4px;
}
.border-gray-200 {
--tw-border-opacity:1;
border-color:rgb(229 231 235/var(--tw-border-opacity,1));
}
.border-gray-300 {
--tw-border-opacity:1;
border-color:rgb(209 213 219/var(--tw-border-opacity,1));
}
.border-orange-400 {
--tw-border-opacity:1;
border-color:rgb(251 146 60/var(--tw-border-opacity,1));
}
.border-primary-200 {
--tw-border-opacity:1;
border-color:rgb(191 219 254/var(--tw-border-opacity,1));
}
.border-primary-400 {
--tw-border-opacity:1;
border-color:rgb(96 165 250/var(--tw-border-opacity,1));
}
.border-primary-500 {
--tw-border-opacity:1;
border-color:rgb(59 130 246/var(--tw-border-opacity,1));
}
.border-transparent {
border-color:transparent;
}
.bg-black\/50 {
background-color:rgba(0,0,0,.5);
}
.bg-blue-500 {
--tw-bg-opacity:1;
background-color:rgb(59 130 246/var(--tw-bg-opacity,1));
}
.bg-blue-500\/10 {
background-color:rgba(59,130,246,.1);
}
.bg-blue-600 {
--tw-bg-opacity:1;
background-color:rgb(37 99 235/var(--tw-bg-opacity,1));
}
.bg-gray-100 {
--tw-bg-opacity:1;
background-color:rgb(243 244 246/var(--tw-bg-opacity,1));
}
.bg-gray-200 {
--tw-bg-opacity:1;
background-color:rgb(229 231 235/var(--tw-bg-opacity,1));
}
.bg-gray-50 {
--tw-bg-opacity:1;
background-color:rgb(249 250 251/var(--tw-bg-opacity,1));
}
.bg-green-500 {
--tw-bg-opacity:1;
background-color:rgb(34 197 94/var(--tw-bg-opacity,1));
}
.bg-green-500\/10 {
background-color:rgba(34,197,94,.1);
}
.bg-primary-50 {
--tw-bg-opacity:1;
background-color:rgb(239 246 255/var(--tw-bg-opacity,1));
}
.bg-primary-500 {
--tw-bg-opacity:1;
background-color:rgb(59 130 246/var(--tw-bg-opacity,1));
}
.bg-primary-500\/20 {
background-color:rgba(59,130,246,.2);
}
.bg-purple-500 {
--tw-bg-opacity:1;
background-color:rgb(168 85 247/var(--tw-bg-opacity,1));
}
.bg-purple-500\/10 {
background-color:rgba(168,85,247,.1);
}
.bg-red-100 {
--tw-bg-opacity:1;
background-color:rgb(254 226 226/var(--tw-bg-opacity,1));
}
.bg-red-500 {
--tw-bg-opacity:1;
background-color:rgb(239 68 68/var(--tw-bg-opacity,1));
}
.bg-red-500\/10 {
background-color:rgba(239,68,68,.1);
}
.bg-white {
--tw-bg-opacity:1;
background-color:rgb(255 255 255/var(--tw-bg-opacity,1));
}
.bg-white\/30 {
background-color:hsla(0,0%,100%,.3);
}
.bg-white\/50 {
background-color:hsla(0,0%,100%,.5);
}
.bg-white\/60 {
background-color:hsla(0,0%,100%,.6);
}
.bg-white\/65 {
background-color:hsla(0,0%,100%,.65);
}
.bg-gradient-to-b {
background-image:linear-gradient(to bottom,var(--tw-gradient-stops));
}
.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));
}
.bg-gradient-to-t {
background-image:linear-gradient(to top,var(--tw-gradient-stops));
}
.from-black\/20 {
--tw-gradient-from:rgba(0,0,0,.2) var(--tw-gradient-from-position);
--tw-gradient-to:transparent var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.from-black\/60 {
--tw-gradient-from:rgba(0,0,0,.6) var(--tw-gradient-from-position);
--tw-gradient-to:transparent var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.from-black\/70 {
--tw-gradient-from:rgba(0,0,0,.7) var(--tw-gradient-from-position);
--tw-gradient-to:transparent var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.from-blue-50 {
--tw-gradient-from:#eff6ff var(--tw-gradient-from-position);
--tw-gradient-to:rgba(239,246,255,0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.from-green-50 {
--tw-gradient-from:#f0fdf4 var(--tw-gradient-from-position);
--tw-gradient-to:rgba(240,253,244,0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.from-primary-50 {
--tw-gradient-from:#eff6ff var(--tw-gradient-from-position);
--tw-gradient-to:rgba(239,246,255,0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.from-primary-500 {
--tw-gradient-from:#3b82f6 var(--tw-gradient-from-position);
--tw-gradient-to:rgba(59,130,246,0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.from-purple-50 {
--tw-gradient-from:#faf5ff var(--tw-gradient-from-position);
--tw-gradient-to:rgba(250,245,255,0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.from-red-50 {
--tw-gradient-from:#fef2f2 var(--tw-gradient-from-position);
--tw-gradient-to:hsla(0,86%,97%,0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.via-black\/10 {
--tw-gradient-to:transparent var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),rgba(0,0,0,.1) var(--tw-gradient-via-position),var(--tw-gradient-to);
}
.via-black\/40 {
--tw-gradient-to:transparent var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),rgba(0,0,0,.4) var(--tw-gradient-via-position),var(--tw-gradient-to);
}
.to-black\/40 {
--tw-gradient-to:rgba(0,0,0,.4) var(--tw-gradient-to-position);
}
.to-blue-100 {
--tw-gradient-to:#dbeafe var(--tw-gradient-to-position);
}
.to-green-100 {
--tw-gradient-to:#dcfce7 var(--tw-gradient-to-position);
}
.to-indigo-50 {
--tw-gradient-to:#eef2ff var(--tw-gradient-to-position);
}
.to-primary-700 {
--tw-gradient-to:#1d4ed8 var(--tw-gradient-to-position);
}
.to-purple-100 {
--tw-gradient-to:#f3e8ff var(--tw-gradient-to-position);
}
.to-red-100 {
--tw-gradient-to:#fee2e2 var(--tw-gradient-to-position);
}
.to-transparent {
--tw-gradient-to:transparent var(--tw-gradient-to-position);
}
.object-cover {
-o-object-fit:cover;
object-fit:cover;
}
.p-0\.5 {
padding:.125rem;
}
.p-12 {
padding:3rem;
}
.p-2 {
padding:.5rem;
}
.p-2\.5 {
padding:.625rem;
}
.p-3 {
padding:.75rem;
}
.p-3\.5 {
padding:.875rem;
}
.p-4 {
padding:1rem;
}
.p-6 {
padding:1.5rem;
}
.px-1\.5 {
padding-left:.375rem;
padding-right:.375rem;
}
.px-2 {
padding-left:.5rem;
padding-right:.5rem;
}
.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;
}
.py-0\.5 {
padding-bottom:.125rem;
padding-top:.125rem;
}
.py-1 {
padding-bottom:.25rem;
padding-top:.25rem;
}
.py-1\.5 {
padding-bottom:.375rem;
padding-top:.375rem;
}
.py-2 {
padding-bottom:.5rem;
padding-top:.5rem;
}
.py-2\.5 {
padding-bottom:.625rem;
padding-top:.625rem;
}
.py-3 {
padding-bottom:.75rem;
padding-top:.75rem;
}
.pb-0 {
padding-bottom:0;
}
.pb-10 {
padding-bottom:2.5rem;
}
.pb-3 {
padding-bottom:.75rem;
}
.pb-4 {
padding-bottom:1rem;
}
.pr-12 {
padding-right:3rem;
}
.pt-0 {
padding-top:0;
}
.pt-20 {
padding-top:5rem;
}
.pt-4 {
padding-top:1rem;
}
.text-center {
text-align:center;
}
.text-right {
text-align:right;
}
.text-2xl {
font-size:1.5rem;
line-height:2rem;
}
.text-6xl {
font-size:3.75rem;
line-height:1;
}
.text-8xl {
font-size:6rem;
line-height:1;
}
.text-\[10px\] {
font-size:10px;
}
.text-base {
font-size:1rem;
line-height:1.5rem;
}
.text-lg {
font-size:1.125rem;
line-height:1.75rem;
}
.text-sm {
font-size:.875rem;
line-height:1.25rem;
}
.text-xl {
font-size:1.25rem;
line-height:1.75rem;
}
.text-xs {
font-size:.75rem;
line-height:1rem;
}
.font-bold {
font-weight:700;
}
.font-medium {
font-weight:500;
}
.font-normal {
font-weight:400;
}
.font-semibold {
font-weight:600;
}
.uppercase {
text-transform:uppercase;
}
.leading-none {
line-height:1;
}
.leading-relaxed {
line-height:1.625;
}
.leading-snug {
line-height:1.375;
}
.tracking-wider {
letter-spacing:.05em;
}
.text-blue-500 {
--tw-text-opacity:1;
color:rgb(59 130 246/var(--tw-text-opacity,1));
}
.text-blue-600 {
--tw-text-opacity:1;
color:rgb(37 99 235/var(--tw-text-opacity,1));
}
.text-gray-300 {
--tw-text-opacity:1;
color:rgb(209 213 219/var(--tw-text-opacity,1));
}
.text-gray-400 {
--tw-text-opacity:1;
color:rgb(156 163 175/var(--tw-text-opacity,1));
}
.text-gray-500 {
--tw-text-opacity:1;
color:rgb(107 114 128/var(--tw-text-opacity,1));
}
.text-gray-600 {
--tw-text-opacity:1;
color:rgb(75 85 99/var(--tw-text-opacity,1));
}
.text-gray-700 {
--tw-text-opacity:1;
color:rgb(55 65 81/var(--tw-text-opacity,1));
}
.text-gray-800 {
--tw-text-opacity:1;
color:rgb(31 41 55/var(--tw-text-opacity,1));
}
.text-green-500 {
--tw-text-opacity:1;
color:rgb(34 197 94/var(--tw-text-opacity,1));
}
.text-green-600 {
--tw-text-opacity:1;
color:rgb(22 163 74/var(--tw-text-opacity,1));
}
.text-orange-400 {
--tw-text-opacity:1;
color:rgb(251 146 60/var(--tw-text-opacity,1));
}
.text-orange-500 {
--tw-text-opacity:1;
color:rgb(249 115 22/var(--tw-text-opacity,1));
}
.text-primary-500 {
--tw-text-opacity:1;
color:rgb(59 130 246/var(--tw-text-opacity,1));
}
.text-primary-500\/20 {
color:rgba(59,130,246,.2);
}
.text-primary-600 {
--tw-text-opacity:1;
color:rgb(37 99 235/var(--tw-text-opacity,1));
}
.text-purple-500 {
--tw-text-opacity:1;
color:rgb(168 85 247/var(--tw-text-opacity,1));
}
.text-purple-600 {
--tw-text-opacity:1;
color:rgb(147 51 234/var(--tw-text-opacity,1));
}
.text-red-500 {
--tw-text-opacity:1;
color:rgb(239 68 68/var(--tw-text-opacity,1));
}
.text-red-600 {
--tw-text-opacity:1;
color:rgb(220 38 38/var(--tw-text-opacity,1));
}
.text-white {
--tw-text-opacity:1;
color:rgb(255 255 255/var(--tw-text-opacity,1));
}
.text-yellow-300 {
--tw-text-opacity:1;
color:rgb(253 224 71/var(--tw-text-opacity,1));
}
.text-yellow-500 {
--tw-text-opacity:1;
color:rgb(234 179 8/var(--tw-text-opacity,1));
}
.opacity-0 {
opacity:0;
}
.opacity-100 {
opacity:1;
}
.opacity-20 {
opacity:.2;
}
.opacity-40 {
opacity:.4;
}
.opacity-90 {
opacity:.9;
}
.shadow-lg {
--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);
--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color);
}
.shadow-lg,.shadow-md {
box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
.shadow-md {
--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);
}
.outline {
outline-style:solid;
}
.blur {
--tw-blur:blur(8px);
}
.blur,.drop-shadow {
filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow {
--tw-drop-shadow:drop-shadow(0 1px 2px rgba(0,0,0,.1)) drop-shadow(0 1px 1px rgba(0,0,0,.06));
}
.backdrop-blur-md {
--tw-backdrop-blur:blur(12px);
}
.backdrop-blur-md,.backdrop-blur-sm {
-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
}
.backdrop-blur-sm {
--tw-backdrop-blur:blur(4px);
}
.transition {
transition-duration:.15s;
transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;
transition-timing-function:cubic-bezier(.4,0,.2,1);
}
.transition-all {
transition-duration:.15s;
transition-property:all;
transition-timing-function:cubic-bezier(.4,0,.2,1);
}
.transition-colors {
transition-duration:.15s;
transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;
transition-timing-function:cubic-bezier(.4,0,.2,1);
}
.transition-opacity {
transition-duration:.15s;
transition-property:opacity;
transition-timing-function:cubic-bezier(.4,0,.2,1);
}
.transition-transform {
transition-duration:.15s;
transition-property:transform;
transition-timing-function:cubic-bezier(.4,0,.2,1);
}
.duration-200 {
transition-duration:.2s;
}
.duration-300 {
transition-duration:.3s;
}
.duration-500 {
transition-duration:.5s;
}
.ease-in {
transition-timing-function:cubic-bezier(.4,0,1,1);
}
.ease-in-out {
transition-timing-function:cubic-bezier(.4,0,.2,1);
}
.ease-out {
transition-timing-function:cubic-bezier(0,0,.2,1);
}
.progress-hover-blue:hover .bg-blue-500 {
--tw-shadow:0 4px 6px -1px rgba(59,130,246,.3),0 2px 4px -1px rgba(59,130,246,.3);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -1px var(--tw-shadow-color);
}
.progress-hover-blue:hover .bg-blue-500,.progress-hover-green:hover .bg-green-500 {
box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
.progress-hover-green:hover .bg-green-500 {
--tw-shadow:0 4px 6px -1px rgba(16,185,129,.3),0 2px 4px -1px rgba(16,185,129,.3);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -1px var(--tw-shadow-color);
}
.progress-hover-purple:hover .bg-purple-500 {
--tw-shadow:0 4px 6px -1px rgba(139,92,246,.3),0 2px 4px -1px rgba(139,92,246,.3);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -1px var(--tw-shadow-color);
}
.progress-hover-purple:hover .bg-purple-500,.progress-hover-red:hover .bg-red-500 {
box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
.progress-hover-red:hover .bg-red-500 {
--tw-shadow:0 4px 6px -1px rgba(239,68,68,.3),0 2px 4px -1px rgba(239,68,68,.3);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -1px var(--tw-shadow-color);
}
.modal-transition.active {
opacity:1;
visibility:visible;
}
.modal-transition.active .modal-content-transition {
--tw-scale-x:1;
--tw-scale-y:1;
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
@media (hover:none) and (pointer:coarse) {
.touch-safe {
min-height:3rem;
min-width:3rem;
}
}
.last\:border-b-0:last-child {
border-bottom-width:0;
}
.hover\:scale-105:hover {
--tw-scale-x:1.05;
--tw-scale-y:1.05;
}
.hover\:scale-105:hover,.hover\:scale-110:hover {
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.hover\:scale-110:hover {
--tw-scale-x:1.1;
--tw-scale-y:1.1;
}
.hover\:scale-\[1\.02\]:hover {
--tw-scale-x:1.02;
--tw-scale-y:1.02;
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.hover\:border-primary-300:hover {
--tw-border-opacity:1;
border-color:rgb(147 197 253/var(--tw-border-opacity,1));
}
.hover\:border-transparent:hover {
border-color:transparent;
}
.hover\:bg-blue-700:hover {
--tw-bg-opacity:1;
background-color:rgb(29 78 216/var(--tw-bg-opacity,1));
}
.hover\:bg-primary-500:hover {
--tw-bg-opacity:1;
background-color:rgb(59 130 246/var(--tw-bg-opacity,1));
}
.hover\:bg-primary-600:hover {
--tw-bg-opacity:1;
background-color:rgb(37 99 235/var(--tw-bg-opacity,1));
}
.hover\:bg-white:hover {
--tw-bg-opacity:1;
background-color:rgb(255 255 255/var(--tw-bg-opacity,1));
}
.hover\:bg-white\/20:hover {
background-color:hsla(0,0%,100%,.2);
}
.hover\:bg-white\/30:hover {
background-color:hsla(0,0%,100%,.3);
}
.hover\:bg-white\/50:hover {
background-color:hsla(0,0%,100%,.5);
}
.hover\:from-primary-500:hover {
--tw-gradient-from:#3b82f6 var(--tw-gradient-from-position);
--tw-gradient-to:rgba(59,130,246,0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.hover\:to-indigo-500:hover {
--tw-gradient-to:#6366f1 var(--tw-gradient-to-position);
}
.hover\:text-blue-400:hover {
--tw-text-opacity:1;
color:rgb(96 165 250/var(--tw-text-opacity,1));
}
.hover\:text-blue-600:hover {
--tw-text-opacity:1;
color:rgb(37 99 235/var(--tw-text-opacity,1));
}
.hover\:text-gray-600:hover {
--tw-text-opacity:1;
color:rgb(75 85 99/var(--tw-text-opacity,1));
}
.hover\:text-gray-700:hover {
--tw-text-opacity:1;
color:rgb(55 65 81/var(--tw-text-opacity,1));
}
.hover\:text-gray-800:hover {
--tw-text-opacity:1;
color:rgb(31 41 55/var(--tw-text-opacity,1));
}
.hover\:text-green-500:hover {
--tw-text-opacity:1;
color:rgb(34 197 94/var(--tw-text-opacity,1));
}
.hover\:text-indigo-500:hover {
--tw-text-opacity:1;
color:rgb(99 102 241/var(--tw-text-opacity,1));
}
.hover\:text-primary-500:hover {
--tw-text-opacity:1;
color:rgb(59 130 246/var(--tw-text-opacity,1));
}
.hover\:text-primary-600:hover {
--tw-text-opacity:1;
color:rgb(37 99 235/var(--tw-text-opacity,1));
}
.hover\:text-primary-700:hover {
--tw-text-opacity:1;
color:rgb(29 78 216/var(--tw-text-opacity,1));
}
.hover\:text-red-500:hover {
--tw-text-opacity:1;
color:rgb(239 68 68/var(--tw-text-opacity,1));
}
.hover\:text-white:hover {
--tw-text-opacity:1;
color:rgb(255 255 255/var(--tw-text-opacity,1));
}
.hover\:underline:hover {
text-decoration-line:underline;
}
.hover\:shadow-md:hover {
--tw-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -2px var(--tw-shadow-color);
}
.hover\:shadow-md:hover,.hover\:shadow-sm:hover {
box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
.hover\:shadow-sm:hover {
--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);
--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);
}
.focus\:outline-none:focus {
outline:2px solid transparent;
outline-offset:2px;
}
.focus\:ring-2:focus {
--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000);
}
.focus\:ring-primary-500:focus {
--tw-ring-opacity:1;
--tw-ring-color:rgb(59 130 246/var(--tw-ring-opacity,1));
}
.active\:scale-\[0\.98\]:active,.group:hover .group-hover\:scale-105 {
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.group:hover .group-hover\:scale-105 {
--tw-scale-x:1.05;
--tw-scale-y:1.05;
}
.group:hover .group-hover\:text-primary-500 {
--tw-text-opacity:1;
color:rgb(59 130 246/var(--tw-text-opacity,1));
}
.dark\:divide-gray-600:is(.dark *)>:not([hidden])~:not([hidden]) {
--tw-divide-opacity:1;
border-color:rgb(75 85 99/var(--tw-divide-opacity,1));
}
.dark\:divide-gray-700:is(.dark *)>:not([hidden])~:not([hidden]) {
--tw-divide-opacity:1;
border-color:rgb(55 65 81/var(--tw-divide-opacity,1));
}
.dark\:border-gray-600:is(.dark *) {
--tw-border-opacity:1;
border-color:rgb(75 85 99/var(--tw-border-opacity,1));
}
.dark\:border-gray-700:is(.dark *) {
--tw-border-opacity:1;
border-color:rgb(55 65 81/var(--tw-border-opacity,1));
}
.dark\:border-orange-500:is(.dark *) {
--tw-border-opacity:1;
border-color:rgb(249 115 22/var(--tw-border-opacity,1));
}
.dark\:border-primary-800:is(.dark *) {
--tw-border-opacity:1;
border-color:rgb(30 64 175/var(--tw-border-opacity,1));
}
.dark\:bg-blue-100:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(219 234 254/var(--tw-bg-opacity,1));
}
.dark\:bg-blue-200:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(191 219 254/var(--tw-bg-opacity,1));
}
.dark\:bg-blue-400:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(96 165 250/var(--tw-bg-opacity,1));
}
.dark\:bg-blue-500:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(59 130 246/var(--tw-bg-opacity,1));
}
.dark\:bg-blue-600:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(37 99 235/var(--tw-bg-opacity,1));
}
.dark\:bg-blue-800\/50:is(.dark *) {
background-color:rgba(30,64,175,.5);
}
.dark\:bg-blue-900\/30:is(.dark *) {
background-color:rgba(30,58,138,.3);
}
.dark\:bg-gray-100:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(243 244 246/var(--tw-bg-opacity,1));
}
.dark\:bg-gray-200:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(229 231 235/var(--tw-bg-opacity,1));
}
.dark\:bg-gray-400:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(156 163 175/var(--tw-bg-opacity,1));
}
.dark\:bg-gray-500:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(107 114 128/var(--tw-bg-opacity,1));
}
.dark\:bg-gray-600:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(75 85 99/var(--tw-bg-opacity,1));
}
.dark\:bg-gray-800:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(31 41 55/var(--tw-bg-opacity,1));
}
.dark\:bg-gray-800\/50:is(.dark *) {
background-color:rgba(31,41,55,.5);
}
.dark\:bg-gray-800\/60:is(.dark *) {
background-color:rgba(31,41,55,.6);
}
.dark\:bg-gray-800\/65:is(.dark *) {
background-color:rgba(31,41,55,.65);
}
.dark\:bg-gray-900:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(17 24 39/var(--tw-bg-opacity,1));
}
.dark\:bg-gray-900\/30:is(.dark *) {
background-color:rgba(17,24,39,.3);
}
.dark\:bg-green-100:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(220 252 231/var(--tw-bg-opacity,1));
}
.dark\:bg-green-200:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(187 247 208/var(--tw-bg-opacity,1));
}
.dark\:bg-green-400:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(74 222 128/var(--tw-bg-opacity,1));
}
.dark\:bg-green-500:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(34 197 94/var(--tw-bg-opacity,1));
}
.dark\:bg-green-600:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(22 163 74/var(--tw-bg-opacity,1));
}
.dark\:bg-green-800\/50:is(.dark *) {
background-color:rgba(22,101,52,.5);
}
.dark\:bg-green-900\/30:is(.dark *) {
background-color:rgba(20,83,45,.3);
}
.dark\:bg-indigo-100:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(224 231 255/var(--tw-bg-opacity,1));
}
.dark\:bg-indigo-200:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(199 210 254/var(--tw-bg-opacity,1));
}
.dark\:bg-indigo-400:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(129 140 248/var(--tw-bg-opacity,1));
}
.dark\:bg-indigo-500:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(99 102 241/var(--tw-bg-opacity,1));
}
.dark\:bg-indigo-600:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(79 70 229/var(--tw-bg-opacity,1));
}
.dark\:bg-indigo-800\/50:is(.dark *) {
background-color:rgba(55,48,163,.5);
}
.dark\:bg-indigo-900\/30:is(.dark *) {
background-color:rgba(49,46,129,.3);
}
.dark\:bg-orange-100:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(255 237 213/var(--tw-bg-opacity,1));
}
.dark\:bg-orange-200:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(254 215 170/var(--tw-bg-opacity,1));
}
.dark\:bg-orange-400:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(251 146 60/var(--tw-bg-opacity,1));
}
.dark\:bg-orange-500:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(249 115 22/var(--tw-bg-opacity,1));
}
.dark\:bg-orange-600:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(234 88 12/var(--tw-bg-opacity,1));
}
.dark\:bg-orange-800\/50:is(.dark *) {
background-color:rgba(154,52,18,.5);
}
.dark\:bg-orange-900\/30:is(.dark *) {
background-color:rgba(124,45,18,.3);
}
.dark\:bg-pink-100:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(252 231 243/var(--tw-bg-opacity,1));
}
.dark\:bg-pink-200:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(251 207 232/var(--tw-bg-opacity,1));
}
.dark\:bg-pink-400:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(244 114 182/var(--tw-bg-opacity,1));
}
.dark\:bg-pink-500:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(236 72 153/var(--tw-bg-opacity,1));
}
.dark\:bg-pink-600:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(219 39 119/var(--tw-bg-opacity,1));
}
.dark\:bg-pink-800\/50:is(.dark *) {
background-color:rgba(157,23,77,.5);
}
.dark\:bg-pink-900\/30:is(.dark *) {
background-color:rgba(131,24,67,.3);
}
.dark\:bg-primary-900\/20:is(.dark *) {
background-color:rgba(30,58,138,.2);
}
.dark\:bg-primary-900\/30:is(.dark *) {
background-color:rgba(30,58,138,.3);
}
.dark\:bg-purple-100:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(243 232 255/var(--tw-bg-opacity,1));
}
.dark\:bg-purple-200:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(233 213 255/var(--tw-bg-opacity,1));
}
.dark\:bg-purple-400:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(192 132 252/var(--tw-bg-opacity,1));
}
.dark\:bg-purple-500:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(168 85 247/var(--tw-bg-opacity,1));
}
.dark\:bg-purple-600:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(147 51 234/var(--tw-bg-opacity,1));
}
.dark\:bg-purple-800\/50:is(.dark *) {
background-color:rgba(107,33,168,.5);
}
.dark\:bg-purple-900\/30:is(.dark *) {
background-color:rgba(88,28,135,.3);
}
.dark\:bg-red-100:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(254 226 226/var(--tw-bg-opacity,1));
}
.dark\:bg-red-200:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(254 202 202/var(--tw-bg-opacity,1));
}
.dark\:bg-red-400:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(248 113 113/var(--tw-bg-opacity,1));
}
.dark\:bg-red-500:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(239 68 68/var(--tw-bg-opacity,1));
}
.dark\:bg-red-600:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(220 38 38/var(--tw-bg-opacity,1));
}
.dark\:bg-red-800\/50:is(.dark *) {
background-color:rgba(153,27,27,.5);
}
.dark\:bg-red-900\/30:is(.dark *) {
background-color:rgba(127,29,29,.3);
}
.dark\:bg-teal-100:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(204 251 241/var(--tw-bg-opacity,1));
}
.dark\:bg-teal-200:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(153 246 228/var(--tw-bg-opacity,1));
}
.dark\:bg-teal-400:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(45 212 191/var(--tw-bg-opacity,1));
}
.dark\:bg-teal-500:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(20 184 166/var(--tw-bg-opacity,1));
}
.dark\:bg-teal-600:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(13 148 136/var(--tw-bg-opacity,1));
}
.dark\:bg-teal-800\/50:is(.dark *) {
background-color:rgba(17,94,89,.5);
}
.dark\:bg-teal-900\/30:is(.dark *) {
background-color:rgba(19,78,74,.3);
}
.dark\:bg-yellow-100:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(254 249 195/var(--tw-bg-opacity,1));
}
.dark\:bg-yellow-200:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(254 240 138/var(--tw-bg-opacity,1));
}
.dark\:bg-yellow-400:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(250 204 21/var(--tw-bg-opacity,1));
}
.dark\:bg-yellow-500:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(234 179 8/var(--tw-bg-opacity,1));
}
.dark\:bg-yellow-600:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(202 138 4/var(--tw-bg-opacity,1));
}
.dark\:bg-yellow-800\/50:is(.dark *) {
background-color:rgba(133,77,14,.5);
}
.dark\:bg-yellow-900\/30:is(.dark *) {
background-color:rgba(113,63,18,.3);
}
.dark\:from-blue-900\/30:is(.dark *) {
--tw-gradient-from:rgba(30,58,138,.3) var(--tw-gradient-from-position);
--tw-gradient-to:rgba(30,58,138,0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.dark\:from-green-900\/30:is(.dark *) {
--tw-gradient-from:rgba(20,83,45,.3) var(--tw-gradient-from-position);
--tw-gradient-to:rgba(20,83,45,0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.dark\:from-primary-900\/30:is(.dark *) {
--tw-gradient-from:rgba(30,58,138,.3) var(--tw-gradient-from-position);
--tw-gradient-to:rgba(30,58,138,0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.dark\:from-purple-900\/30:is(.dark *) {
--tw-gradient-from:rgba(88,28,135,.3) var(--tw-gradient-from-position);
--tw-gradient-to:rgba(88,28,135,0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.dark\:from-red-900\/30:is(.dark *) {
--tw-gradient-from:rgba(127,29,29,.3) var(--tw-gradient-from-position);
--tw-gradient-to:rgba(127,29,29,0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to);
}
.dark\:to-blue-800\/20:is(.dark *) {
--tw-gradient-to:rgba(30,64,175,.2) var(--tw-gradient-to-position);
}
.dark\:to-green-800\/20:is(.dark *) {
--tw-gradient-to:rgba(22,101,52,.2) var(--tw-gradient-to-position);
}
.dark\:to-indigo-900\/30:is(.dark *) {
--tw-gradient-to:rgba(49,46,129,.3) var(--tw-gradient-to-position);
}
.dark\:to-purple-800\/20:is(.dark *) {
--tw-gradient-to:rgba(107,33,168,.2) var(--tw-gradient-to-position);
}
.dark\:to-red-800\/20:is(.dark *) {
--tw-gradient-to:rgba(153,27,27,.2) var(--tw-gradient-to-position);
}
.dark\:text-blue-100:is(.dark *) {
--tw-text-opacity:1;
color:rgb(219 234 254/var(--tw-text-opacity,1));
}
.dark\:text-blue-200:is(.dark *) {
--tw-text-opacity:1;
color:rgb(191 219 254/var(--tw-text-opacity,1));
}
.dark\:text-blue-400:is(.dark *) {
--tw-text-opacity:1;
color:rgb(96 165 250/var(--tw-text-opacity,1));
}
.dark\:text-blue-500:is(.dark *) {
--tw-text-opacity:1;
color:rgb(59 130 246/var(--tw-text-opacity,1));
}
.dark\:text-blue-600:is(.dark *) {
--tw-text-opacity:1;
color:rgb(37 99 235/var(--tw-text-opacity,1));
}
.dark\:text-blue-800\/50:is(.dark *) {
color:rgba(30,64,175,.5);
}
.dark\:text-blue-900\/30:is(.dark *) {
color:rgba(30,58,138,.3);
}
.dark\:text-gray-100:is(.dark *) {
--tw-text-opacity:1;
color:rgb(243 244 246/var(--tw-text-opacity,1));
}
.dark\:text-gray-200:is(.dark *) {
--tw-text-opacity:1;
color:rgb(229 231 235/var(--tw-text-opacity,1));
}
.dark\:text-gray-300:is(.dark *) {
--tw-text-opacity:1;
color:rgb(209 213 219/var(--tw-text-opacity,1));
}
.dark\:text-gray-400:is(.dark *) {
--tw-text-opacity:1;
color:rgb(156 163 175/var(--tw-text-opacity,1));
}
.dark\:text-gray-500:is(.dark *) {
--tw-text-opacity:1;
color:rgb(107 114 128/var(--tw-text-opacity,1));
}
.dark\:text-gray-600:is(.dark *) {
--tw-text-opacity:1;
color:rgb(75 85 99/var(--tw-text-opacity,1));
}
.dark\:text-gray-800\/50:is(.dark *) {
color:rgba(31,41,55,.5);
}
.dark\:text-gray-900\/30:is(.dark *) {
color:rgba(17,24,39,.3);
}
.dark\:text-green-100:is(.dark *) {
--tw-text-opacity:1;
color:rgb(220 252 231/var(--tw-text-opacity,1));
}
.dark\:text-green-200:is(.dark *) {
--tw-text-opacity:1;
color:rgb(187 247 208/var(--tw-text-opacity,1));
}
.dark\:text-green-400:is(.dark *) {
--tw-text-opacity:1;
color:rgb(74 222 128/var(--tw-text-opacity,1));
}
.dark\:text-green-500:is(.dark *) {
--tw-text-opacity:1;
color:rgb(34 197 94/var(--tw-text-opacity,1));
}
.dark\:text-green-600:is(.dark *) {
--tw-text-opacity:1;
color:rgb(22 163 74/var(--tw-text-opacity,1));
}
.dark\:text-green-800\/50:is(.dark *) {
color:rgba(22,101,52,.5);
}
.dark\:text-green-900\/30:is(.dark *) {
color:rgba(20,83,45,.3);
}
.dark\:text-indigo-100:is(.dark *) {
--tw-text-opacity:1;
color:rgb(224 231 255/var(--tw-text-opacity,1));
}
.dark\:text-indigo-200:is(.dark *) {
--tw-text-opacity:1;
color:rgb(199 210 254/var(--tw-text-opacity,1));
}
.dark\:text-indigo-400:is(.dark *) {
--tw-text-opacity:1;
color:rgb(129 140 248/var(--tw-text-opacity,1));
}
.dark\:text-indigo-500:is(.dark *) {
--tw-text-opacity:1;
color:rgb(99 102 241/var(--tw-text-opacity,1));
}
.dark\:text-indigo-600:is(.dark *) {
--tw-text-opacity:1;
color:rgb(79 70 229/var(--tw-text-opacity,1));
}
.dark\:text-indigo-800\/50:is(.dark *) {
color:rgba(55,48,163,.5);
}
.dark\:text-indigo-900\/30:is(.dark *) {
color:rgba(49,46,129,.3);
}
.dark\:text-orange-100:is(.dark *) {
--tw-text-opacity:1;
color:rgb(255 237 213/var(--tw-text-opacity,1));
}
.dark\:text-orange-200:is(.dark *) {
--tw-text-opacity:1;
color:rgb(254 215 170/var(--tw-text-opacity,1));
}
.dark\:text-orange-400:is(.dark *) {
--tw-text-opacity:1;
color:rgb(251 146 60/var(--tw-text-opacity,1));
}
.dark\:text-orange-500:is(.dark *) {
--tw-text-opacity:1;
color:rgb(249 115 22/var(--tw-text-opacity,1));
}
.dark\:text-orange-600:is(.dark *) {
--tw-text-opacity:1;
color:rgb(234 88 12/var(--tw-text-opacity,1));
}
.dark\:text-orange-800\/50:is(.dark *) {
color:rgba(154,52,18,.5);
}
.dark\:text-orange-900\/30:is(.dark *) {
color:rgba(124,45,18,.3);
}
.dark\:text-pink-100:is(.dark *) {
--tw-text-opacity:1;
color:rgb(252 231 243/var(--tw-text-opacity,1));
}
.dark\:text-pink-200:is(.dark *) {
--tw-text-opacity:1;
color:rgb(251 207 232/var(--tw-text-opacity,1));
}
.dark\:text-pink-400:is(.dark *) {
--tw-text-opacity:1;
color:rgb(244 114 182/var(--tw-text-opacity,1));
}
.dark\:text-pink-500:is(.dark *) {
--tw-text-opacity:1;
color:rgb(236 72 153/var(--tw-text-opacity,1));
}
.dark\:text-pink-600:is(.dark *) {
--tw-text-opacity:1;
color:rgb(219 39 119/var(--tw-text-opacity,1));
}
.dark\:text-pink-800\/50:is(.dark *) {
color:rgba(157,23,77,.5);
}
.dark\:text-pink-900\/30:is(.dark *) {
color:rgba(131,24,67,.3);
}
.dark\:text-primary-400:is(.dark *) {
--tw-text-opacity:1;
color:rgb(96 165 250/var(--tw-text-opacity,1));
}
.dark\:text-purple-100:is(.dark *) {
--tw-text-opacity:1;
color:rgb(243 232 255/var(--tw-text-opacity,1));
}
.dark\:text-purple-200:is(.dark *) {
--tw-text-opacity:1;
color:rgb(233 213 255/var(--tw-text-opacity,1));
}
.dark\:text-purple-400:is(.dark *) {
--tw-text-opacity:1;
color:rgb(192 132 252/var(--tw-text-opacity,1));
}
.dark\:text-purple-500:is(.dark *) {
--tw-text-opacity:1;
color:rgb(168 85 247/var(--tw-text-opacity,1));
}
.dark\:text-purple-600:is(.dark *) {
--tw-text-opacity:1;
color:rgb(147 51 234/var(--tw-text-opacity,1));
}
.dark\:text-purple-800\/50:is(.dark *) {
color:rgba(107,33,168,.5);
}
.dark\:text-purple-900\/30:is(.dark *) {
color:rgba(88,28,135,.3);
}
.dark\:text-red-100:is(.dark *) {
--tw-text-opacity:1;
color:rgb(254 226 226/var(--tw-text-opacity,1));
}
.dark\:text-red-200:is(.dark *) {
--tw-text-opacity:1;
color:rgb(254 202 202/var(--tw-text-opacity,1));
}
.dark\:text-red-400:is(.dark *) {
--tw-text-opacity:1;
color:rgb(248 113 113/var(--tw-text-opacity,1));
}
.dark\:text-red-500:is(.dark *) {
--tw-text-opacity:1;
color:rgb(239 68 68/var(--tw-text-opacity,1));
}
.dark\:text-red-600:is(.dark *) {
--tw-text-opacity:1;
color:rgb(220 38 38/var(--tw-text-opacity,1));
}
.dark\:text-red-800\/50:is(.dark *) {
color:rgba(153,27,27,.5);
}
.dark\:text-red-900\/30:is(.dark *) {
color:rgba(127,29,29,.3);
}
.dark\:text-teal-100:is(.dark *) {
--tw-text-opacity:1;
color:rgb(204 251 241/var(--tw-text-opacity,1));
}
.dark\:text-teal-200:is(.dark *) {
--tw-text-opacity:1;
color:rgb(153 246 228/var(--tw-text-opacity,1));
}
.dark\:text-teal-400:is(.dark *) {
--tw-text-opacity:1;
color:rgb(45 212 191/var(--tw-text-opacity,1));
}
.dark\:text-teal-500:is(.dark *) {
--tw-text-opacity:1;
color:rgb(20 184 166/var(--tw-text-opacity,1));
}
.dark\:text-teal-600:is(.dark *) {
--tw-text-opacity:1;
color:rgb(13 148 136/var(--tw-text-opacity,1));
}
.dark\:text-teal-800\/50:is(.dark *) {
color:rgba(17,94,89,.5);
}
.dark\:text-teal-900\/30:is(.dark *) {
color:rgba(19,78,74,.3);
}
.dark\:text-white:is(.dark *) {
--tw-text-opacity:1;
color:rgb(255 255 255/var(--tw-text-opacity,1));
}
.dark\:text-yellow-100:is(.dark *) {
--tw-text-opacity:1;
color:rgb(254 249 195/var(--tw-text-opacity,1));
}
.dark\:text-yellow-200:is(.dark *) {
--tw-text-opacity:1;
color:rgb(254 240 138/var(--tw-text-opacity,1));
}
.dark\:text-yellow-400:is(.dark *) {
--tw-text-opacity:1;
color:rgb(250 204 21/var(--tw-text-opacity,1));
}
.dark\:text-yellow-500:is(.dark *) {
--tw-text-opacity:1;
color:rgb(234 179 8/var(--tw-text-opacity,1));
}
.dark\:text-yellow-600:is(.dark *) {
--tw-text-opacity:1;
color:rgb(202 138 4/var(--tw-text-opacity,1));
}
.dark\:text-yellow-800\/50:is(.dark *) {
color:rgba(133,77,14,.5);
}
.dark\:text-yellow-900\/30:is(.dark *) {
color:rgba(113,63,18,.3);
}
.dark\:opacity-10:is(.dark *) {
opacity:.1;
}
.progress-hover-blue:hover .dark\:bg-blue-500:is(.dark *) {
--tw-shadow:0 4px 6px -1px rgba(59,130,246,.3),0 2px 4px -1px rgba(59,130,246,.3);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -1px var(--tw-shadow-color);
box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
.progress-hover-green:hover .dark\:bg-green-500:is(.dark *) {
--tw-shadow:0 4px 6px -1px rgba(16,185,129,.3),0 2px 4px -1px rgba(16,185,129,.3);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -1px var(--tw-shadow-color);
box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
.progress-hover-purple:hover .dark\:bg-purple-500:is(.dark *) {
--tw-shadow:0 4px 6px -1px rgba(139,92,246,.3),0 2px 4px -1px rgba(139,92,246,.3);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -1px var(--tw-shadow-color);
box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
.progress-hover-red:hover .dark\:bg-red-500:is(.dark *) {
--tw-shadow:0 4px 6px -1px rgba(239,68,68,.3),0 2px 4px -1px rgba(239,68,68,.3);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -1px var(--tw-shadow-color);
box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
.dark\:hover\:border-primary-700:hover:is(.dark *) {
--tw-border-opacity:1;
border-color:rgb(29 78 216/var(--tw-border-opacity,1));
}
.dark\:hover\:bg-blue-100:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(219 234 254/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-blue-200:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(191 219 254/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-blue-400:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(96 165 250/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-blue-500:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(59 130 246/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-blue-600:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(37 99 235/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-blue-800\/50:hover:is(.dark *) {
background-color:rgba(30,64,175,.5);
}
.dark\:hover\:bg-blue-900\/30:hover:is(.dark *) {
background-color:rgba(30,58,138,.3);
}
.dark\:hover\:bg-gray-100:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(243 244 246/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-gray-200:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(229 231 235/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-gray-400:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(156 163 175/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-gray-500:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(107 114 128/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-gray-600:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(75 85 99/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-gray-700:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(55 65 81/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-gray-700\/50:hover:is(.dark *) {
background-color:rgba(55,65,81,.5);
}
.dark\:hover\:bg-gray-800\/50:hover:is(.dark *) {
background-color:rgba(31,41,55,.5);
}
.dark\:hover\:bg-gray-900\/30:hover:is(.dark *) {
background-color:rgba(17,24,39,.3);
}
.dark\:hover\:bg-green-100:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(220 252 231/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-green-200:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(187 247 208/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-green-400:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(74 222 128/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-green-500:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(34 197 94/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-green-600:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(22 163 74/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-green-800\/50:hover:is(.dark *) {
background-color:rgba(22,101,52,.5);
}
.dark\:hover\:bg-green-900\/30:hover:is(.dark *) {
background-color:rgba(20,83,45,.3);
}
.dark\:hover\:bg-indigo-100:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(224 231 255/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-indigo-200:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(199 210 254/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-indigo-400:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(129 140 248/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-indigo-500:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(99 102 241/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-indigo-600:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(79 70 229/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-indigo-800\/50:hover:is(.dark *) {
background-color:rgba(55,48,163,.5);
}
.dark\:hover\:bg-indigo-900\/30:hover:is(.dark *) {
background-color:rgba(49,46,129,.3);
}
.dark\:hover\:bg-orange-100:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(255 237 213/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-orange-200:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(254 215 170/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-orange-400:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(251 146 60/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-orange-500:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(249 115 22/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-orange-600:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(234 88 12/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-orange-800\/50:hover:is(.dark *) {
background-color:rgba(154,52,18,.5);
}
.dark\:hover\:bg-orange-900\/30:hover:is(.dark *) {
background-color:rgba(124,45,18,.3);
}
.dark\:hover\:bg-pink-100:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(252 231 243/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-pink-200:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(251 207 232/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-pink-400:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(244 114 182/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-pink-500:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(236 72 153/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-pink-600:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(219 39 119/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-pink-800\/50:hover:is(.dark *) {
background-color:rgba(157,23,77,.5);
}
.dark\:hover\:bg-pink-900\/30:hover:is(.dark *) {
background-color:rgba(131,24,67,.3);
}
.dark\:hover\:bg-purple-100:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(243 232 255/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-purple-200:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(233 213 255/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-purple-400:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(192 132 252/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-purple-500:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(168 85 247/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-purple-600:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(147 51 234/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-purple-800\/50:hover:is(.dark *) {
background-color:rgba(107,33,168,.5);
}
.dark\:hover\:bg-purple-900\/30:hover:is(.dark *) {
background-color:rgba(88,28,135,.3);
}
.dark\:hover\:bg-red-100:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(254 226 226/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-red-200:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(254 202 202/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-red-400:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(248 113 113/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-red-500:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(239 68 68/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-red-600:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(220 38 38/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-red-800\/50:hover:is(.dark *) {
background-color:rgba(153,27,27,.5);
}
.dark\:hover\:bg-red-900\/30:hover:is(.dark *) {
background-color:rgba(127,29,29,.3);
}
.dark\:hover\:bg-teal-100:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(204 251 241/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-teal-200:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(153 246 228/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-teal-400:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(45 212 191/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-teal-500:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(20 184 166/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-teal-600:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(13 148 136/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-teal-800\/50:hover:is(.dark *) {
background-color:rgba(17,94,89,.5);
}
.dark\:hover\:bg-teal-900\/30:hover:is(.dark *) {
background-color:rgba(19,78,74,.3);
}
.dark\:hover\:bg-yellow-100:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(254 249 195/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-yellow-200:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(254 240 138/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-yellow-400:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(250 204 21/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-yellow-500:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(234 179 8/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-yellow-600:hover:is(.dark *) {
--tw-bg-opacity:1;
background-color:rgb(202 138 4/var(--tw-bg-opacity,1));
}
.dark\:hover\:bg-yellow-800\/50:hover:is(.dark *) {
background-color:rgba(133,77,14,.5);
}
.dark\:hover\:bg-yellow-900\/30:hover:is(.dark *) {
background-color:rgba(113,63,18,.3);
}
.dark\:hover\:text-blue-100:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(219 234 254/var(--tw-text-opacity,1));
}
.dark\:hover\:text-blue-200:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(191 219 254/var(--tw-text-opacity,1));
}
.dark\:hover\:text-blue-300:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(147 197 253/var(--tw-text-opacity,1));
}
.dark\:hover\:text-blue-400:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(96 165 250/var(--tw-text-opacity,1));
}
.dark\:hover\:text-blue-500:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(59 130 246/var(--tw-text-opacity,1));
}
.dark\:hover\:text-blue-600:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(37 99 235/var(--tw-text-opacity,1));
}
.dark\:hover\:text-blue-800\/50:hover:is(.dark *) {
color:rgba(30,64,175,.5);
}
.dark\:hover\:text-blue-900\/30:hover:is(.dark *) {
color:rgba(30,58,138,.3);
}
.dark\:hover\:text-gray-100:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(243 244 246/var(--tw-text-opacity,1));
}
.dark\:hover\:text-gray-200:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(229 231 235/var(--tw-text-opacity,1));
}
.dark\:hover\:text-gray-400:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(156 163 175/var(--tw-text-opacity,1));
}
.dark\:hover\:text-gray-500:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(107 114 128/var(--tw-text-opacity,1));
}
.dark\:hover\:text-gray-600:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(75 85 99/var(--tw-text-opacity,1));
}
.dark\:hover\:text-gray-800\/50:hover:is(.dark *) {
color:rgba(31,41,55,.5);
}
.dark\:hover\:text-gray-900\/30:hover:is(.dark *) {
color:rgba(17,24,39,.3);
}
.dark\:hover\:text-green-100:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(220 252 231/var(--tw-text-opacity,1));
}
.dark\:hover\:text-green-200:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(187 247 208/var(--tw-text-opacity,1));
}
.dark\:hover\:text-green-400:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(74 222 128/var(--tw-text-opacity,1));
}
.dark\:hover\:text-green-500:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(34 197 94/var(--tw-text-opacity,1));
}
.dark\:hover\:text-green-600:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(22 163 74/var(--tw-text-opacity,1));
}
.dark\:hover\:text-green-800\/50:hover:is(.dark *) {
color:rgba(22,101,52,.5);
}
.dark\:hover\:text-green-900\/30:hover:is(.dark *) {
color:rgba(20,83,45,.3);
}
.dark\:hover\:text-indigo-100:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(224 231 255/var(--tw-text-opacity,1));
}
.dark\:hover\:text-indigo-200:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(199 210 254/var(--tw-text-opacity,1));
}
.dark\:hover\:text-indigo-400:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(129 140 248/var(--tw-text-opacity,1));
}
.dark\:hover\:text-indigo-500:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(99 102 241/var(--tw-text-opacity,1));
}
.dark\:hover\:text-indigo-600:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(79 70 229/var(--tw-text-opacity,1));
}
.dark\:hover\:text-indigo-800\/50:hover:is(.dark *) {
color:rgba(55,48,163,.5);
}
.dark\:hover\:text-indigo-900\/30:hover:is(.dark *) {
color:rgba(49,46,129,.3);
}
.dark\:hover\:text-orange-100:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(255 237 213/var(--tw-text-opacity,1));
}
.dark\:hover\:text-orange-200:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(254 215 170/var(--tw-text-opacity,1));
}
.dark\:hover\:text-orange-400:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(251 146 60/var(--tw-text-opacity,1));
}
.dark\:hover\:text-orange-500:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(249 115 22/var(--tw-text-opacity,1));
}
.dark\:hover\:text-orange-600:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(234 88 12/var(--tw-text-opacity,1));
}
.dark\:hover\:text-orange-800\/50:hover:is(.dark *) {
color:rgba(154,52,18,.5);
}
.dark\:hover\:text-orange-900\/30:hover:is(.dark *) {
color:rgba(124,45,18,.3);
}
.dark\:hover\:text-pink-100:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(252 231 243/var(--tw-text-opacity,1));
}
.dark\:hover\:text-pink-200:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(251 207 232/var(--tw-text-opacity,1));
}
.dark\:hover\:text-pink-400:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(244 114 182/var(--tw-text-opacity,1));
}
.dark\:hover\:text-pink-500:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(236 72 153/var(--tw-text-opacity,1));
}
.dark\:hover\:text-pink-600:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(219 39 119/var(--tw-text-opacity,1));
}
.dark\:hover\:text-pink-800\/50:hover:is(.dark *) {
color:rgba(157,23,77,.5);
}
.dark\:hover\:text-pink-900\/30:hover:is(.dark *) {
color:rgba(131,24,67,.3);
}
.dark\:hover\:text-primary-300:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(147 197 253/var(--tw-text-opacity,1));
}
.dark\:hover\:text-primary-400:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(96 165 250/var(--tw-text-opacity,1));
}
.dark\:hover\:text-purple-100:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(243 232 255/var(--tw-text-opacity,1));
}
.dark\:hover\:text-purple-200:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(233 213 255/var(--tw-text-opacity,1));
}
.dark\:hover\:text-purple-400:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(192 132 252/var(--tw-text-opacity,1));
}
.dark\:hover\:text-purple-500:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(168 85 247/var(--tw-text-opacity,1));
}
.dark\:hover\:text-purple-600:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(147 51 234/var(--tw-text-opacity,1));
}
.dark\:hover\:text-purple-800\/50:hover:is(.dark *) {
color:rgba(107,33,168,.5);
}
.dark\:hover\:text-purple-900\/30:hover:is(.dark *) {
color:rgba(88,28,135,.3);
}
.dark\:hover\:text-red-100:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(254 226 226/var(--tw-text-opacity,1));
}
.dark\:hover\:text-red-200:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(254 202 202/var(--tw-text-opacity,1));
}
.dark\:hover\:text-red-400:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(248 113 113/var(--tw-text-opacity,1));
}
.dark\:hover\:text-red-500:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(239 68 68/var(--tw-text-opacity,1));
}
.dark\:hover\:text-red-600:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(220 38 38/var(--tw-text-opacity,1));
}
.dark\:hover\:text-red-800\/50:hover:is(.dark *) {
color:rgba(153,27,27,.5);
}
.dark\:hover\:text-red-900\/30:hover:is(.dark *) {
color:rgba(127,29,29,.3);
}
.dark\:hover\:text-teal-100:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(204 251 241/var(--tw-text-opacity,1));
}
.dark\:hover\:text-teal-200:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(153 246 228/var(--tw-text-opacity,1));
}
.dark\:hover\:text-teal-400:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(45 212 191/var(--tw-text-opacity,1));
}
.dark\:hover\:text-teal-500:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(20 184 166/var(--tw-text-opacity,1));
}
.dark\:hover\:text-teal-600:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(13 148 136/var(--tw-text-opacity,1));
}
.dark\:hover\:text-teal-800\/50:hover:is(.dark *) {
color:rgba(17,94,89,.5);
}
.dark\:hover\:text-teal-900\/30:hover:is(.dark *) {
color:rgba(19,78,74,.3);
}
.dark\:hover\:text-yellow-100:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(254 249 195/var(--tw-text-opacity,1));
}
.dark\:hover\:text-yellow-200:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(254 240 138/var(--tw-text-opacity,1));
}
.dark\:hover\:text-yellow-400:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(250 204 21/var(--tw-text-opacity,1));
}
.dark\:hover\:text-yellow-500:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(234 179 8/var(--tw-text-opacity,1));
}
.dark\:hover\:text-yellow-600:hover:is(.dark *) {
--tw-text-opacity:1;
color:rgb(202 138 4/var(--tw-text-opacity,1));
}
.dark\:hover\:text-yellow-800\/50:hover:is(.dark *) {
color:rgba(133,77,14,.5);
}
.dark\:hover\:text-yellow-900\/30:hover:is(.dark *) {
color:rgba(113,63,18,.3);
}
.progress-hover-blue:hover .dark\:hover\:bg-blue-500:hover:is(.dark *) {
--tw-shadow:0 4px 6px -1px rgba(59,130,246,.3),0 2px 4px -1px rgba(59,130,246,.3);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -1px var(--tw-shadow-color);
box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
.progress-hover-green:hover .dark\:hover\:bg-green-500:hover:is(.dark *) {
--tw-shadow:0 4px 6px -1px rgba(16,185,129,.3),0 2px 4px -1px rgba(16,185,129,.3);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -1px var(--tw-shadow-color);
box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
.progress-hover-purple:hover .dark\:hover\:bg-purple-500:hover:is(.dark *) {
--tw-shadow:0 4px 6px -1px rgba(139,92,246,.3),0 2px 4px -1px rgba(139,92,246,.3);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -1px var(--tw-shadow-color);
box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
.progress-hover-red:hover .dark\:hover\:bg-red-500:hover:is(.dark *) {
--tw-shadow:0 4px 6px -1px rgba(239,68,68,.3),0 2px 4px -1px rgba(239,68,68,.3);
--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color),0 2px 4px -1px var(--tw-shadow-color);
box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
@media (min-width:640px) {
.sm\:mb-4 {
margin-bottom:1rem;
}
.sm\:mb-6 {
margin-bottom:1.5rem;
}
.sm\:ml-2 {
margin-left:.5rem;
}
.sm\:mr-2 {
margin-right:.5rem;
}
.sm\:mt-0 {
margin-top:0;
}
.sm\:h-32 {
height:8rem;
}
.sm\:h-56 {
height:14rem;
}
.sm\:h-8 {
height:2rem;
}
.sm\:h-auto {
height:auto;
}
.sm\:w-44 {
width:11rem;
}
.sm\:w-80 {
width:20rem;
}
.sm\:max-w-xs {
max-width:20rem;
}
.sm\:flex-row {
flex-direction:row;
}
.sm\:items-center {
align-items:center;
}
.sm\:gap-4 {
gap:1rem;
}
.sm\:space-x-10>:not([hidden])~:not([hidden]) {
--tw-space-x-reverse:0;
margin-left:calc(2.5rem*(1 - var(--tw-space-x-reverse)));
margin-right:calc(2.5rem*var(--tw-space-x-reverse));
}
.sm\:p-3 {
padding:.75rem;
}
.sm\:p-3\.5 {
padding:.875rem;
}
.sm\:p-4 {
padding:1rem;
}
.sm\:p-5 {
padding:1.25rem;
}
.sm\:p-6 {
padding:1.5rem;
}
.sm\:px-4 {
padding-left:1rem;
padding-right:1rem;
}
.sm\:py-3 {
padding-bottom:.75rem;
padding-top:.75rem;
}
.sm\:text-2xl {
font-size:1.5rem;
line-height:2rem;
}
.sm\:text-sm {
font-size:.875rem;
line-height:1.25rem;
}
.sm\:text-xl {
font-size:1.25rem;
line-height:1.75rem;
}
}
@media (min-width:768px) {
.md\:right-6 {
right:1.5rem;
}
.md\:top-24 {
top:6rem;
}
.md\:mb-0 {
margin-bottom:0;
}
.md\:block {
display:block;
}
.md\:flex {
display:flex;
}
.md\:hidden {
display:none;
}
.md\:h-64 {
height:16rem;
}
.md\:min-h-\[2\.5rem\] {
min-height:2.5rem;
}
.md\:min-h-\[3rem\] {
min-height:3rem;
}
.md\:max-w-sm {
max-width:24rem;
}
.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-row {
flex-direction:row;
}
.md\:justify-end {
justify-content:flex-end;
}
.md\:px-6 {
padding-left:1.5rem;
padding-right:1.5rem;
}
.md\:text-right {
text-align:right;
}
.md\:text-3xl {
font-size:1.875rem;
line-height:2.25rem;
}
.md\:text-sm {
font-size:.875rem;
line-height:1.25rem;
}
.md\:text-xl {
font-size:1.25rem;
line-height:1.75rem;
}
}
@media (min-width:1024px) {
.lg\:block {
display:block;
}
.lg\:h-72 {
height:18rem;
}
.lg\:w-64 {
width:16rem;
}
.lg\:w-80 {
width:20rem;
}
.lg\:max-w-sm {
max-width:24rem;
}
.lg\:flex-row {
flex-direction:row;
}
.lg\:items-start {
align-items:flex-start;
}
.lg\:text-2xl {
font-size:1.5rem;
line-height:2rem;
}
}
@media (min-width:1280px) {
.xl\:max-w-sm {
max-width:24rem;
}
}
/*
Theme Name: Supreme
Description: 现代化博客主题 - 毛玻璃效果、暗色模式、响应式设计
Version: 1.0.0
Author: Supreme Team
*/
:root {
    --transition-speed: 0.3s;
    /* 主题强调色（Joe 思路：当字重差异不明显时，用主题色让加粗文字跳出来） */
    --theme: #3b82f6;
}
:root.dark {
    --theme: #60a5fa;
}
/* 防止横竖屏切换时浏览器自动放大文字 */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}
/* 正文斜体（em / i）显式声明 italic 并允许字体合成倾斜。
   中文等无斜体字模的字体默认不会倾斜，必须 font-synthesis 才能看到斜体，
   否则前台 <em> 会被渲染成正体，表现为「后台斜体、前台不斜」。 */
.post-content em,
.post-content i {
    font-style: italic;
    font-synthesis: style;
}
/* 仅PC端预留滚动条位置，避免刷新时内容横向跳动；
   移动端不启用，防止部分浏览器预留右侧空隙导致页面整体偏左 */
@media (min-width: 769px) {
html {
        scrollbar-gutter: stable;
}
}
/* 防止内容横向溢出导致页面左右抖动 */
html, body {
    overflow-x: hidden;
    /* weight style：允许浏览器合成「粗体」与「斜体」。
       之前只写 weight 会禁用斜体合成——中文无斜体字模时 <em> 会被渲染成正体，
       表现为「后台斜体、前台不斜」。 */
    font-synthesis: weight style;
}
/* 对 <strong>/<b> 使用当前字体可提供的最大字重（多字重字体用 Black/Heavy，
   单字重黑体则使用最浓的伪粗体），并叠加主题强调色（Joe 思路：字重不够时靠颜色区分），
   让英文加粗在各种字体下都清晰可辨 */
strong, b {
    font-weight: 900;
    color: var(--theme);
}
body, a, button, input, select, textarea, label, [role="button"] {
    touch-action: manipulation;
}
/* 移除移动端点击高亮，避免点击时的视觉跳动 */
* {
    -webkit-tap-highlight-color: transparent;
}
@media (max-width: 768px) {
/* 表单元素字号不小于 16px，避免 iOS 聚焦输入框时自动放大页面 */
input, select, textarea {
        font-size: 16px !important;
}
/* iOS 对 background-attachment: fixed 支持不佳，改为 scroll 避免滚动卡顿抖动 */
.bg-pattern {
        background-attachment: scroll;
}
}
/* 触屏设备（无 hover 能力）：禁用 transform 类悬停效果，避免点击后效果残留卡住 */
@media (hover: none), (pointer: coarse) {
.glass-card:hover,
    .glass-card:hover img.avatar,
    .sidebar-item:hover,
    .float-animation:hover,
    .page-navigator li a:hover {
        transform: none;
}
}
@media (prefers-reduced-motion: reduce) {
*,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
}
}
/* 标签浮动动画 */
@keyframes float {

    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-5px);
    }

}
.float-animation {
    display: inline-block;
    animation: float 3s ease-in-out infinite;
    transition: all 0.3s ease;
}
/* 不同的延迟时间，让标签浮动错开 */
.float-delay-0 {
    animation-delay: 0s;
}
.float-delay-1 {
    animation-delay: 0.2s;
}
.float-delay-2 {
    animation-delay: 0.4s;
}
.float-delay-3 {
    animation-delay: 0.6s;
}
.float-delay-4 {
    animation-delay: 0.8s;
}
.float-delay-5 {
    animation-delay: 1s;
}
.float-delay-6 {
    animation-delay: 1.2s;
}
.float-delay-7 {
    animation-delay: 1.4s;
}
.float-animation:hover {
    animation-play-state: paused;
    transform: scale(1.05);
    z-index: 10;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
body {
    line-height:inherit;
    margin:0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
    transition: background-color var(--transition-speed) ease;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    /* 适配移动端地址栏收起/展开，避免视口高度变化引起页面跳动 */
    min-height: 100dvh;
}
/* 页脚始终在底部 */
main {
    flex: 1 0 auto;
}
footer {
    flex-shrink: 0;
}
.glass-effect {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.2);
    transition: all var(--transition-speed) ease;
}
.dark .glass-effect {
    background: rgba(15, 23, 42, 0.65);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.3);
}
.dark .glass-card {
    background: rgba(15, 23, 42, 0.85);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.3);
}
.glass-footer {
    background: rgba(255, 255, 255, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.1);
}
.dark .glass-footer {
    background: rgba(15, 23, 42, 0.65);
    border: 1px solid rgba(255, 255, 255, 0.05);
}
/* 备案号图标：与文字同高、自适应浅色/深色模式 */
.beian-icon {
    width: auto;
    height: 1.3em;
    margin-right: 0.4em;
    vertical-align: -0.3em;
    display: inline-block;
    object-fit: contain;
    transition: filter 0.3s ease;
}
.dark .beian-icon {
    filter: brightness(1.15) contrast(0.95);
}
@media (max-width: 768px) {
.beian-icon {
        height: 1.2em;
        margin-right: 0.35em;
        vertical-align: -0.25em;
}
}
.glass-card {
    background: rgba(255, 255, 255, 0.55);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.25);
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.15);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.glass-card:hover {
    transform: translateY(-5px) scale(1.02);
    box-shadow: 0 12px 40px 0 rgba(31, 38, 135, 0.25);
    border-color: rgba(0, 115, 245, 0.3);
}
.dark .glass-card:hover {
    box-shadow: 0 12px 40px 0 rgba(31, 38, 135, 0.4);
    border-color: rgba(0, 115, 245, 0.5);
}
/* 文章卡片内元素的交互效果 */
.glass-card h3 {
    transition: color 0.3s ease;
}
.glass-card:hover h3 {
    color: var(--primary-500);
}
.glass-card p {
    transition: color 0.3s ease;
}
.glass-card:hover p {
    color: var(--text-primary);
}
/* 文章卡片内的图标和按钮效果 */
.glass-card .flex.items-center.text-gray-500 {
    transition: opacity 0.3s ease;
}
.glass-card:hover .flex.items-center.text-gray-500 {
    opacity: 1;
}
.glass-card img.avatar {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.glass-card:hover img.avatar {
    transform: scale(1.1);
    box-shadow: 0 0 0 3px rgba(0, 115, 245, 0.3);
}
.sidebar-item {
    transition: all 0.2s ease;
}
.sidebar-item:hover {
    transform: translateX(5px);
}
.mobile-menu {
    transform: translateX(-100%);
    transition: transform 0.3s ease-in-out;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}
.dark .mobile-menu {
    background: rgba(15, 23, 42, 0.7);
    border-right: 1px solid rgba(255, 255, 255, 0.05);
}
.mobile-menu.active {
    transform: translateX(0);
}
.bg-pattern {
    background-image: url('https://free.picui.cn/free/2025/11/02/6906ffe8e529f.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}
.dark .bg-pattern {
    background-image: url('https://free.picui.cn/free/2025/10/04/68e0c7a4eaed9.jpg');
}
.social-icon::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(0, 115, 245, 0.3);
    transform: translate(-50%, -50%);
    transition: width 0.6s, height 0.6s;
    z-index: -1;
}
.social-icon:active::after {
    width: 300px;
    height: 300px;
}
@keyframes socialFadeIn {

    from {
        opacity: 0;
        transform: translateY(20px) scale(0.8);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }

}
.social-icon {
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    animation: socialFadeIn 0.6s ease forwards;
    opacity: 0;
}
.social-icon:nth-child(1) {
    animation-delay: 0.1s;
}
.social-icon:nth-child(2) {
    animation-delay: 0.2s;
}
.social-icon:nth-child(3) {
    animation-delay: 0.3s;
}
.social-icon:nth-child(4) {
    animation-delay: 0.4s;
}
.nav-scrolled {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
.dark .nav-scrolled {
    background: rgba(15, 23, 42, 0.85);
}
@keyframes fadeIn {

    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }

}
@keyframes slideUp {

    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }

}
.fade-in {
    animation: fadeIn 0.6s ease forwards;
}
.slide-up {
    animation: slideUp 0.6s ease forwards;
}
.modal {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}
.modal.active {
    opacity: 1;
    visibility: visible;
}
.modal-content {
    transform: scale(0.9);
    transition: transform 0.3s ease;
}
.modal.active .modal-content {
    transform: scale(1);
}
::-webkit-scrollbar {
    width: 5px;
}
::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb {
    background: rgba(0, 115, 245, 0.5);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 115, 245, 0.7);
}
.dark ::-webkit-scrollbar-track {
    background: rgba(15, 23, 42, 0.3);
}
.dark ::-webkit-scrollbar-thumb {
    background: rgba(0, 115, 245, 0.3);
}
.dark ::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 115, 245, 0.5);
}
@media (max-width: 768px) {
.glass-card {
        background: rgba(255, 255, 255, 0.7);
}
.dark .glass-card {
        background: rgba(15, 23, 42, 0.9);
}
}
/* 确保侧边栏宽度一致 */
.desktop-sidebar,
.desktop-rightbar {
    width: 100%;
}
@media (min-width: 1024px) {
.desktop-sidebar,
    .desktop-rightbar {
        width: 16rem;
        flex-shrink: 0;
}
}
.flex-1.min-w-0 {
    overflow-wrap: break-word;
}
/* 确保文章卡片网格对齐 */
.grid.grid-cols-1.md\:grid-cols-2 {
    align-items: stretch;
}
.grid.grid-cols-1.md\:grid-cols-2 > .glass-card {
    display: flex;
    flex-direction: column;
}
/* 侧边栏卡片间距统一 */
.desktop-sidebar .glass-card,
.desktop-rightbar .glass-card {
    margin-bottom: 1.5rem;
}
.desktop-sidebar .glass-card:last-child,
.desktop-rightbar .glass-card:last-child {
    margin-bottom: 0;
}
.stat-progress-item:active {
  transform: scale(0.98);
}
.stat-progress-item:hover .bg-blue-500 {
  box-shadow: 0 4px 6px -1px rgba(59, 130, 246, 0.3), 0 2px 4px -1px rgba(59, 130, 246, 0.3);
}
.stat-progress-item:hover .bg-green-500 {
  box-shadow: 0 4px 6px -1px rgba(16, 185, 129, 0.3), 0 2px 4px -1px rgba(16, 185, 129, 0.3);
}
.stat-progress-item:hover .bg-purple-500 {
  box-shadow: 0 4px 6px -1px rgba(139, 92, 246, 0.3), 0 2px 4px -1px rgba(139, 92, 246, 0.3);
}
.stat-progress-item:hover .bg-red-500 {
  box-shadow: 0 4px 6px -1px rgba(239, 68, 68, 0.3), 0 2px 4px -1px rgba(239, 68, 68, 0.3);
}
/* ============================================================
   Typecho 文章内容样式
   ============================================================ */
.post-content {
    line-height: 1.8;
    color: inherit;
}
/* 6 级标题差异化样式（与 SpEdit 编辑器预览保持一致：字号层级 + 主题色专属装饰） */
body .post-content h1,
body .post-content h2,
body .post-content h3,
body .post-content h4,
body .post-content h5,
body .post-content h6 {
    position: relative;
    color: var(--main, #303133);
    line-height: 1.35;
    font-weight: 700;
    margin: 18px 0 12px;
}
/* h1：最大号 + 主色 # 前缀 + 底部主题色分隔线 */
body .post-content h1 {
    font-size: 28px;
    padding: 0 0 8px;
    border-bottom: 2px solid var(--theme);
}
body .post-content h1::before {
    content: "# ";
    color: var(--theme);
    font-weight: 800;
}
body .post-content h2 {
    font-size: 23px;
    padding: 0 14px;
}
body .post-content h2::before {
    content: "";
    position: absolute;
    top: 8%;
    bottom: 8%;
    left: 0;
    width: 5px;
    border-radius: 3px;
    background: var(--theme);
}
body .post-content h3 {
    font-size: 20px;
    padding: 0 14px;
}
body .post-content h3::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 4px;
    background: var(--theme);
    border-radius: 0 4px 4px 0;
}
body .post-content h4 {
    font-size: 18px;
}
body .post-content h4::before {
    content: "\300C";
    color: var(--theme);
    font-weight: 700;
    margin-right: 4px;
}
body .post-content h4::after {
    content: "\300D";
    color: var(--theme);
    font-weight: 700;
    margin-left: 4px;
}
/* h5：主题色实心菱形标记 */
body .post-content h5 {
    font-size: 16px;
    padding: 0 0 0 22px;
}
body .post-content h5::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 4px;
    width: 9px;
    height: 9px;
    background: var(--theme);
    border-radius: 2px;
    transform: translateY(-50%) rotate(45deg);
}
/* h6：胶囊标签（浅底主色文字，最小号；display:table 收缩到内容宽度且独占一行） */
body .post-content h6 {
    font-size: 14px;
    display: table;
    padding: 3px 12px;
    color: var(--theme);
    background: color-mix(in srgb, var(--theme) 14%, transparent);
    border-radius: 999px;
    margin: 14px 0 10px;
}
/* 正文加粗：用当前字体可用的最大字重 900 + 主题强调色，让编辑器里的加粗文字
   在已发布文章中清晰可辨。已改用系统默认字体，粗体由系统字体原生提供；
   若个别系统字体缺 900 字重，html,body 上的 font-synthesis: weight 仍会合成
   更重的伪粗体，保证加粗效果稳定可见。 */
body .post-content strong,
body .post-content b {
    font-weight: 900;
    color: var(--theme);
}
.post-content h1 {
    font-size: 1.8em;
}
.post-content h2 {
    font-size: 1.5em;
}
.post-content h3 {
    font-size: 1.3em;
}
.post-content h4 {
    font-size: 1.1em;
}
.post-content p {
    margin-bottom: 1em;
}
.post-content a {
    color: #3b82f6;
    text-decoration: underline;
    transition: color 0.2s;
}
.post-content a:hover {
    color: #2563eb;
}
.dark .post-content a {
    color: #60a5fa;
}
.dark .post-content a:hover {
    color: #93c5fd;
}
.post-content img:not([class]) {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    /* Joe 风格：不掺 margin，间距由段落控制 */
    border-radius: 8px;
    cursor: zoom-in;
    transition: transform .35s ease, box-shadow .35s ease;
}
.post-content img:not([class]):hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px -8px var(--theme, rgba(59, 130, 246, .35));
}
/* 包含图的段落清零 margin-bottom，避免与下方文字段 margin-top collapse 出 16+16=16，
   视觉上叠加 img line-box 撑高看着"图→文字"间距过大。
   段落顶端保留默认 margin-top，所以"文字→图"节奏仍由文字段 margin-bottom(16) + 图段 margin-top(16) collapse = 16px 主导。
   注意：这里 .post-content p { margin-bottom: 1em } 特异性 (0,1,1) = .post-content p:has(img) (0,2,1) 不冲突，
   反而是 :has 选择器更高，所以含图段落能正确清零。 */
.post-content p:has(img) {
    margin-bottom: 0;
}
/* 核心：相邻两张图时把第二张图轻微上移（图-图 ~8px），不动字图/图字（仍 16px）。
   数学（Joe 节奏 16px 基础上）：
     - 文字 → 图：文字段 margin-bottom(16) collapse + img margin-top(0) = 16px
     - 图 → 文字：img margin-bottom(0) + 文字段 margin-top(16) = 16px
     - 图 → 图：图段 collapse(16) + img1 margin-bottom(0) + img2 margin-top(-8) = 8px ✓ */
.post-content img + img {
    margin-top: -8px;
}
/* 防御：部分文章是 <figure><img></figure>，给 figure 也居中以保持视觉一致 */
.post-content figure {
    margin: 1em auto;
    text-align: center;
}
.post-content figure img {
    display: inline-block;
    width: auto;
    max-width: 100%;
    height: auto;
    margin: 0;
}
.post-content figcaption {
    margin-top: .5em;
    font-size: .875em;
    color: #6b7280;
    text-align: center;
}
.dark .post-content figcaption {
    color: #9ca3af;
}
.post-content blockquote {
    border-left: 4px solid #3b82f6;
    padding: 0.5em 1em;
    margin: 1em 0;
    background: rgba(59, 130, 246, 0.05);
    border-radius: 0 8px 8px 0;
}
.dark .post-content blockquote {
    background: rgba(59, 130, 246, 0.1);
}
/* 仅在高亮关闭（pre 无 language- 类）时作为兜底，高亮开启后由选中的 Prism 主题接管 */
.post-content pre:not([class*="language-"]) {
    background: #1e293b;
    color: #e2e8f0;
    padding: 1em;
    border-radius: 8px;
    overflow-x: auto;
    margin: 1em 0;
    font-size: 0.9em;
}
.post-content code {
    background: rgba(59, 130, 246, 0.1);
    padding: 0.15em 0.4em;
    border-radius: 4px;
    font-size: 0.9em;
}
.post-content pre:not([class*="language-"]) code {
    background: none;
    padding: 0;
}
/* ============================================================
   代码块容器（macOS 窗口 + 复制按钮图标化，对所有高亮主题通用）
   ============================================================ */
.post-content .code-window {
    position: relative;
    background: transparent;
    border-radius: 10px;
    overflow: hidden;
    margin: 1em 0;
    /* 去掉容器投影，避免各浅色/条纹主题（如 Twilight）底部出现阴影 */
    box-shadow: none;
}
.post-content .code-window-header {
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 12px;
    background: #252526;
    border-bottom: 1px solid #333;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.post-content .code-window-dots {
    display: flex;
    gap: 6px;
}
.post-content .code-window-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}
.post-content .code-window-dot-red {
    background: #ff5f56;
}
.post-content .code-window-dot-yellow {
    background: #ffbd2e;
}
.post-content .code-window-dot-green {
    background: #27c93f;
}
.post-content .code-window-lang {
    font-size: 11px;
    color: #858585;
    text-transform: uppercase;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
/* 标题栏右侧：语言标签 + 复制按钮（内联 SVG 图标，不依赖 prism-toolbar 插件，彻底无 Copy/Copied! 文字泄漏） */
.post-content .code-window-meta {
    display: flex;
    align-items: center;
    gap: 10px;
}
.post-content .code-window-copy {
    background: transparent;
    border: 0;
    color: #858585;
    font-size: 18px;
    padding: 4px;
    cursor: pointer;
    transition: color 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}
.post-content .code-window-copy svg {
    width: 1em;
    height: 1em;
    display: block;
}
.post-content .code-window-copy:hover {
    color: #fff;
}
/* 代码块内滚动条：统一变细，避免移动端出现粗大滚动条；
   用多选择器 + !important 强制覆盖全局蓝色滚动条（style.css 顶部 ::-webkit-scrollbar-thumb 蓝色规则），
   并改用中性灰色 thumb，使各深色主题底部不再出现蓝色条。 */
.post-content .code-window pre::-webkit-scrollbar,
.post-content .code-window pre[class*="language-"]::-webkit-scrollbar,
.post-content .code-window pre.line-numbers::-webkit-scrollbar {
    height: 6px;
    width: 6px;
}
.post-content .code-window pre::-webkit-scrollbar-track,
.post-content .code-window pre[class*="language-"]::-webkit-scrollbar-track,
.post-content .code-window pre.line-numbers::-webkit-scrollbar-track {
    background: transparent !important;
}
.post-content .code-window pre::-webkit-scrollbar-thumb,
.post-content .code-window pre[class*="language-"]::-webkit-scrollbar-thumb,
.post-content .code-window pre.line-numbers::-webkit-scrollbar-thumb {
    background: rgba(128, 128, 128, 0.35) !important;
    border-radius: 3px;
}
.post-content .code-window pre::-webkit-scrollbar-thumb:hover,
.post-content .code-window pre[class*="language-"]::-webkit-scrollbar-thumb:hover,
.post-content .code-window pre.line-numbers::-webkit-scrollbar-thumb:hover {
    background: rgba(128, 128, 128, 0.55) !important;
}
.post-content .code-window pre {
    scrollbar-width: thin;
    scrollbar-color: rgba(128, 128, 128, 0.35) transparent;
}
@media (max-width: 640px) {
.post-content .code-window {
        border-radius: 8px;
        margin: 0.75em 0;
}
.post-content .code-window-header {
        height: 34px;
        padding: 0 10px;
}
.post-content .code-window-dot {
        width: 8px;
        height: 8px;
}
.post-content .code-window-dots {
        gap: 5px;
}
.post-content .code-window-lang {
        font-size: 10px;
}
.post-content .code-window-meta {
        gap: 8px;
}
.post-content .code-window-copy {
        font-size: 16px;
}
.post-content .code-window pre::-webkit-scrollbar,
    .post-content .code-window pre[class*="language-"]::-webkit-scrollbar,
    .post-content .code-window pre.line-numbers::-webkit-scrollbar {
        height: 3px;
        width: 3px;
}
.post-content .code-window pre::-webkit-scrollbar-thumb,
    .post-content .code-window pre[class*="language-"]::-webkit-scrollbar-thumb,
    .post-content .code-window pre.line-numbers::-webkit-scrollbar-thumb {
        background: rgba(128, 128, 128, 0.35) !important;
}
.post-content .code-window pre {
        font-size: 0.8em !important;
}
}
.post-content ul,
.post-content ol {
    padding-left: 1.5em;
    margin-bottom: 1em;
}
.post-content ul li {
    list-style: disc;
    margin-bottom: 0.3em;
}
.post-content ol li {
    list-style: decimal;
    margin-bottom: 0.3em;
}
/* 文章正文任务列表：与前台编辑器预览(.speos_checkbox)保持完全一致
   短代码 {x}/{ } 由 short.php 输出；markdown 任务符 ☐/☑ 由 features.js 的 JS 替换成同一 class */
.post-content .speos_checkbox,
.post-content .speos-task-checkbox {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
    display: inline-block;
    width: 15px;
    height: 15px;
    min-width: 15px;
    min-height: 15px;
    border: 2px solid #409eff;
    border-radius: 2px;
    background: transparent;
    vertical-align: -3px;
    margin: 0 0.3em 0 0;
    padding: 0;
    cursor: default;
    flex-shrink: 0;
    box-sizing: border-box;
}
.post-content .speos_checkbox:disabled,
.post-content .speos-task-checkbox:disabled {
    cursor: not-allowed;
}
.post-content .speos_checkbox:checked,
.post-content .speos-task-checkbox:checked {
    border: none;
    background: #409eff;
}
.post-content .speos_checkbox:checked::after,
.post-content .speos-task-checkbox:checked::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 4px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: translate(-50%, -60%) rotate(45deg);
    box-sizing: border-box;
}
.post-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 1em 0;
}
.post-content th,
.post-content td {
    border: 1px solid rgba(148, 163, 184, 0.3);
    padding: 0.5em 0.75em;
    text-align: left;
}
.post-content th {
    background: rgba(59, 130, 246, 0.1);
    font-weight: 600;
}
.dark .post-content th {
    background: rgba(59, 130, 246, 0.15);
}
.post-content hr {
    border: none;
    border-top: 1px solid rgba(148, 163, 184, 0.3);
    margin: 1.5em 0;
}
.page-navigator {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    padding: 0;
    margin: 0;
}
.page-navigator li a,
.page-navigator li span {
    padding: 6px 12px;
    border-radius: 6px;
    font-size: 14px;
    transition: all 0.2s;
}
.page-navigator li a {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.25);
    color: inherit;
}
.dark .page-navigator li a {
    background: rgba(15, 23, 42, 0.85);
    border: 1px solid rgba(255, 255, 255, 0.12);
}
.page-navigator li a:hover {
    background: rgba(255, 255, 255, 0.8);
    transform: translateY(-1px);
}
.dark .page-navigator li a:hover {
    background: rgba(15, 23, 42, 0.95);
}
.page-navigator li.current span,
.page-navigator li.current a {
    background: #3b82f6;
    color: #fff;
    border: none;
}
/* ============================================================
   Typecho 标签样式
   ============================================================ */
.post-content .tags a,
.tag-list a {
    display: inline-block;
    background: rgba(59, 130, 246, 0.1);
    color: #3b82f6;
    padding: 2px 10px;
    border-radius: 9999px;
    font-size: 12px;
    margin: 2px;
    transition: all 0.2s;
}
.post-content .tags a:hover,
.tag-list a:hover {
    background: rgba(59, 130, 246, 0.2);
}
.dark .post-content .tags a,
.dark .tag-list a {
    background: rgba(59, 130, 246, 0.15);
    color: #60a5fa;
}
.dark .post-content .tags a:hover,
.dark .tag-list a:hover {
    background: rgba(59, 130, 246, 0.25);
}
.comment-emoji {
    display: inline-block;
    width: 1.25em;
    height: 1.25em;
    vertical-align: -0.25em;
    margin: 0 1px;
}
.comment-emoji-owo {
    width: auto;
    height: 1.4em;
    margin: 0 2px;
}
.comment-emoji-owo[src*="/aru/"] {
    height: 1.5em;
}
/* OwO/正文表情图（renderEmojis 输出）：全站常驻样式，原先在 shortcode.css，
 * 因 shortcode.css 已改为「正文含短代码才加载」，而评论区表情无法在模板期检测，
 * 故将这三段搬迁至此（与上方 comment-emoji 同类），保证评论/正文表情始终有样式 */
.owo_image {
    display: inline-block;
    width: 22px;
    height: 22px;
    object-fit: contain;
    vertical-align: -0.2em;
    margin: 0 2px;
}
.owo_image[src*="/aru/"] {
    width: auto;
    height: 1.5em;
    max-width: 100%;
}
.post-content p.owo-inline,
#comments p.owo-inline {
    display: inline;
    margin: 0;
    vertical-align: middle;
}
/* 文章标签与分享区 */
.speos_operate {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}
.speos_operate-tags {
    flex: 1;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px;
    overflow-x: auto;
}
.speos_operate-tags::-webkit-scrollbar {
    display: none;
}
.speos_operate-tags a {
    flex-shrink: 0;
    position: relative;
    font-size: 12px;
    background: rgba(59, 130, 246, 0.08);
    color: #4b5563;
    border: 1px solid rgba(59, 130, 246, 0.15);
    padding-right: 10px;
    padding-left: 28px;
    height: 26px;
    line-height: 24px;
    border-radius: 13px;
    max-width: 140px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: border 0.25s, color 0.25s, background 0.25s;
}
.speos_operate-tags a:hover {
    color: var(--theme);
    border-color: var(--theme);
    background: rgba(59, 130, 246, 0.12);
}
.speos_operate-tags a:last-child,
.speos_operate-tags a:nth-child(5) {
    margin-right: 0;
}
.speos_operate-tags a:nth-child(n+6) {
    display: none;
}
/* 移动端文章标签 ≥5 个（speos-tags-scroll 由 operate.php 内联 JS 判定添加）：
   解除「第 6 个起隐藏」，全部展示并沿用容器的 nowrap + overflow-x 横向滑动 */
.speos_operate-tags.speos-tags-scroll a:nth-child(n+6) {
    display: inline-block;
}
.speos_operate-tags a::before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 50%;
}
.speos_operate-tags a::after {
    content: '\f02e';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    top: 50%;
    left: 12px;
    transform: translate(-50%, -50%);
    font-size: 10px;
    color: var(--theme);
}
.dark .speos_operate-tags a {
    background: rgba(96, 165, 250, 0.1);
    color: #d1d5db;
    border-color: rgba(96, 165, 250, 0.2);
}
.dark .speos_operate-tags a::before {
    background: #1f2937;
}
.speos_operate-share {
    position: relative;
    flex-shrink: 0;
}
.speos_share-trigger {
    display: block;
    width: 30px;
    height: 30px;
    cursor: pointer;
    transition: transform 0.35s ease;
    border-radius: 50%;
    outline: none;
    box-shadow: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    user-select: none;
}
.speos_share-trigger:hover {
    transform: rotate(360deg) scale(1.15);
}
.speos_share-trigger:focus,
.speos_share-trigger:active {
    outline: none;
    box-shadow: none;
}
.speos_share-reach {
    position: absolute;
    z-index: 20;
    top: auto;
    right: 0;
    bottom: calc(100% + 6px);
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 6px;
    padding: 6px 8px;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 10px;
    box-shadow: 0 -6px 18px rgba(0, 0, 0, 0.08);
    visibility: hidden;
    opacity: 0;
    transform: translateY(-10px);
    transition: visibility 0.25s, opacity 0.25s, transform 0.25s;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}
.dark .speos_share-reach {
    background: rgba(31, 41, 55, 0.78);
    border-color: rgba(255, 255, 255, 0.08);
}
.speos_operate-share.active .speos_share-reach {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}
.speos_share-reach a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.04);
    transition: transform 0.2s ease, background-color 0.2s ease;
}
.speos_share-reach a:hover {
    transform: translateY(-2px);
    background: rgba(59, 130, 246, 0.12);
}
.speos_share-reach a .icon {
    width: 20px;
    height: 20px;
}
/* 海报分享弹窗 */
.speos_poster-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0, 0, 0, 0.55);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    backdrop-filter: blur(4px);
}
.speos_poster-modal.active {
    opacity: 1;
    visibility: visible;
}
.speos_poster-modal__inner {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        max-width: min(88vw, 380px);
        max-height: 92vh;
        transform: translateY(15px) scale(0.96);
        transition: transform 0.25s ease;
}
.speos_poster-modal.active .speos_poster-modal__inner {
    transform: translateY(0) scale(1);
}
.speos_poster-modal__canvas {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 0;
    width: 100%;
    border-radius: 12px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35);
}
.speos_poster-modal__canvas canvas {
    display: block;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    border-radius: 12px;
}
.speos_poster-modal__actions {
    display: flex;
    gap: 12px;
    margin-top: 16px;
}
.speos_poster-modal__actions button {
    padding: 9px 22px;
    font-size: 14px;
    border: none;
    border-radius: 9999px;
    cursor: pointer;
    color: #fff;
    transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}
.speos_poster-modal__actions button:hover {
    transform: translateY(-2px);
}
.speos_poster-save {
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    box-shadow: 0 6px 16px rgba(139, 92, 246, 0.35);
}
.speos_poster-close {
    background: rgba(255, 255, 255, 0.18);
}
.speos_poster-close:hover {
    opacity: 0.85;
}
@media (max-width: 768px) {
.speos_share-trigger {
        width: 26px;
        height: 26px;
}
.speos_poster-modal {
        padding: 12px;
}
.speos_poster-modal__inner {
        max-width: min(94vw, 330px);
        max-height: 90vh;
}
.speos_poster-modal__actions {
        gap: 8px;
        margin-top: 12px;
}
.speos_poster-modal__actions button {
        padding: 8px 18px;
        font-size: 13px;
}
}
/* 评论列表整体更紧凑 */
.comment-item {
    padding-bottom: 12px;
}
/* 评论嵌套缩进：JS 依据 data-parent 给 .comment-item.is-reply 加左缩进，
   去掉左侧竖线，改为与顶层评论一致的干净卡片，仅保留缩进体现层级；整体更矮、主次分明 */
.comment-item.is-reply {
    border-left: none;
    padding: 4px 0 10px 0;
    background: transparent;
    border-radius: 0;
}
/* 手机端进一步削弱缩进，避免空间被压扁 */
@media (max-width: 640px) {
.comment-item.is-reply {
        border-left: none;
        padding: 3px 0 8px 0;
        margin-left: calc(var(--comment-depth, 1) * 8px) !important;
}
}
/* 弹出式搜索框样式 */
#search-modal {
    opacity: 0;
    transition: opacity 0.3s ease-out;
}
/* 关闭时彻底不显示（ID 特异性高于 Tailwind 的 .hidden，防止被 flex 规则覆盖） */
#search-modal.hidden {
    display: none;
}
/* 打开时 flex 居中；Tailwind 产物缺少相关类（构建后新增未重建），必须在此兜底，否则宽度塌缩贴顶不居中。
   :not(.closing) 区分出场过渡（关闭先加 .closing 播放回退动画再隐藏） */
/* 搜索框内容容器：左右 16px 边距、最大宽 512px、搜索框与热门搜索间距 16px。
   整体上移 120px（视觉重心偏高不贴中心）；出入场为纯淡入淡出（无位移无缩放） */
#search-modal .search-modal-body {
    position: relative;
    z-index: 10;
    width: calc(100% - 2rem);
    max-width: 32rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    transform: translateY(-7.5rem);
    opacity: 0;
    transition: opacity 0.25s ease-out;
}
#search-modal:not(.hidden):not(.closing) .search-modal-body {
    opacity: 1;
}
#search-modal-input::placeholder {
    color: #6b7280;
}
/* 热门搜索：一行 4 个（Tailwind 产物中无基础 grid-cols-4，必须在此兜底） */
#search-modal-word-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.5rem;
}
#search-modal-word-grid a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    min-width: 0;
    padding: 0.4rem 0.25rem;
    border-radius: 0.5rem;
    font-size: 0.8125rem;
    transition: all 0.2s ease;
}
/* 长关键词单行截断，保证一行 3 个不换行（完整词见 title 属性） */
#search-modal-word-grid a span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#search-modal-word-grid a i {
    flex-shrink: 0;
}
#search-modal-word-grid a:hover {
    background: rgba(59, 130, 246, 0.08);
}
/* 深色模式下的搜索框样式 */
.dark #search-modal input {
    color: #f3f4f6;
}
.dark #search-modal input::placeholder {
    color: #9ca3af;
}
.dark #search-modal-suggestions {
    border-color: rgba(255, 255, 255, 0.1);
}
.dark #search-modal-word-grid a {
    color: #e5e7eb;
}
.dark #search-modal-word-grid a:hover {
    background: rgba(255, 255, 255, 0.08);
}
#search-modal:not(.hidden):not(.closing) {
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}
#search-modal-overlay {
    opacity: 0;
    transition: opacity 0.3s ease-out;
}
#search-modal:not(.hidden):not(.closing) #search-modal-overlay {
    opacity: 1;
}
#search-modal:not(.hidden):not(.closing) .glass-effect {
    opacity: 1;
}
#search-modal .glass-effect {
    opacity: 0;
    transition: opacity 0.25s ease-out 0.05s;
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
.dark #search-modal .glass-effect {
    background: rgba(15, 23, 42, 0.8);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}
#search-modal-input {
    transition: all 0.3s ease;
    background: transparent;
    border: none;
    outline: none;
}
#search-modal-input:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
    background: rgba(255, 255, 255, 0.5);
}
.dark #search-modal-input:focus {
    background: rgba(15, 23, 42, 0.6);
    box-shadow: 0 0 0 2px rgba(139, 92, 246, 0.2);
}
#search-modal-suggestions {
    opacity: 0;
    transition: opacity 0.25s ease-out 0.1s;
}
#search-modal:not(.hidden):not(.closing) #search-modal-suggestions {
    opacity: 1;
}
#search-modal-suggestions a {
    background: rgba(255, 255, 255, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
    transition: all 0.2s ease;
}
#search-modal-suggestions a:hover {
    background: rgba(59, 130, 246, 0.1);
    border-color: rgba(59, 130, 246, 0.3);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);
}
.dark #search-modal-suggestions a {
    background: rgba(15, 23, 42, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.1);
}
.dark #search-modal-suggestions a:hover {
    background: rgba(31, 41, 55, 0.5);
    border-color: rgba(139, 92, 246, 0.4);
    box-shadow: 0 4px 12px rgba(139, 92, 246, 0.3);
}
/* 出场过渡：ui.js 关闭时先给 #search-modal 加 .closing（打开态规则因 :not(.closing) 失效，
   元素回到初始态并按下方 ease-in 曲线快速淡出），动画播完后再加 .hidden 彻底隐藏。
   注意：closing 期间必须保留 flex 居中布局——否则打开态规则失效后 body 失去居中，
   内容会瞬间跳到视口顶部再淡出（观感即“从顶部出场”），与纯淡出不符 */
#search-modal.closing {
    opacity: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.2s ease-in;
}
#search-modal.closing #search-modal-overlay {
    opacity: 0;
    transition: opacity 0.2s ease-in;
}
#search-modal.closing .search-modal-body {
    opacity: 0;
    transition: opacity 0.18s ease-in;
}
#search-modal.closing .glass-effect {
    opacity: 0;
    transition: opacity 0.15s ease-in;
}
#search-modal.closing #search-modal-suggestions {
    opacity: 0;
    transition: opacity 0.15s ease-in 0.04s;
}
/* 实时搜索结果下拉（ui.js 防抖 300ms 请求 action=supreme-search 后渲染） */
#search-modal-results {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 0.5rem);
    z-index: 20;
    max-height: 280px;
    overflow-y: auto;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 0.75rem;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}
#search-modal-results a {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.9rem;
    font-size: 0.875rem;
    color: #374151;
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
    transition: background-color 0.15s ease;
}
#search-modal-results a:last-child {
    border-bottom: none;
}
#search-modal-results a:hover {
    background: rgba(59, 130, 246, 0.08);
}
/* 标题单行截断（flex 子项需 min-width:0 才能收缩） */
#search-modal-results a span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#search-modal-results a i {
    flex-shrink: 0;
}
/* 命中片段高亮（HTML 已先转义再包 <em>，无 XSS 风险） */
#search-modal-results em {
    color: #2563eb;
    font-style: normal;
    font-weight: 600;
}
#search-modal-results .search-empty {
    padding: 0.8rem 0.9rem;
    font-size: 0.8125rem;
    color: #9ca3af;
}
.dark #search-modal-results {
    background: rgba(15, 23, 42, 0.95);
    border-color: rgba(255, 255, 255, 0.1);
}
.dark #search-modal-results a {
    color: #e5e7eb;
    border-bottom-color: rgba(255, 255, 255, 0.06);
}
.dark #search-modal-results em {
    color: #60a5fa;
}
/* PC 端桌面搜索框实时结果下拉（widgets.js 渲染到 #search-live-results） */
#search-live-results a {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.8125rem;
    color: #374151;
    transition: background-color 0.15s ease;
}
#search-live-results a:hover {
    background: rgba(59, 130, 246, 0.08);
}
#search-live-results a span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#search-live-results a i {
    flex-shrink: 0;
}
#search-live-results em {
    color: #2563eb;
    font-style: normal;
    font-weight: 600;
}
#search-live-results .search-empty {
    padding: 0.5rem 1rem;
    font-size: 0.8125rem;
    color: #9ca3af;
}
.dark #search-live-results a {
    color: #e5e7eb;
}
.dark #search-live-results a:hover {
    background: rgba(139, 92, 246, 0.15);
}
.dark #search-live-results em {
    color: #60a5fa;
}
/* PC 端热门搜索：一行 3 个（Tailwind 产物中无基础 grid-cols-3，必须在此兜底） */
#search-hot-words-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.25rem;
    padding: 0.5rem;
}
#search-hot-words-grid a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    min-width: 0;
    padding: 0.35rem 0.25rem;
    border-radius: 0.5rem;
    font-size: 0.8125rem;
    transition: all 0.2s ease;
}
#search-hot-words-grid a:hover {
    background: rgba(255, 255, 255, 0.25);
}
#search-hot-words-grid a span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dark #search-hot-words-grid a {
    color: #e5e7eb;
}
.dark #search-hot-words-grid a:hover {
    background: rgba(255, 255, 255, 0.08);
}
/* 评论区设备标识（评论者浏览器/系统，UA 解析输出） */
.comment-device {
    margin: 2px 0 6px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2px 12px;
    font-size: 0.75rem;
    line-height: 1.4;
    color: #9ca3af;
}
.comment-device span {
    display: inline-flex;
    align-items: center;
}
.comment-device i {
    width: 14px;
    margin-right: 4px;
    text-align: center;
    font-size: 0.8125rem;
}
.dark .comment-device {
    color: #6b7280;
}
/* =====================================================================
 * 评论区回复增强：@被回复者徽章 + 昵称行 + 回复按钮悬停反馈
 *
 * 徽章由 comments.php threadedComments 的 static 昵称映射派生渲染（不写入评论内容），
 * 父评论在本页列表时才出现；点击锚点平滑定位到原评论。
 * ===================================================================== */
.comment-author-line {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    margin-right: 8px;
}
.comment-author-name {
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.comment-at {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 12px;
    line-height: 1;
    color: var(--theme, #3b82f6);
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.10), rgba(139, 92, 246, 0.10));
    border: 1px solid rgba(59, 130, 246, 0.16);
    border-radius: 999px;
    padding: 3px 10px;
    text-decoration: none;
    transition: all .2s ease;
    vertical-align: middle;
}
.comment-at__icon {
    flex-shrink: 0;
    font-size: 10px;
    opacity: 0.85;
}
.comment-at__name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}
.comment-at:hover {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.18), rgba(139, 92, 246, 0.18));
    border-color: rgba(59, 130, 246, 0.28);
    color: #2563eb;
}
.dark .comment-at {
    color: #93c5fd;
    background: linear-gradient(135deg, rgba(96, 165, 250, 0.14), rgba(139, 92, 246, 0.14));
    border-color: rgba(96, 165, 250, 0.22);
}
.dark .comment-at:hover {
    background: linear-gradient(135deg, rgba(96, 165, 250, 0.22), rgba(139, 92, 246, 0.22));
    border-color: rgba(96, 165, 250, 0.32);
    color: #bfdbfe;
}
/* 回复按钮：hover 出现胶囊底色（负 margin 抵消 padding，布局不跳动） */
.comment-reply {
    padding: 2px 8px;
    margin: -2px -8px;
    border-radius: 999px;
    transition: background-color .2s ease;
}
.comment-reply:hover {
    background: rgba(59, 130, 246, 0.10);
}
.dark .comment-reply:hover {
    background: rgba(96, 165, 250, 0.14);
}
/* ============================================================
   全局复制提示 Toast（适配浅色/深色模式）
   ============================================================ */
.copy-toast {
    position: fixed;
    z-index: 9999;
    left: 50%;
    bottom: 80px;
    transform: translateX(-50%) translateY(20px);
    padding: 10px 18px;
    border-radius: 999px;
    font-size: 14px;
    line-height: 1.5;
    color: #1f2937;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15), 0 4px 10px rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(0, 0, 0, 0.06);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease, transform 0.3s ease;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    max-width: 80vw;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.copy-toast--show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}
.copy-toast--success {
    color: #047857;
    border-color: rgba(16, 185, 129, 0.25);
}
.copy-toast--error {
    color: #b91c1c;
    border-color: rgba(239, 68, 68, 0.25);
}
.dark .copy-toast {
    color: #f3f4f6;
    background: rgba(31, 41, 55, 0.95);
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4), 0 4px 10px rgba(0, 0, 0, 0.3);
}
.dark .copy-toast--success {
    color: #34d399;
    border-color: rgba(16, 185, 129, 0.35);
}
.dark .copy-toast--error {
    color: #f87171;
    border-color: rgba(239, 68, 68, 0.35);
}
@media (max-width: 640px) {
.copy-toast {
        bottom: 40px;
        font-size: 13px;
        padding: 9px 15px;
}
}
/* ==========================================
   置顶 / 推荐 文章卡片专属标记
   ========================================== */
.supreme-postcard {
    position: relative;
}
/* 顶部细渐变条：一眼区分置顶与推荐 */
.supreme-postcard--sticky,
.dark .supreme-postcard--sticky {
    box-shadow: 0 8px 32px 0 rgba(230, 0, 18, 0.18);
}
.supreme-postcard--recommend,
.dark .supreme-postcard--recommend {
    box-shadow: 0 8px 32px 0 rgba(245, 158, 11, 0.18);
}
.supreme-postcard--sticky:hover {
    border-color: rgba(230, 0, 18, 0.45);
    box-shadow: 0 14px 40px 0 rgba(230, 0, 18, 0.28);
}
.supreme-postcard--recommend:hover {
    border-color: rgba(245, 158, 11, 0.5);
    box-shadow: 0 14px 40px 0 rgba(245, 158, 11, 0.28);
}
/* 缩略图左上角徽章组 */
.supreme-flags {
    position: absolute;
    top: 7px;
    left: 7px;
    z-index: 13;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    pointer-events: none;
}
.supreme-flag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px 2px 7px;
    border-radius: 999px;
    font-size: 11px;
    line-height: 1.7;
    font-weight: 600;
    color: #fff;
    letter-spacing: 0.5px;
    white-space: nowrap;
    backdrop-filter: blur(10px) saturate(160%);
    -webkit-backdrop-filter: blur(10px) saturate(160%);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.28);
    border: 0.5px solid rgba(255, 255, 255, 0.4);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28);
}
.supreme-flag i {
    font-size: 10px;
}
.supreme-flag--sticky {
    background: linear-gradient(135deg, rgba(230, 0, 18, 0.82), rgba(192, 0, 15, 0.82));
}
.supreme-flag--recommend {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.75), rgba(234, 88, 12, 0.75));
}
/* 缩略图底部信息条：左下角分类 / 右下角时间 */
.supreme-thumb-meta {
    position: absolute;
    left: 6px;
    right: 6px;
    bottom: 6px;
    z-index: 12;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    pointer-events: none;
}
.supreme-thumb-date,
.supreme-thumb-cat {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
    max-width: 62%;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    line-height: 1.6;
    font-weight: 500;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    backdrop-filter: blur(8px) saturate(140%);
    -webkit-backdrop-filter: blur(8px) saturate(140%);
    border: 0.5px solid rgba(255, 255, 255, 0.32);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}
.supreme-thumb-date {
    background: rgba(17, 24, 39, 0.42);
}
.supreme-thumb-cat {
    background: rgba(16, 185, 129, 0.62);
}
.supreme-thumb-date i,
.supreme-thumb-cat i {
    font-size: 10px;
    flex-shrink: 0;
}
@media (max-width: 640px) {
.supreme-flags {
        top: 5px;
        left: 5px;
        gap: 4px;
}
.supreme-flag {
        padding: 1px 7px 1px 6px;
        font-size: 10px;
}
.supreme-thumb-meta {
        left: 5px;
        right: 5px;
        bottom: 5px;
        gap: 5px;
}
.supreme-thumb-date,
    .supreme-thumb-cat {
        padding: 1px 7px;
        font-size: 10px;
}
}
/* ==========================================
   深色模式适配：置顶 / 推荐角标、缩略图胶囊
   ========================================== */
.dark .supreme-flag {
    border-color: rgba(255, 255, 255, 0.5);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4);
}
.dark .supreme-flag--sticky {
    background: linear-gradient(135deg, rgba(230, 0, 18, 0.9), rgba(192, 0, 15, 0.9));
}
.dark .supreme-flag--recommend {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.9), rgba(234, 88, 12, 0.9));
}
.dark .supreme-thumb-date,
.dark .supreme-thumb-cat {
    border-color: rgba(255, 255, 255, 0.42);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
.dark .supreme-thumb-date {
    background: rgba(15, 23, 42, 0.6);
}
.dark .supreme-thumb-cat {
    background: rgba(16, 185, 129, 0.72);
}
.dark .supreme-postcard--sticky {
    box-shadow: 0 8px 32px 0 rgba(230, 0, 18, 0.3);
}
.dark .supreme-postcard--recommend {
    box-shadow: 0 8px 32px 0 rgba(245, 158, 11, 0.3);
}
.dark .supreme-postcard--sticky:hover {
    border-color: rgba(230, 0, 18, 0.65);
    box-shadow: 0 14px 40px 0 rgba(230, 0, 18, 0.42);
}
.dark .supreme-postcard--recommend:hover {
    border-color: rgba(245, 158, 11, 0.65);
    box-shadow: 0 14px 40px 0 rgba(245, 158, 11, 0.42);
}
/* ==========================================
   点赞按钮：可点赞 / 取消，红心跳动反馈
   ========================================== */
.like-btn {
    -webkit-tap-highlight-color: transparent;
    user-select: none;
    -webkit-user-select: none;
}
.like-btn.is-liked,
.like-btn.is-liked .fa-heart {
    color: #ef4444;
}
.dark .like-btn.is-liked,
.dark .like-btn.is-liked .fa-heart {
    color: #f87171;
}
@keyframes supreme-like-pop {

    0% {
        transform: scale(1);
    }
    35% {
        transform: scale(1.45);
    }
    70% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1);
    }

}
.like-btn .fa-heart.like-pop {
    animation: supreme-like-pop 0.42s cubic-bezier(0.34, 1.56, 0.64, 1);
}
/* ==========================================
   留言板：留言墙（玻璃卡片网格）
   ========================================== */
.supreme-message-wall-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 14px;
}
.supreme-message-wall-item {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 14px 14px 12px;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.78) 0%, rgba(255, 255, 255, 0.62) 100%);
    border: 1px solid rgba(255, 255, 255, 0.5);
    box-shadow: 0 4px 18px 0 rgba(15, 23, 42, 0.06);
    backdrop-filter: blur(14px) saturate(160%);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.supreme-message-wall-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 14px;
    right: 14px;
    height: 2px;
    border-radius: 0 0 4px 4px;
    background: linear-gradient(90deg, rgba(59, 130, 246, 0.55), rgba(139, 92, 246, 0.55));
    opacity: 0.85;
}
.supreme-message-wall-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 26px 0 rgba(15, 23, 42, 0.12);
    border-color: rgba(59, 130, 246, 0.35);
}
.dark .supreme-message-wall-item {
    background: linear-gradient(180deg, rgba(30, 41, 59, 0.72) 0%, rgba(30, 41, 59, 0.55) 100%);
    border: 1px solid rgba(148, 163, 184, 0.18);
    box-shadow: 0 4px 18px 0 rgba(0, 0, 0, 0.35);
}
.dark .supreme-message-wall-item::before {
    background: linear-gradient(90deg, rgba(96, 165, 250, 0.7), rgba(167, 139, 250, 0.7));
}
.dark .supreme-message-wall-item:hover {
    border-color: rgba(96, 165, 250, 0.45);
    box-shadow: 0 10px 26px 0 rgba(0, 0, 0, 0.5);
}
.supreme-message-wall-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}
.supreme-message-wall-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    flex-shrink: 0;
    object-fit: cover;
    border: 2px solid rgba(59, 130, 246, 0.45);
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.12);
}
.dark .supreme-message-wall-avatar {
    border-color: rgba(96, 165, 250, 0.55);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.45);
}
.supreme-message-wall-name {
    font-size: 13px;
    font-weight: 600;
    color: rgb(31, 41, 55);
    line-height: 1.3;
}
.dark .supreme-message-wall-name {
    color: rgb(226, 232, 240);
}
.supreme-message-wall-time {
    font-size: 11px;
    color: rgb(107, 114, 128);
    line-height: 1.3;
    margin-top: 1px;
}
.dark .supreme-message-wall-time {
    color: rgb(148, 163, 184);
}
.supreme-message-wall-replies {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    box-shadow: 0 2px 6px rgba(59, 130, 246, 0.32);
}
.dark .supreme-message-wall-replies {
    box-shadow: 0 2px 6px rgba(96, 165, 250, 0.42);
}
.supreme-message-wall-content {
    font-size: 13px;
    line-height: 1.65;
    color: rgb(55, 65, 81);
    word-break: break-word;
    flex: 1;
    min-height: 38px;
}
.supreme-message-wall-content p {
    margin: 0 0 4px;
}
.supreme-message-wall-content p:last-child {
    margin-bottom: 0;
}
.supreme-message-wall-content img {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
    vertical-align: middle;
}
.supreme-message-wall-content a {
    color: rgb(59, 130, 246);
    text-decoration: none;
    transition: color 0.2s ease;
}
.supreme-message-wall-content a:hover {
    color: rgb(37, 99, 235);
    text-decoration: underline;
}
.dark .supreme-message-wall-content {
    color: rgb(203, 213, 225);
}
.dark .supreme-message-wall-content a {
    color: rgb(147, 197, 253);
}
.dark .supreme-message-wall-content a:hover {
    color: rgb(191, 219, 254);
}
.supreme-message-wall-ua {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
    padding-top: 8px;
    border-top: 1px dashed rgba(148, 163, 184, 0.25);
    font-size: 11px;
    color: rgb(107, 114, 128);
}
.supreme-message-wall-ua span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.supreme-message-wall-ua i {
    font-size: 11px;
    opacity: 0.85;
}
.dark .supreme-message-wall-ua {
    border-top-color: rgba(148, 163, 184, 0.22);
    color: rgb(148, 163, 184);
}
@media (max-width: 640px) {
.supreme-message-wall-grid {
        grid-template-columns: 1fr;
        gap: 10px;
}
.supreme-message-wall-item {
        padding: 12px 12px 10px;
}
.supreme-message-wall-avatar {
        width: 32px;
        height: 32px;
}
}
/* ==========================================
   留言板：卡片点击定位 + 评论区折叠 / 高亮
   ========================================== */
/* 可点击的留言卡片 */
.supreme-message-wall-item--jump {
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.supreme-message-wall-item--jump:focus-visible {
    outline: 2px solid rgba(59, 130, 246, 0.6);
    outline-offset: 2px;
}
/* 底部「查看评论位置」提示：默认淡出，hover 时浮现 */
.supreme-message-wall-jump {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: 8px;
    font-size: 11px;
    font-weight: 600;
    color: rgb(59, 130, 246);
    opacity: 0;
    transform: translateY(2px);
    transition: opacity 0.22s ease, transform 0.22s ease;
}
.supreme-message-wall-jump i {
    font-size: 10px;
}
.supreme-message-wall-item--jump:hover .supreme-message-wall-jump,
.supreme-message-wall-item--jump:focus-visible .supreme-message-wall-jump {
    opacity: 1;
    transform: translateY(0);
}
.dark .supreme-message-wall-jump {
    color: rgb(147, 197, 253);
}
/* 移动端无 hover，常驻显示提示 */
@media (hover: none) {
.supreme-message-wall-jump {
        opacity: 0.85;
        transform: none;
}
}
/* 评论区折叠（留言板场景默认）：用 display 让占位彻底消失，避免空白 */
.supreme-comment-collapsed {
    display: none !important;
}
/* 展开 / 收起切换按钮 */
.supreme-comment-toggle {
    display: inline-flex;
    align-items: center;
    padding: 7px 18px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, #3b82f6, #8b5cf6);
    box-shadow: 0 4px 14px rgba(59, 130, 246, 0.28);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.supreme-comment-toggle:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.36);
}
.supreme-comment-toggle:active {
    transform: translateY(0);
}
.supreme-comment-toggle i {
    font-size: 11px;
    transition: transform 0.2s ease;
}
.dark .supreme-comment-toggle {
    box-shadow: 0 4px 14px rgba(96, 165, 250, 0.34);
}
.dark .supreme-comment-toggle:hover {
    box-shadow: 0 8px 20px rgba(96, 165, 250, 0.44);
}
/* 定位高亮：点击留言墙卡片后，目标留言淡蓝背景提示（无竖线） */
.supreme-comment-highlight {
    border-radius: 8px;
    animation: supreme-comment-highlight 2.2s ease-out;
}
@keyframes supreme-comment-highlight {

    0% {
        background-color: rgba(59, 130, 246, 0.18);
    }
    60% {
        background-color: rgba(59, 130, 246, 0.22);
    }
    100% {
        background-color: transparent;
    }

}
.dark .supreme-comment-highlight {
    animation-name: supreme-comment-highlight-dark;
}
@keyframes supreme-comment-highlight-dark {

    0% {
        background-color: rgba(96, 165, 250, 0.22);
    }
    60% {
        background-color: rgba(96, 165, 250, 0.26);
    }
    100% {
        background-color: transparent;
    }

}
/* ============================================================
   文章头部（batten）— 发布日期徽章 / 作者 meta 排版
   背景：徽章原使用固定 w-12/h-12 + Tailwind 文本类，不同字体族下
   数字字宽与行高差异会导致「日/年月」换行、溢出或垂直偏移。
   这里改为「min-width + padding 自适应」并锁定数字等宽与行高。
   ============================================================ */
/* 移动端默认隐藏徽章，≥640px（PC/平板）显示 */
.speos_detail__count-created {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    box-sizing: border-box;
    min-width: 3.75rem;
    padding: 6px 8px;
    border-radius: 0.5rem;
    background-image: linear-gradient(135deg, #3b82f6 0%, #6366f1 100%);
    box-shadow: 0 4px 6px -1px rgba(59, 130, 246, 0.35),
                0 2px 4px -1px rgba(59, 130, 246, 0.20);
    color: #fff;
    text-align: center;
    overflow: hidden;
}
@media (min-width: 640px) {
.speos_detail__count-created {
        display: flex;
}
}
.speos_detail__count-created .day,
.speos_detail__count-created .month {
    display: block;
    width: 100%;
    /* 等宽数字：消除不同字体下 0-9 字宽不一致造成的左右偏移 */
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    /* 禁止换行：避免 "2026-08" 折行撑破徽章 */
    white-space: nowrap;
    letter-spacing: 0;
    text-align: center;
}
.speos_detail__count-created .day {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.1;
}
.speos_detail__count-created .month {
    margin-top: 2px;
    font-size: 10px;
    line-height: 1.1;
    opacity: 0.85;
}
/* 作者信息块：改为「名称行 + 阅读时长/字数行」两行结构。
   两行总高锁定 35px（≤ 头像 36px），因此卡片高度与改动前完全一致，
   而内容块整体由「单行垂直居中」变为「两行顶满」，名称/日期/评论/阅读量随之上移约 7.5px。 */
.speos_detail__count .meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    min-width: 0;
    max-width: 100%;
    row-gap: 0;
}
/* 第一行：作者名 + 日期/评论/阅读量，全端同行齐平，窄屏放不下时该行内部换行 */
.speos_detail__count .meta-top {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    min-width: 0;
    max-width: 100%;
    column-gap: 0.75rem;
    row-gap: 2px;
}
/* 第二行：阅读时长 / 正文字数。上提 1px 收紧两行间距，仍控制在 35px 内 */
.speos_detail__count .meta-extra {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-top: -1px;
    font-size: 12px;
    line-height: 1rem;
    color: #9ca3af;
}
.speos_detail__count .meta-extra .line {
    color: #d1d5db;
}
.dark .speos_detail__count .meta-extra {
    color: #8b9bb4;
}
.dark .speos_detail__count .meta-extra .line {
    color: #4b5563;
}
/* 小屏：卡片本身更窄，进一步压低第二行字号行高，避免新增行把卡片撑高 */
@media (max-width: 639px) {
.speos_detail__count .meta-extra {
        font-size: 11px;
        line-height: 14px;
}
}
/* ============================================================
   搜索引擎收录状态（batten 第二行）
   ============================================================ */
.speos-index-status {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    cursor: default;
    user-select: none;
}
.speos-index-status__label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.speos-index-status__item {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}
/* 品牌图标为内嵌 SVG（百度爪印 / Bing "b"），1em 随文字缩放，fill 继承状态色 */
.speos-index-status__item svg {
    width: 1em;
    height: 1em;
    fill: currentColor;
    flex-shrink: 0;
}
.speos-index-status__item.is-indexed {
    color: #10b981;
}
.speos-index-status__item.is-not_indexed {
    color: #f59e0b;
}
.speos-index-status__item.is-unknown {
    color: #9ca3af;
}
.speos-index-status__submit {
    display: inline-flex;
    align-items: center;
    margin-left: 2px;
    padding: 0 5px;
    font-size: 11px;
    line-height: 14px;
    color: #fff;
    background: #3b82f6;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
    transition: background .15s ease;
}
.speos-index-status__submit:hover {
    background: #2563eb;
}
.speos-index-status__submit:disabled {
    opacity: .6;
    cursor: not-allowed;
}
.dark .speos-index-status__item.is-indexed {
    color: #34d399;
}
.dark .speos-index-status__item.is-not_indexed {
    color: #fbbf24;
}
.dark .speos-index-status__item.is-unknown {
    color: #8b9bb4;
}
/* 小屏：状态文字进一步缩小，避免撑高卡片 */
@media (max-width: 639px) {
.speos-index-status__submit {
        font-size: 10px;
        line-height: 13px;
        padding: 0 4px;
}
}
/* ============================================================
   页脚联系方式图标：QQ / 邮箱 / 微信 / GitHub
   静默态统一为页脚灰（同截图色），hover 或点击后才切到品牌色；
   品牌色通过 --social-brand 变量下发，深色模式下覆盖为提亮档。
   ============================================================ */
.supreme-social {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    background: transparent;
    font-size: 17px;
    line-height: 1;
    color: #6b7280;
    cursor: pointer;
    transition: transform 0.2s ease, color 0.2s ease;
}
.dark .supreme-social {
    color: #9ca3af;
}
.supreme-social--qq {
    --social-brand: #12b7f5;
}
/* 邮箱橙：深浅两种模式同色，橙色在深底上对比度足够，无需另设提亮档 */
.supreme-social--mail {
    --social-brand: #FF9933;
}
.supreme-social--wechat {
    --social-brand: #07c160;
}
.supreme-social--github {
    --social-brand: #24292f;
}
.dark .supreme-social--qq {
    --social-brand: #45cbf8;
}
.dark .supreme-social--mail {
    --social-brand: #FF9933;
}
.dark .supreme-social--wechat {
    --social-brand: #34d17d;
}
.dark .supreme-social--github {
    --social-brand: #e6edf3;
}
/* 必须放在所有 .dark 覆盖之后，保证深色模式下 hover / 点击同样切品牌色 */
.supreme-social:hover,
.supreme-social:focus-visible,
.supreme-social.is-active {
    color: var(--social-brand, currentColor);
    transform: translateY(-2px);
}
/* ============================================================
   联系方式弹窗（复制成功提示 / 微信二维码）
   卡片跟随主题：浅色模式白卡、深色模式深色卡；
   二维码图片区恒为白底，保证深色模式下仍可正常扫码。
   ============================================================ */
.supreme-social-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    transition: opacity 0.2s ease;
}
.supreme-social-modal.is-open {
    opacity: 1;
}
.supreme-social-modal[hidden] {
    display: none;
}
.supreme-social-modal__mask {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}
.supreme-social-modal__panel {
    position: relative;
    width: 100%;
    max-width: 300px;
    padding: 26px 22px 22px;
    border-radius: 16px;
    background: #ffffff;
    color: #1f2937;
    text-align: center;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.28);
    transform: translateY(8px) scale(0.98);
    transition: transform 0.2s ease;
}
.supreme-social-modal.is-open .supreme-social-modal__panel {
    transform: none;
}
.dark .supreme-social-modal__panel {
    background: #1e293b;
    color: #e2e8f0;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.55);
}
.supreme-social-modal__close {
    position: absolute;
    top: 6px;
    right: 8px;
    padding: 6px;
    border: 0;
    background: transparent;
    color: #9ca3af;
    font-size: 15px;
    line-height: 1;
    cursor: pointer;
    transition: color 0.2s ease;
}
.supreme-social-modal__close:hover {
    color: #4b5563;
}
.dark .supreme-social-modal__close {
    color: #94a3b8;
}
.dark .supreme-social-modal__close:hover {
    color: #e2e8f0;
}
.supreme-social-modal__icon {
    margin-bottom: 10px;
    font-size: 34px;
    line-height: 1;
    color: #22c55e;
}
.supreme-social-modal__panel[data-type="qrcode"] .supreme-social-modal__icon {
    color: #07c160;
}
.supreme-social-modal__title {
    font-size: 16px;
    font-weight: 600;
    color: #111827;
}
.dark .supreme-social-modal__title {
    color: #f8fafc;
}
.supreme-social-modal__desc {
    margin-top: 6px;
    font-size: 13px;
    color: #6b7280;
    word-break: break-all;
}
.dark .supreme-social-modal__desc {
    color: #cbd5e1;
}
.supreme-social-modal__body:not(:empty) {
    margin-top: 14px;
}
/* 二维码恒为白底：深色卡上也能扫，且避免透明 PNG 落在深色底上 */
.supreme-social-modal__qrcode {
    display: block;
    width: 180px;
    max-width: 100%;
    margin: 0 auto;
    border-radius: 10px;
    background: #ffffff;
}
/* 侧边栏「人生倒计时」进度条：载入时从 0 生长到目标宽度 */
@keyframes timelifeGrow {

    from { width: 0; }

}
/* 四色进度条（移植自 Joe 人生倒计时）：蓝 / 黄 / 红 / 绿 斜纹，斜纹缓慢滚动 */
.timelife-track {
    background: #e8f0f8;
}
.dark .timelife-track {
    background: rgba(148, 163, 184, 0.2);
}
.timelife-bar {
    animation: timelifeGrow 0.8s ease both, timelifeStripes 750ms linear infinite;
}
@keyframes timelifeStripes {

    to { background-position: 30px 0; }

}
.timelife-bar-0 {
    background: #bde6ff;
    background-image: linear-gradient(135deg, #50bfff 25%, transparent 25%, transparent 50%, #50bfff 50%, #50bfff 75%, transparent 75%, transparent 100%);
    background-size: 30px 30px;
}
.timelife-bar-1 {
    background: #ffd980;
    background-image: linear-gradient(135deg, #f7ba2a 25%, transparent 25%, transparent 50%, #f7ba2a 50%, #f7ba2a 75%, transparent 75%, transparent 100%);
    background-size: 30px 30px;
}
.timelife-bar-2 {
    background: #ffa9a9;
    background-image: linear-gradient(135deg, #ff4949 25%, transparent 25%, transparent 50%, #ff4949 50%, #ff4949 75%, transparent 75%, transparent 100%);
    background-size: 30px 30px;
}
.timelife-bar-3 {
    background: #a5d98a;
    background-image: linear-gradient(135deg, #4f9e28 25%, transparent 25%, transparent 50%, #4f9e28 50%, #4f9e28 75%, transparent 75%, transparent 100%);
    background-size: 30px 30px;
}
/* 侧边栏「自定义模块」内的基础元素与玻璃卡对齐 */
.supreme-aside-custom img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}
.supreme-aside-custom a {
    color: #3b82f6;
}
.supreme-aside-custom a:hover {
    text-decoration: underline;
}
/* 侧边栏模块头部彩色图标（编译 CSS 未收录的补充工具类） */
.text-indigo-500 {
--tw-text-opacity:1;
color:rgb(99 102 241/var(--tw-text-opacity,1));
}
.text-sky-500 {
--tw-text-opacity:1;
color:rgb(14 165 233/var(--tw-text-opacity,1));
}
.text-sky-400 {
--tw-text-opacity:1;
color:rgb(56 189 248/var(--tw-text-opacity,1));
}
.text-sky-300 {
--tw-text-opacity:1;
color:rgb(125 211 252/var(--tw-text-opacity,1));
}
.text-blue-400 {
--tw-text-opacity:1;
color:rgb(96 165 250/var(--tw-text-opacity,1));
}
/* 侧边栏卡片标题右侧三色圆点（mac 风格红黄绿灯）。
   仅命中 .glass-card 的直接子级 h3.font-semibold（即各模块标题）；
   个人信息卡片的标题嵌套在头像行内，不是直接子级，自动排除。 */
.glass-card > h3.font-semibold::after {
    content: '';
    display: block;
    margin-left: auto;
    width: 10px;
    height: 10px;
    border-radius: 9999px;
    background: #ff5f57;
    box-shadow: -16px 0 0 #febc2e, -32px 0 0 #28c840;
    flex-shrink: 0;
}
/* ===== 以下规则由 header.php 内联 <style> 外移而来（减少模板内联样式） ===== */
/* 导航栏分类下拉菜单（纯 CSS 悬停展开） */
.nav-category-dropdown {
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: all 0.2s ease;
}
.nav-category-group:hover .nav-category-dropdown,
.nav-category-group:focus-within .nav-category-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
/* 代码块：窗口式容器已自带圆角与边距，内部 pre 应贴底无边距 */
.post-content pre[class*="language-"] {
    border-radius: 0.5rem;
    margin: 1em 0;
    font-size: 0.85em;
}
.post-content .code-window pre[class*="language-"] {
    border-radius: 0;
    margin: 0;
}