:root {
  --primary-color: hsl(12, 60%, 45%);
  --secondary-color: hsl(28, 50%, 30%);
  --bg-color: hsl(35, 30%, 98%);
  --text-color: hsl(20, 15%, 15%);
  --text-muted: hsl(20, 10%, 45%);
  --border-color: hsla(20, 15%, 15%, 0.1);
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 6px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.1);
  --shadow-md: 0 4px 12px rgba(163, 42, 26, 0.15);
  --shadow-lg: 0 10px 25px rgba(0,0,0,0.1);
  --nav-height: 64px;
  --max-width: 1100px;
  --transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --nav-bg: var(--bg-color);
  --font-serif: "Georgia", "Times New Roman", serif;
  --font-sans: "Inter", -apple-system, sans-serif;
  --wps-primary: hsl(194, 78%, 64%);
  --wps-secondary: hsl(338, 62%, 64%);
  --wps-bg: hsl(194, 7%, 97%);
  --wps-text: var(--text-color, hsl(194, 10%, 6%));
  --wps-radius: var(--border-radius, 8px);
  --wps-shadow: var(--box-shadow, 0 4px 20px rgba(0,0,0,0.08));
  --dl-bg: #f7f3ec;
  --dl-surface: #fffdf9;
  --dl-ink: #1f1a16;
  --dl-muted: #5d534a;
  --dl-primary: #c55a2c;
  --dl-primary-deep: #9f4520;
  --dl-accent: #2e6f7f;
  --dl-border: #dfd3c4;
  --dl-radius: 14px;
  --dl-shadow: 0 10px 24px rgba(80, 44, 21, 0.12);
  --wps-primary-color: var(--nav-bg-color, hsl(194, 78%, 64%));
  --wps-accent-color: hsl(338, 62%, 64%);
  --wps-text-main: var(--text-color, hsl(194, 10%, 6%));
  --wps-text-muted: #666666;
  --wps-bg-light: var(--bg-color, hsl(194, 7%, 97%));
  --wps-card-bg: #ffffff;
  --wps-border-radius: var(--radius-m, 8px);
  --wps-container-width: 1100px;
  --guide-primary: var(--primary-color, hsl(194, 78%, 64%));
  --guide-secondary: var(--secondary-color, hsl(338, 62%, 64%));
  --guide-bg: var(--bg-color, hsl(194, 7%, 97%));
  --guide-text: var(--text-color, hsl(194, 10%, 6%));
  --guide-card-bg: #ffffff;
  --guide-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  --guide-radius: var(--border-radius, 12px);
  --text-main: var(--text-color, hsl(194, 10%, 6%));
  --bg-soft: var(--background-color, hsl(194, 7%, 97%));
  --card-bg: #ffffff;
  --accent-warm: #f59e0b;
}

    * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height); 
    font-family: var(--font-sans);
    background-color: #f5f5f5;
    }
    
    .cobalt_B {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--nav-height);
    background-color: var(--nav-bg);
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    box-shadow: var(--shadow-sm);
    }
    .quantum_z {
    width: 100%;
    max-width: var(--max-width);
    height: 100%;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    }
    
    .vortex_99 {
    text-decoration: none;
    display: flex;
    align-items: center;
    }
    .spark_v2 {
    font-family: var(--font-serif);
    font-size: 26px;
    font-weight: 800;
    color: var(--primary-color);
    letter-spacing: -0.5px;
    border-bottom: 2px solid var(--primary-color);
    line-height: 1;
    padding-bottom: 2px;
    }
    
    .shard_01 {
    display: flex;
    list-style: none;
    align-items: center;
    gap: 8px; 
    }
    .Hyper_x8 {
    display: flex;
    align-items: center;
    }
    .onyx_dark {
    text-decoration: none;
    color: var(--text-color);
    font-size: 14px;
    font-weight: 500;
    padding: 8px 12px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    position: relative;
    }
    .onyx_dark:hover {
    color: var(--primary-color);
    background-color: hsla(12, 60%, 45%, 0.05);
    }
    
    .prism_sky {
    margin-left: 12px;
    }
    .flux_core {
    text-decoration: none;
    background-color: var(--primary-color); 
    color: #ffffff !important;              
    font-size: 14px;
    font-weight: 600;
    padding: 10px 20px;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-md);            
    transition: var(--transition);
    border: none;
    display: inline-block;
    }
    .flux_core:hover {
    background-color: var(--secondary-color); 
    transform: translateY(-1px);
    box-shadow: var(--shadow-lg);
    }
    
    .nebulaFlow {
    display: none;
    }
    .pixel_dust7 {
    display: none;
    flex-direction: column;
    gap: 4px;
    cursor: pointer;
    padding: 4px;
    }
    .ember_glow {
    width: 20px;
    height: 2px;
    background-color: var(--text-color);
    transition: var(--transition);
    }
    
    @media (max-width: 860px) {.pixel_dust7 {
    display: flex;
    }
    .shard_01 {
    position: absolute;
    top: var(--nav-height);
    left: 0;
    width: 100%;
    background-color: var(--nav-bg);
    flex-direction: column;
    padding: 20px 0;
    border-bottom: 1px solid var(--border-color);
    box-shadow: var(--shadow-lg);
    display: none; 
    }
    .nebulaFlow:checked ~ .shard_01 {
    display: flex;
    }
    .Hyper_x8 {
    width: 100%;
    justify-content: center;
    padding: 10px 0;
    }
    .prism_sky {
    margin-left: 0;
    margin-top: 10px;
    }
    .onyx_dark {
    font-size: 16px;
    width: 80%;
    text-align: center;
    }}
    .flux_core.active {background-color: var(--secondary-color); box-shadow: var(--shadow-lg);}
    .onyx_dark.active {color: var(--primary-color); background-color: hsla(12, 60%, 45%, 0.05);}
    main.index{
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    background-color: var(--wps-bg);
    color: var(--wps-text);
    line-height: 1.6;
    overflow-x: hidden;
    }
    
    main.index .orbit_v9{
    position: relative;
    padding: 100px 5%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 80vh;
    background: linear-gradient(135deg, #ffffff 0%, #f0f7f9 100%);
    }
    main.index .radar_ping{
    flex: 1;
    max-width: 600px;
    z-index: 2;
    }
    main.index .ivory_88{
    flex: 1;
    position: relative;
    height: 500px;
    margin-left: 40px;
    }
    main.index .ivory_88 img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: var(--wps-radius);
    box-shadow: var(--wps-shadow);
    }
    main.index h1{
    font-size: 3.5rem;
    font-weight: 800;
    margin-bottom: 24px;
    line-height: 1.2;
    color: var(--wps-text);
    }
    main.index .lunarOrbit{
    font-size: 1.25rem;
    margin-bottom: 32px;
    color: #555;
    }
    main.index .glitch_v4{
    display: flex;
    gap: 16px;
    }
    main.index .quartz_z{
    background-color: var(--wps-secondary);
    color: #ffffff;
    padding: 16px 40px;
    border-radius: var(--wps-radius);
    text-decoration: none;
    font-weight: bold;
    font-size: 1.1rem;
    box-shadow: 0 4px 15px rgba(214, 82, 130, 0.4);
    transition: transform 0.2s, background-color 0.2s;
    }
    main.index .quartz_z:hover{
    transform: translateY(-2px);
    background-color: hsl(338, 62%, 55%);
    }
    
    main.index .zodiac_7{
    padding: 80px 5%;
    }
    main.index h2{
    font-size: 2.2rem;
    text-align: center;
    margin-bottom: 48px;
    position: relative;
    }
    main.index h2::after{
    content: "";
    display: block;
    width: 60px;
    height: 4px;
    background: var(--wps-primary);
    margin: 15px auto 0;
    }
    main.index .solar_v3{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
    }
    main.index .xeno_morph{
    background: #ffffff;
    padding: 40px;
    border-radius: var(--wps-radius);
    border: 1px solid #eee;
    transition: all 0.3s ease;
    }
    main.index .xeno_morph:hover{
    box-shadow: var(--wps-shadow);
    border-color: var(--wps-primary);
    }
    main.index .xeno_morph h3{
    font-size: 1.5rem;
    margin-bottom: 16px;
    color: var(--wps-text);
    }
    
    main.index .yield_sign{
    display: flex;
    align-items: center;
    gap: 60px;
    background-color: #ffffff;
    }
    main.index .yield_sign.nomadPath{
    flex-direction: row-reverse;
    }
    main.index .blue_fox_x{
    flex: 1;
    }
    main.index .mistic_fog{
    flex: 1;
    }
    main.index .mistic_fog img{
    width: 100%;
    border-radius: var(--wps-radius);
    display: block;
    }
    
    main.index .velvet_touch{
    max-width: 900px;
    margin: 0 auto;
    background: #fff;
    border-radius: var(--wps-radius);
    overflow: hidden;
    box-shadow: var(--wps-shadow);
    }
    main.index .kinetic_ui{
    display: flex;
    border-bottom: 1px solid #eee;
    }
    main.index .pulseWave{
    flex: 1;
    padding: 20px;
    background: #fcfcfc;
    font-weight: bold;
    border-right: 1px solid #eee;
    }
    main.index .jade_stone{
    flex: 2;
    padding: 20px;
    }
    
    main.index footer{
    background-color: #1a1a1a;
    color: #ffffff;
    padding: 60px 5% 20px;
    margin-top: 80px;
    }
    main.index .urban_J{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 40px;
    margin-bottom: 40px;
    }
    main.index .titan_shell{
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 20px;
    }
    main.index .fossilFind a{
    color: #ccc;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
    font-size: 0.9rem;
    }
    main.index .fossilFind a:hover{
    color: var(--wps-primary);
    }
    main.index .warp_drive{
    text-align: center;
    padding-top: 20px;
    border-top: 1px solid #333;
    font-size: 0.85rem;
    color: #888;
    }
    @media (max-width: 768px) {main.index .orbit_v9{
    flex-direction: column;
    text-align: center;
    padding-top: 60px;
    }
    main.index .ivory_88{
    margin-left: 0;
    margin-top: 40px;
    height: 300px;
    }
    main.index .yield_sign{
    flex-direction: column;
    }
    main.index h1{
    font-size: 2.5rem;
    }}
    main img.sbv2-ai-image {
    display: block;
    max-width: 100%;
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
    }
    main img.sbv2-ai-image.sbv2-ratio-16-9 { aspect-ratio: 16 / 9; }
    main img.sbv2-ai-image.sbv2-ratio-16-10 { aspect-ratio: 16 / 10; }
    main img.sbv2-ai-image.sbv2-ratio-4-3 { aspect-ratio: 4 / 3; }
    main img.sbv2-ai-image.sbv2-ratio-1-1 { aspect-ratio: 1 / 1; }
    main .sbv2-media-frame {
    overflow: hidden;
    }
    main .sbv2-media-frame.sbv2-ratio-16-9 { aspect-ratio: 16 / 9; }
    main .sbv2-media-frame.sbv2-ratio-16-10 { aspect-ratio: 16 / 10; }
    main .sbv2-media-frame.sbv2-ratio-4-3 { aspect-ratio: 4 / 3; }
    main .sbv2-media-frame.sbv2-ratio-1-1 { aspect-ratio: 1 / 1; }
    main .sbv2-media-frame > img.sbv2-ai-image,
    main .sbv2-media-frame > picture > img.sbv2-ai-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    }

    * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height); 
    font-family: var(--font-sans);
    background-color: #f5f5f5;
    }
    
    .cobalt_B {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--nav-height);
    background-color: var(--nav-bg);
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    box-shadow: var(--shadow-sm);
    }
    .quantum_z {
    width: 100%;
    max-width: var(--max-width);
    height: 100%;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    }
    
    .vortex_99 {
    text-decoration: none;
    display: flex;
    align-items: center;
    }
    .spark_v2 {
    font-family: var(--font-serif);
    font-size: 26px;
    font-weight: 800;
    color: var(--primary-color);
    letter-spacing: -0.5px;
    border-bottom: 2px solid var(--primary-color);
    line-height: 1;
    padding-bottom: 2px;
    }
    
    .shard_01 {
    display: flex;
    list-style: none;
    align-items: center;
    gap: 8px; 
    }
    .Hyper_x8 {
    display: flex;
    align-items: center;
    }
    .onyx_dark {
    text-decoration: none;
    color: var(--text-color);
    font-size: 14px;
    font-weight: 500;
    padding: 8px 12px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    position: relative;
    }
    .onyx_dark:hover {
    color: var(--primary-color);
    background-color: hsla(12, 60%, 45%, 0.05);
    }
    
    .prism_sky {
    margin-left: 12px;
    }
    .flux_core {
    text-decoration: none;
    background-color: var(--primary-color); 
    color: #ffffff !important;              
    font-size: 14px;
    font-weight: 600;
    padding: 10px 20px;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-md);            
    transition: var(--transition);
    border: none;
    display: inline-block;
    }
    .flux_core:hover {
    background-color: var(--secondary-color); 
    transform: translateY(-1px);
    box-shadow: var(--shadow-lg);
    }
    
    .nebulaFlow {
    display: none;
    }
    .pixel_dust7 {
    display: none;
    flex-direction: column;
    gap: 4px;
    cursor: pointer;
    padding: 4px;
    }
    .ember_glow {
    width: 20px;
    height: 2px;
    background-color: var(--text-color);
    transition: var(--transition);
    }
    
    @media (max-width: 860px) {.pixel_dust7 {
    display: flex;
    }
    .shard_01 {
    position: absolute;
    top: var(--nav-height);
    left: 0;
    width: 100%;
    background-color: var(--nav-bg);
    flex-direction: column;
    padding: 20px 0;
    border-bottom: 1px solid var(--border-color);
    box-shadow: var(--shadow-lg);
    display: none; 
    }
    .nebulaFlow:checked ~ .shard_01 {
    display: flex;
    }
    .Hyper_x8 {
    width: 100%;
    justify-content: center;
    padding: 10px 0;
    }
    .prism_sky {
    margin-left: 0;
    margin-top: 10px;
    }
    .onyx_dark {
    font-size: 16px;
    width: 80%;
    text-align: center;
    }}
    .flux_core.active {background-color: var(--secondary-color); box-shadow: var(--shadow-lg);}
    .onyx_dark.active {color: var(--primary-color); background-color: hsla(12, 60%, 45%, 0.05);}
    main.download *{
    box-sizing: border-box;
    }
    main.download{
    margin: 0;
    padding: 28px 20px 0;
    background: radial-gradient(circle at 20% 0%, #fff4e8 0%, var(--dl-bg, #f7f3ec) 40%, #f2ece2 100%);
    color: var(--dl-ink, #1f1a16);
    font-family: "Noto Serif SC", "Source Han Serif SC", Georgia, serif;
    line-height: 1.6;
    }
    main.download a{
    color: var(--dl-accent, #2e6f7f);
    }
    main.download .RedTiger_0{
    max-width: 1120px;
    margin: 0 auto;
    }
    main.download .goldMine{
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 24px;
    align-items: stretch;
    margin-bottom: 24px;
    }
    main.download .rapid_fire{
    background: var(--dl-surface, #fffdf9);
    border: 1px solid var(--dl-border, #dfd3c4);
    border-radius: var(--dl-radius, 14px);
    box-shadow: var(--dl-shadow, 0 10px 24px rgba(80, 44, 21, 0.12));
    }
    main.download .storm_c{
    padding: 30px;
    animation: rise 0.5s ease-out;
    }
    main.download .dataStream_v{
    margin: 0 0 10px;
    color: var(--dl-muted, #5d534a);
    font-size: 0.96rem;
    }
    main.download h1{
    margin: 0 0 12px;
    font-size: clamp(1.8rem, 3.1vw, 2.6rem);
    line-height: 1.25;
    }
    main.download .storm_c p{
    margin: 0 0 16px;
    }
    main.download .skyHigh_v{
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    font-size: 0.95rem;
    color: var(--dl-muted, #5d534a);
    }
    main.download .deep_Sea{
    position: relative;
    overflow: hidden;
    }
    main.download .deep_Sea img{
    width: 100%;
    height: 100%;
    min-height: 280px;
    object-fit: cover;
    aspect-ratio: 16 / 10;
    display: block;
    }
    main.download .deep_Sea .slowDrift{
    position: absolute;
    left: 16px;
    bottom: 16px;
    margin: 0;
    padding: 7px 12px;
    border-radius: 999px;
    color: #fff;
    background: rgba(31, 26, 22, 0.82);
    font-size: 0.9rem;
    }
    main.download .nightOwl_v{
    margin-top: 18px;
    display: grid;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 12px;
    }
    main.download .fireWall_8{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-height: 48px;
    padding: 10px 14px;
    text-decoration: none;
    color: #ffffff;
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: linear-gradient(135deg, var(--dl-primary, #c55a2c), var(--dl-primary-deep, #9f4520));
    box-shadow: 0 10px 18px rgba(159, 69, 32, 0.35);
    font-weight: 700;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    }
    main.download .fireWall_8:hover{
    transform: translateY(-1px);
    box-shadow: 0 12px 22px rgba(159, 69, 32, 0.42);
    }
    main.download .moon_L{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    margin-bottom: 18px;
    }
    main.download .power_u{
    padding: 22px;
    }
    main.download h2{
    margin: 0 0 12px;
    font-size: 1.3rem;
    }
    main.download h3{
    margin: 12px 0 8px;
    font-size: 1.05rem;
    }
    main.download .fastTrack{
    width: 100%;
    border-collapse: collapse;
    font-size: 0.95rem;
    }
    main.download .fastTrack th, main.download .fastTrack td{
    text-align: left;
    vertical-align: top;
    padding: 10px 8px;
    border-bottom: 1px solid var(--dl-border, #dfd3c4);
    }
    main.download .fastTrack th{
    color: var(--dl-muted, #5d534a);
    font-weight: 700;
    }
    main.download .meta_D{
    margin-top: 12px;
    padding: 10px 12px;
    border-left: 4px solid var(--dl-accent, #2e6f7f);
    background: #f2f8fa;
    border-radius: 8px;
    color: #1f2f35;
    }
    main.download .silver_F{
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
    margin-top: 6px;
    }
    main.download .silver_F a{
    text-underline-offset: 3px;
    }
    main.download .ghost_9{
    display: grid;
    grid-template-columns: repeat(3, minmax(140px, 1fr));
    gap: 10px;
    }
    main.download .ghost_9 a{
    display: block;
    padding: 9px 10px;
    text-decoration: none;
    color: var(--dl-ink, #1f1a16);
    border: 1px solid var(--dl-border, #dfd3c4);
    border-radius: 10px;
    background: #fffaf3;
    text-align: center;
    }
    main.download footer{
    margin-top: 24px;
    padding: 20px 0 26px;
    border-top: 1px solid var(--dl-border, #dfd3c4);
    color: var(--dl-muted, #5d534a);
    font-size: 0.93rem;
    }
    @keyframes rise {from {
    opacity: 0;
    transform: translateY(8px);
    }
    to {
    opacity: 1;
    transform: translateY(0);
    }}
    @media (max-width: 900px) {main.download .goldMine, main.download .moon_L{
    grid-template-columns: 1fr;
    }
    main.download .nightOwl_v{
    grid-template-columns: 1fr;
    }
    main.download .ghost_9{
    grid-template-columns: 1fr 1fr;
    }}
    main img.sbv2-ai-image {
    display: block;
    max-width: 100%;
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
    }
    main img.sbv2-ai-image.sbv2-ratio-16-9 { aspect-ratio: 16 / 9; }
    main img.sbv2-ai-image.sbv2-ratio-16-10 { aspect-ratio: 16 / 10; }
    main img.sbv2-ai-image.sbv2-ratio-4-3 { aspect-ratio: 4 / 3; }
    main img.sbv2-ai-image.sbv2-ratio-1-1 { aspect-ratio: 1 / 1; }
    main .sbv2-media-frame {
    overflow: hidden;
    }
    main .sbv2-media-frame.sbv2-ratio-16-9 { aspect-ratio: 16 / 9; }
    main .sbv2-media-frame.sbv2-ratio-16-10 { aspect-ratio: 16 / 10; }
    main .sbv2-media-frame.sbv2-ratio-4-3 { aspect-ratio: 4 / 3; }
    main .sbv2-media-frame.sbv2-ratio-1-1 { aspect-ratio: 1 / 1; }
    main .sbv2-media-frame > img.sbv2-ai-image,
    main .sbv2-media-frame > picture > img.sbv2-ai-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    }

    * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height); 
    font-family: var(--font-sans);
    background-color: #f5f5f5;
    }
    
    .cobalt_B {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--nav-height);
    background-color: var(--nav-bg);
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    box-shadow: var(--shadow-sm);
    }
    .quantum_z {
    width: 100%;
    max-width: var(--max-width);
    height: 100%;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    }
    
    .vortex_99 {
    text-decoration: none;
    display: flex;
    align-items: center;
    }
    .spark_v2 {
    font-family: var(--font-serif);
    font-size: 26px;
    font-weight: 800;
    color: var(--primary-color);
    letter-spacing: -0.5px;
    border-bottom: 2px solid var(--primary-color);
    line-height: 1;
    padding-bottom: 2px;
    }
    
    .shard_01 {
    display: flex;
    list-style: none;
    align-items: center;
    gap: 8px; 
    }
    .Hyper_x8 {
    display: flex;
    align-items: center;
    }
    .onyx_dark {
    text-decoration: none;
    color: var(--text-color);
    font-size: 14px;
    font-weight: 500;
    padding: 8px 12px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    position: relative;
    }
    .onyx_dark:hover {
    color: var(--primary-color);
    background-color: hsla(12, 60%, 45%, 0.05);
    }
    
    .prism_sky {
    margin-left: 12px;
    }
    .flux_core {
    text-decoration: none;
    background-color: var(--primary-color); 
    color: #ffffff !important;              
    font-size: 14px;
    font-weight: 600;
    padding: 10px 20px;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-md);            
    transition: var(--transition);
    border: none;
    display: inline-block;
    }
    .flux_core:hover {
    background-color: var(--secondary-color); 
    transform: translateY(-1px);
    box-shadow: var(--shadow-lg);
    }
    
    .nebulaFlow {
    display: none;
    }
    .pixel_dust7 {
    display: none;
    flex-direction: column;
    gap: 4px;
    cursor: pointer;
    padding: 4px;
    }
    .ember_glow {
    width: 20px;
    height: 2px;
    background-color: var(--text-color);
    transition: var(--transition);
    }
    
    @media (max-width: 860px) {.pixel_dust7 {
    display: flex;
    }
    .shard_01 {
    position: absolute;
    top: var(--nav-height);
    left: 0;
    width: 100%;
    background-color: var(--nav-bg);
    flex-direction: column;
    padding: 20px 0;
    border-bottom: 1px solid var(--border-color);
    box-shadow: var(--shadow-lg);
    display: none; 
    }
    .nebulaFlow:checked ~ .shard_01 {
    display: flex;
    }
    .Hyper_x8 {
    width: 100%;
    justify-content: center;
    padding: 10px 0;
    }
    .prism_sky {
    margin-left: 0;
    margin-top: 10px;
    }
    .onyx_dark {
    font-size: 16px;
    width: 80%;
    text-align: center;
    }}
    .flux_core.active {background-color: var(--secondary-color); box-shadow: var(--shadow-lg);}
    .onyx_dark.active {color: var(--primary-color); background-color: hsla(12, 60%, 45%, 0.05);}
    main.requirements .req_R{
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    color: var(--wps-text-main, #333);
    background-color: var(--wps-bg-light, #f8f9fa);
    line-height: 1.6;
    margin: 0;
    padding: 0;
    }
    main.requirements .cpu_L{
    max-width: var(--wps-container-width);
    margin: 0 auto;
    padding: 40px 20px;
    }
    
    main.requirements .ram_D{
    display: flex;
    align-items: center;
    gap: 40px;
    padding: 60px 0;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    }
    main.requirements .devOps_x{
    flex: 1;
    }
    main.requirements .tech_S{
    flex: 1;
    border-radius: var(--wps-border-radius);
    overflow: hidden;
    box-shadow: var(--wps-shadow);
    aspect-ratio: 16 / 9;
    }
    main.requirements .tech_S img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    }
    main.requirements .db_S{
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 20px;
    color: var(--wps-text-main);
    line-height: 1.2;
    }
    main.requirements .log_I{
    font-size: 1.1rem;
    color: var(--wps-text-muted);
    margin-bottom: 30px;
    }
    
    main.requirements .web_F{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 24px;
    margin-top: 50px;
    }
    main.requirements .git_P{
    background: var(--wps-card-bg);
    padding: 32px;
    border-radius: var(--wps-border-radius);
    box-shadow: var(--wps-shadow);
    transition: transform 0.2s ease;
    }
    main.requirements .git_P:hover{
    transform: translateY(-4px);
    }
    main.requirements .git_P h2{
    font-size: 1.5rem;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--wps-primary-color);
    }
    main.requirements .dark_M{
    list-style: none;
    padding: 0;
    margin: 0;
    }
    main.requirements .sys_A{
    display: flex;
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
    }
    main.requirements .vpn_N{
    width: 100px;
    font-weight: 600;
    color: var(--wps-text-muted);
    }
    main.requirements .api_C{
    flex: 1;
    color: var(--wps-text-main);
    }
    
    main.requirements .ssd_C{
    margin-top: 60px;
    background: var(--wps-card-bg);
    padding: 40px;
    border-radius: var(--wps-border-radius);
    }
    main.requirements .ssd_C h2{
    text-align: center;
    margin-bottom: 30px;
    }
    main.requirements .lite_W{
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    }
    main.requirements .lite_W th, main.requirements .lite_W td{
    padding: 16px;
    text-align: left;
    border-bottom: 1px solid #eeeeee;
    }
    main.requirements .lite_W th{
    background-color: #fafafa;
    color: var(--wps-text-muted);
    font-weight: 600;
    }
    
    main.requirements .heavy_D{
    text-align: center;
    padding: 80px 20px;
    background: linear-gradient(135deg, var(--wps-primary-color) 0%, #a2d2df 100%);
    border-radius: var(--wps-border-radius);
    margin: 60px 0;
    color: #fff;
    }
    main.requirements .js_H{
    display: inline-block;
    background-color: var(--wps-accent-color);
    color: white;
    padding: 16px 40px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 700;
    font-size: 1.1rem;
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
    }
    main.requirements .js_H:hover{
    transform: scale(1.05);
    box-shadow: 0 15px 30px rgba(0,0,0,0.15);
    background-color: hsl(338, 62%, 55%);
    }
    main.requirements .ssl_C{
    margin-top: 20px;
    font-size: 0.9rem;
    }
    main.requirements .ssl_C a{
    color: rgba(255,255,255,0.9);
    margin: 0 10px;
    text-decoration: underline;
    }
    
    main.requirements .ui_UX{
    padding: 40px 20px;
    text-align: center;
    border-top: 1px solid #eee;
    color: var(--wps-text-muted);
    font-size: 0.9rem;
    }
    main.requirements .ui_UX p{ margin: 5px 0; }
    @media (max-width: 768px) {main.requirements .ram_D{ flex-direction: column; text-align: center; }
    main.requirements .lite_W{ display: block; overflow-x: auto; }
    main.requirements .git_P{ padding: 20px; }}
    main img.sbv2-ai-image {
    display: block;
    max-width: 100%;
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
    }
    main img.sbv2-ai-image.sbv2-ratio-16-9 { aspect-ratio: 16 / 9; }
    main img.sbv2-ai-image.sbv2-ratio-16-10 { aspect-ratio: 16 / 10; }
    main img.sbv2-ai-image.sbv2-ratio-4-3 { aspect-ratio: 4 / 3; }
    main img.sbv2-ai-image.sbv2-ratio-1-1 { aspect-ratio: 1 / 1; }
    main .sbv2-media-frame {
    overflow: hidden;
    }
    main .sbv2-media-frame.sbv2-ratio-16-9 { aspect-ratio: 16 / 9; }
    main .sbv2-media-frame.sbv2-ratio-16-10 { aspect-ratio: 16 / 10; }
    main .sbv2-media-frame.sbv2-ratio-4-3 { aspect-ratio: 4 / 3; }
    main .sbv2-media-frame.sbv2-ratio-1-1 { aspect-ratio: 1 / 1; }
    main .sbv2-media-frame > img.sbv2-ai-image,
    main .sbv2-media-frame > picture > img.sbv2-ai-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    }

    * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height); 
    font-family: var(--font-sans);
    background-color: #f5f5f5;
    }
    
    .cobalt_B {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--nav-height);
    background-color: var(--nav-bg);
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    box-shadow: var(--shadow-sm);
    }
    .quantum_z {
    width: 100%;
    max-width: var(--max-width);
    height: 100%;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    }
    
    .vortex_99 {
    text-decoration: none;
    display: flex;
    align-items: center;
    }
    .spark_v2 {
    font-family: var(--font-serif);
    font-size: 26px;
    font-weight: 800;
    color: var(--primary-color);
    letter-spacing: -0.5px;
    border-bottom: 2px solid var(--primary-color);
    line-height: 1;
    padding-bottom: 2px;
    }
    
    .shard_01 {
    display: flex;
    list-style: none;
    align-items: center;
    gap: 8px; 
    }
    .Hyper_x8 {
    display: flex;
    align-items: center;
    }
    .onyx_dark {
    text-decoration: none;
    color: var(--text-color);
    font-size: 14px;
    font-weight: 500;
    padding: 8px 12px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    position: relative;
    }
    .onyx_dark:hover {
    color: var(--primary-color);
    background-color: hsla(12, 60%, 45%, 0.05);
    }
    
    .prism_sky {
    margin-left: 12px;
    }
    .flux_core {
    text-decoration: none;
    background-color: var(--primary-color); 
    color: #ffffff !important;              
    font-size: 14px;
    font-weight: 600;
    padding: 10px 20px;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-md);            
    transition: var(--transition);
    border: none;
    display: inline-block;
    }
    .flux_core:hover {
    background-color: var(--secondary-color); 
    transform: translateY(-1px);
    box-shadow: var(--shadow-lg);
    }
    
    .nebulaFlow {
    display: none;
    }
    .pixel_dust7 {
    display: none;
    flex-direction: column;
    gap: 4px;
    cursor: pointer;
    padding: 4px;
    }
    .ember_glow {
    width: 20px;
    height: 2px;
    background-color: var(--text-color);
    transition: var(--transition);
    }
    
    @media (max-width: 860px) {.pixel_dust7 {
    display: flex;
    }
    .shard_01 {
    position: absolute;
    top: var(--nav-height);
    left: 0;
    width: 100%;
    background-color: var(--nav-bg);
    flex-direction: column;
    padding: 20px 0;
    border-bottom: 1px solid var(--border-color);
    box-shadow: var(--shadow-lg);
    display: none; 
    }
    .nebulaFlow:checked ~ .shard_01 {
    display: flex;
    }
    .Hyper_x8 {
    width: 100%;
    justify-content: center;
    padding: 10px 0;
    }
    .prism_sky {
    margin-left: 0;
    margin-top: 10px;
    }
    .onyx_dark {
    font-size: 16px;
    width: 80%;
    text-align: center;
    }}
    .flux_core.active {background-color: var(--secondary-color); box-shadow: var(--shadow-lg);}
    .onyx_dark.active {color: var(--primary-color); background-color: hsla(12, 60%, 45%, 0.05);}

    main.changelog{
    font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
    color: var(--wps-text);
    background-color: var(--wps-bg);
    line-height: 1.6;
    max-width: 100%;
    overflow-x: hidden;
    }
    main.changelog .omega_V{
    max-width: 1100px;
    margin: 0 auto;
    padding: 40px 20px;
    }
    
    main.changelog .visually-hidden{
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    }
    
    main.changelog .beta01_z{
    text-align: center;
    padding: 60px 20px;
    background: linear-gradient(135deg, #fff 0%, var(--wps-bg) 100%);
    border-radius: var(--wps-radius);
    margin-bottom: 50px;
    }
    main.changelog .beta01_z h1{
    font-size: 1.5rem;
    color: var(--wps-text);
    max-width: 800px;
    margin: 0 auto 24px;
    font-weight: 500;
    line-height: 1.4;
    }
    main.changelog .psi_1{
    margin-top: 30px;
    border-radius: var(--wps-radius);
    overflow: hidden;
    box-shadow: var(--wps-shadow);
    }
    main.changelog .psi_1 img{
    width: 100%;
    max-height: 400px;
    object-fit: cover;
    display: block;
    }
    
    main.changelog .zeta99{
    position: relative;
    padding: 20px 0;
    }
    main.changelog .alpha9_v{
    background: #ffffff;
    border-radius: var(--wps-radius);
    padding: 30px;
    margin-bottom: 40px;
    box-shadow: var(--wps-shadow);
    border-left: 5px solid var(--wps-primary);
    transition: transform 0.3s ease;
    }
    main.changelog .alpha9_v:hover{
    transform: translateY(-5px);
    }
    main.changelog .chi_2{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #eee;
    padding-bottom: 15px;
    margin-bottom: 20px;
    }
    main.changelog .yAxis_3{
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--wps-primary);
    }
    main.changelog .kappa_5{
    color: #666;
    font-size: 0.95rem;
    }
    main.changelog .delta7_w{
    background-color: var(--wps-secondary);
    color: #fff;
    padding: 2px 10px;
    border-radius: 20px;
    font-size: 0.8rem;
    margin-left: 10px;
    vertical-align: middle;
    }
    main.changelog .gamma_X{
    margin-bottom: 25px;
    }
    main.changelog .gamma_X h3{
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    margin-bottom: 12px;
    color: #333;
    }
    main.changelog .gamma_X h3 svg{
    width: 20px;
    height: 20px;
    margin-right: 8px;
    fill: var(--wps-primary);
    }
    main.changelog .tau_8{
    list-style: none;
    padding-left: 28px;
    }
    main.changelog .tau_8 li{
    position: relative;
    margin-bottom: 8px;
    color: #444;
    }
    main.changelog .tau_8 li::before{
    content: "•";
    position: absolute;
    left: -15px;
    color: var(--wps-primary);
    font-weight: bold;
    }
    
    main.changelog .xRay_2{
    background: var(--wps-text);
    color: #fff;
    padding: 40px;
    border-radius: var(--wps-radius);
    text-align: center;
    margin: 60px 0;
    }
    main.changelog .z100_v{
    display: inline-block;
    background: var(--wps-primary);
    color: #fff;
    padding: 14px 36px;
    border-radius: 4px;
    text-decoration: none;
    font-weight: bold;
    margin-top: 20px;
    box-shadow: 0 4px 15px rgba(88, 189, 214, 0.4);
    transition: all 0.3s ease;
    }
    main.changelog .z100_v:hover{
    filter: brightness(1.1);
    transform: scale(1.02);
    }
    
    main.changelog footer{
    background: #f0f3f5;
    padding: 40px 20px;
    text-align: center;
    border-top: 1px solid #e1e4e8;
    margin-top: 80px;
    }
    main.changelog .rho42{
    margin-bottom: 20px;
    }
    main.changelog .rho42 a{
    color: #666;
    text-decoration: none;
    margin: 0 15px;
    font-size: 0.9rem;
    }
    main.changelog .rho42 a:hover{
    color: var(--wps-primary);
    }
    main.changelog .sigma_0{
    color: #999;
    font-size: 0.85rem;
    }
    
    @media (max-width: 768px) {main.changelog .chi_2{
    flex-direction: column;
    align-items: flex-start;
    }
    main.changelog .kappa_5{
    margin-top: 8px;
    }}
    main img.sbv2-ai-image {
    display: block;
    max-width: 100%;
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
    }
    main img.sbv2-ai-image.sbv2-ratio-16-9 { aspect-ratio: 16 / 9; }
    main img.sbv2-ai-image.sbv2-ratio-16-10 { aspect-ratio: 16 / 10; }
    main img.sbv2-ai-image.sbv2-ratio-4-3 { aspect-ratio: 4 / 3; }
    main img.sbv2-ai-image.sbv2-ratio-1-1 { aspect-ratio: 1 / 1; }
    main .sbv2-media-frame {
    overflow: hidden;
    }
    main .sbv2-media-frame.sbv2-ratio-16-9 { aspect-ratio: 16 / 9; }
    main .sbv2-media-frame.sbv2-ratio-16-10 { aspect-ratio: 16 / 10; }
    main .sbv2-media-frame.sbv2-ratio-4-3 { aspect-ratio: 4 / 3; }
    main .sbv2-media-frame.sbv2-ratio-1-1 { aspect-ratio: 1 / 1; }
    main .sbv2-media-frame > img.sbv2-ai-image,
    main .sbv2-media-frame > picture > img.sbv2-ai-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    }

    * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height); 
    font-family: var(--font-sans);
    background-color: #f5f5f5;
    }
    
    .cobalt_B {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--nav-height);
    background-color: var(--nav-bg);
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    box-shadow: var(--shadow-sm);
    }
    .quantum_z {
    width: 100%;
    max-width: var(--max-width);
    height: 100%;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    }
    
    .vortex_99 {
    text-decoration: none;
    display: flex;
    align-items: center;
    }
    .spark_v2 {
    font-family: var(--font-serif);
    font-size: 26px;
    font-weight: 800;
    color: var(--primary-color);
    letter-spacing: -0.5px;
    border-bottom: 2px solid var(--primary-color);
    line-height: 1;
    padding-bottom: 2px;
    }
    
    .shard_01 {
    display: flex;
    list-style: none;
    align-items: center;
    gap: 8px; 
    }
    .Hyper_x8 {
    display: flex;
    align-items: center;
    }
    .onyx_dark {
    text-decoration: none;
    color: var(--text-color);
    font-size: 14px;
    font-weight: 500;
    padding: 8px 12px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    position: relative;
    }
    .onyx_dark:hover {
    color: var(--primary-color);
    background-color: hsla(12, 60%, 45%, 0.05);
    }
    
    .prism_sky {
    margin-left: 12px;
    }
    .flux_core {
    text-decoration: none;
    background-color: var(--primary-color); 
    color: #ffffff !important;              
    font-size: 14px;
    font-weight: 600;
    padding: 10px 20px;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-md);            
    transition: var(--transition);
    border: none;
    display: inline-block;
    }
    .flux_core:hover {
    background-color: var(--secondary-color); 
    transform: translateY(-1px);
    box-shadow: var(--shadow-lg);
    }
    
    .nebulaFlow {
    display: none;
    }
    .pixel_dust7 {
    display: none;
    flex-direction: column;
    gap: 4px;
    cursor: pointer;
    padding: 4px;
    }
    .ember_glow {
    width: 20px;
    height: 2px;
    background-color: var(--text-color);
    transition: var(--transition);
    }
    
    @media (max-width: 860px) {.pixel_dust7 {
    display: flex;
    }
    .shard_01 {
    position: absolute;
    top: var(--nav-height);
    left: 0;
    width: 100%;
    background-color: var(--nav-bg);
    flex-direction: column;
    padding: 20px 0;
    border-bottom: 1px solid var(--border-color);
    box-shadow: var(--shadow-lg);
    display: none; 
    }
    .nebulaFlow:checked ~ .shard_01 {
    display: flex;
    }
    .Hyper_x8 {
    width: 100%;
    justify-content: center;
    padding: 10px 0;
    }
    .prism_sky {
    margin-left: 0;
    margin-top: 10px;
    }
    .onyx_dark {
    font-size: 16px;
    width: 80%;
    text-align: center;
    }}
    .flux_core.active {background-color: var(--secondary-color); box-shadow: var(--shadow-lg);}
    .onyx_dark.active {color: var(--primary-color); background-color: hsla(12, 60%, 45%, 0.05);}
    
    main.guide{
    font-family: "PingFang SC", "Microsoft YaHei", serif;
    background-color: var(--guide-bg);
    color: var(--guide-text);
    line-height: 1.6;
    overflow-x: hidden;
    }
    
    main.guide .local_S{
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 24px;
    }
    
    main.guide .magic_W{
    padding: 80px 0 60px;
    text-align: center;
    background: linear-gradient(180deg, #ffffff 0%, var(--guide-bg) 100%);
    }
    main.guide h1{
    font-size: 2.8rem;
    font-weight: 700;
    margin-bottom: 20px;
    color: var(--guide-text);
    letter-spacing: -1px;
    }
    main.guide .async_T{
    font-size: 1.15rem;
    max-width: 700px;
    margin: 0 auto 40px;
    color: #555;
    }
    
    main.guide .blue_Sky{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 30px;
    margin-bottom: 80px;
    }
    main.guide .white_N{
    background: var(--guide-card-bg);
    padding: 40px 30px;
    border-radius: var(--guide-radius);
    box-shadow: var(--guide-shadow);
    transition: transform 0.3s ease;
    position: relative;
    border: 1px solid rgba(0,0,0,0.03);
    }
    main.guide .white_N:hover{
    transform: translateY(-5px);
    }
    main.guide .golden_H{
    font-size: 3rem;
    font-weight: 800;
    color: var(--guide-primary);
    opacity: 0.2;
    position: absolute;
    top: 10px;
    right: 20px;
    }
    main.guide h2{
    font-size: 1.5rem;
    margin-bottom: 20px;
    color: var(--guide-text);
    border-left: 4px solid var(--guide-primary);
    padding-left: 15px;
    }
    main.guide h3{
    font-size: 1.2rem;
    margin-top: 25px;
    margin-bottom: 12px;
    color: var(--guide-text);
    }
    
    main.guide .dynamic_V{
    display: flex;
    align-items: center;
    gap: 60px;
    margin-bottom: 100px;
    }
    main.guide .dynamic_V.red_A{
    flex-direction: row-reverse;
    }
    main.guide .static_O{
    flex: 1;
    }
    main.guide .blue_P{
    flex: 1;
    border-radius: var(--guide-radius);
    overflow: hidden;
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
    }
    main.guide .blue_P img{
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    aspect-ratio: 16 / 10;
    }
    
    main.guide .prime_T{
    list-style: none;
    padding: 0;
    }
    main.guide .prime_T li{
    margin-bottom: 15px;
    padding-left: 25px;
    position: relative;
    }
    main.guide .prime_T li::before{
    content: "→";
    position: absolute;
    left: 0;
    color: var(--guide-primary);
    font-weight: bold;
    }
    
    main.guide .silver_L{
    display: inline-block;
    padding: 14px 32px;
    background-color: var(--guide-primary);
    color: #fff;
    text-decoration: none;
    border-radius: 50px;
    font-weight: 600;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(78, 195, 230, 0.4);
    border: none;
    cursor: pointer;
    }
    main.guide .silver_L:hover{
    background-color: #3eb0d3;
    transform: scale(1.02);
    box-shadow: 0 6px 20px rgba(78, 195, 230, 0.5);
    }
    
    main.guide .fast_M{
    background-color: #eef9fe;
    border-left: 4px solid var(--guide-primary);
    padding: 20px;
    margin: 30px 0;
    font-size: 0.95rem;
    }
    
    main.guide footer{
    background-color: #f0f3f5;
    padding: 60px 0 30px;
    margin-top: 80px;
    border-top: 1px solid #e1e4e6;
    }
    main.guide .black_B{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 40px;
    }
    main.guide .pixel_P h4{
    margin: 0 0 10px 0;
    color: var(--guide-text);
    }
    main.guide .global_V a{
    color: #666;
    text-decoration: none;
    margin-left: 20px;
    font-size: 0.9rem;
    }
    main.guide .global_V a:hover{
    color: var(--guide-primary);
    }
    main.guide .sync_L{
    width: 100%;
    text-align: center;
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid rgba(0,0,0,0.05);
    color: #999;
    font-size: 0.85rem;
    }
    @media (max-width: 768px) {main.guide .dynamic_V, main.guide .dynamic_V.red_A{
    flex-direction: column;
    gap: 30px;
    }
    main.guide h1{ font-size: 2rem; }}
    main img.sbv2-ai-image {
    display: block;
    max-width: 100%;
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
    }
    main img.sbv2-ai-image.sbv2-ratio-16-9 { aspect-ratio: 16 / 9; }
    main img.sbv2-ai-image.sbv2-ratio-16-10 { aspect-ratio: 16 / 10; }
    main img.sbv2-ai-image.sbv2-ratio-4-3 { aspect-ratio: 4 / 3; }
    main img.sbv2-ai-image.sbv2-ratio-1-1 { aspect-ratio: 1 / 1; }
    main .sbv2-media-frame {
    overflow: hidden;
    }
    main .sbv2-media-frame.sbv2-ratio-16-9 { aspect-ratio: 16 / 9; }
    main .sbv2-media-frame.sbv2-ratio-16-10 { aspect-ratio: 16 / 10; }
    main .sbv2-media-frame.sbv2-ratio-4-3 { aspect-ratio: 4 / 3; }
    main .sbv2-media-frame.sbv2-ratio-1-1 { aspect-ratio: 1 / 1; }
    main .sbv2-media-frame > img.sbv2-ai-image,
    main .sbv2-media-frame > picture > img.sbv2-ai-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    }

    * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height); 
    font-family: var(--font-sans);
    background-color: #f5f5f5;
    }
    
    .cobalt_B {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: var(--nav-height);
    background-color: var(--nav-bg);
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    box-shadow: var(--shadow-sm);
    }
    .quantum_z {
    width: 100%;
    max-width: var(--max-width);
    height: 100%;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    }
    
    .vortex_99 {
    text-decoration: none;
    display: flex;
    align-items: center;
    }
    .spark_v2 {
    font-family: var(--font-serif);
    font-size: 26px;
    font-weight: 800;
    color: var(--primary-color);
    letter-spacing: -0.5px;
    border-bottom: 2px solid var(--primary-color);
    line-height: 1;
    padding-bottom: 2px;
    }
    
    .shard_01 {
    display: flex;
    list-style: none;
    align-items: center;
    gap: 8px; 
    }
    .Hyper_x8 {
    display: flex;
    align-items: center;
    }
    .onyx_dark {
    text-decoration: none;
    color: var(--text-color);
    font-size: 14px;
    font-weight: 500;
    padding: 8px 12px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    position: relative;
    }
    .onyx_dark:hover {
    color: var(--primary-color);
    background-color: hsla(12, 60%, 45%, 0.05);
    }
    
    .prism_sky {
    margin-left: 12px;
    }
    .flux_core {
    text-decoration: none;
    background-color: var(--primary-color); 
    color: #ffffff !important;              
    font-size: 14px;
    font-weight: 600;
    padding: 10px 20px;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-md);            
    transition: var(--transition);
    border: none;
    display: inline-block;
    }
    .flux_core:hover {
    background-color: var(--secondary-color); 
    transform: translateY(-1px);
    box-shadow: var(--shadow-lg);
    }
    
    .nebulaFlow {
    display: none;
    }
    .pixel_dust7 {
    display: none;
    flex-direction: column;
    gap: 4px;
    cursor: pointer;
    padding: 4px;
    }
    .ember_glow {
    width: 20px;
    height: 2px;
    background-color: var(--text-color);
    transition: var(--transition);
    }
    
    @media (max-width: 860px) {.pixel_dust7 {
    display: flex;
    }
    .shard_01 {
    position: absolute;
    top: var(--nav-height);
    left: 0;
    width: 100%;
    background-color: var(--nav-bg);
    flex-direction: column;
    padding: 20px 0;
    border-bottom: 1px solid var(--border-color);
    box-shadow: var(--shadow-lg);
    display: none; 
    }
    .nebulaFlow:checked ~ .shard_01 {
    display: flex;
    }
    .Hyper_x8 {
    width: 100%;
    justify-content: center;
    padding: 10px 0;
    }
    .prism_sky {
    margin-left: 0;
    margin-top: 10px;
    }
    .onyx_dark {
    font-size: 16px;
    width: 80%;
    text-align: center;
    }}
    .flux_core.active {background-color: var(--secondary-color); box-shadow: var(--shadow-lg);}
    .onyx_dark.active {color: var(--primary-color); background-color: hsla(12, 60%, 45%, 0.05);}

    main.shortcuts .groove_L{
    font-family: "Inter", "Segoe UI", "Microsoft YaHei", sans-serif;
    color: var(--text-main);
    background-color: var(--bg-soft);
    line-height: 1.6;
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
    }
    
    main.shortcuts .visually-hidden{
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    }
    
    main.shortcuts .hero-section{
    text-align: center;
    margin-bottom: 60px;
    padding: 40px;
    background: linear-gradient(135deg, #ffffff 0%, #f0f9ff 100%);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-color);
    }
    main.shortcuts .hero-section h1{
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--text-main);
    margin-bottom: 20px;
    line-height: 1.4;
    }
    main.shortcuts .update-badge{
    display: inline-block;
    background: var(--primary-color);
    color: white;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.85rem;
    margin-bottom: 15px;
    }
    
    main.shortcuts .synth_P{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 30px;
    margin-bottom: 50px;
    }
    main.shortcuts .yellow_S{
    background: var(--card-bg);
    border-radius: var(--radius-lg);
    padding: 30px;
    box-shadow: var(--shadow-sm);
    transition: transform 0.2s ease;
    border-top: 4px solid var(--primary-color);
    }
    main.shortcuts .yellow_S:hover{
    transform: translateY(-5px);
    box-shadow: var(--shadow-md);
    }
    main.shortcuts .yellow_S h2{
    font-size: 1.4rem;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 10px;
    }
    
    main.shortcuts .beat_B{
    list-style: none;
    padding: 0;
    }
    main.shortcuts .cyber_P{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px dashed #eee;
    }
    main.shortcuts .cyber_P:last-child{
    border-bottom: none;
    }
    main.shortcuts .pink_F{
    background: #f1f5f9;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    padding: 2px 8px;
    font-family: "Courier New", monospace;
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--text-main);
    box-shadow: 0 2px 0 #cbd5e1;
    }
    main.shortcuts .laser_B{
    font-size: 0.95rem;
    color: #475569;
    }
    
    main.shortcuts .retro_W{
    margin: 60px 0;
    border-radius: var(--radius-lg);
    overflow: hidden;
    position: relative;
    height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    }
    main.shortcuts .retro_W img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    z-index: 1;
    }
    main.shortcuts .disco_B{
    position: relative;
    z-index: 2;
    background: rgba(0, 0, 0, 0.5);
    color: white;
    padding: 30px;
    text-align: center;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    }
    
    main.shortcuts .neon_P{
    background: #fff;
    padding: 30px;
    border-radius: var(--radius-lg);
    margin-top: 40px;
    border: 1px solid var(--border-color);
    }
    main.shortcuts .neon_P a{
    color: var(--primary-color);
    text-decoration: none;
    font-weight: 600;
    transition: color 0.2s;
    }
    main.shortcuts .neon_P a:hover{
    color: var(--secondary-color);
    text-decoration: underline;
    }
    
    main.shortcuts .green_L{
    margin-top: 80px;
    padding: 40px 0;
    border-top: 1px solid var(--border-color);
    text-align: center;
    color: #64748b;
    font-size: 0.9rem;
    }
    main.shortcuts .funk_M{
    font-weight: 700;
    color: var(--text-main);
    margin-bottom: 10px;
    display: block;
    }
    
    @media (max-width: 768px) {main.shortcuts .synth_P{
    grid-template-columns: 1fr;
    }
    main.shortcuts .hero-section h1{
    font-size: 1.4rem;
    }}
    main img.sbv2-ai-image {
    display: block;
    max-width: 100%;
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
    }
    main img.sbv2-ai-image.sbv2-ratio-16-9 { aspect-ratio: 16 / 9; }
    main img.sbv2-ai-image.sbv2-ratio-16-10 { aspect-ratio: 16 / 10; }
    main img.sbv2-ai-image.sbv2-ratio-4-3 { aspect-ratio: 4 / 3; }
    main img.sbv2-ai-image.sbv2-ratio-1-1 { aspect-ratio: 1 / 1; }
    main .sbv2-media-frame {
    overflow: hidden;
    }
    main .sbv2-media-frame.sbv2-ratio-16-9 { aspect-ratio: 16 / 9; }
    main .sbv2-media-frame.sbv2-ratio-16-10 { aspect-ratio: 16 / 10; }
    main .sbv2-media-frame.sbv2-ratio-4-3 { aspect-ratio: 4 / 3; }
    main .sbv2-media-frame.sbv2-ratio-1-1 { aspect-ratio: 1 / 1; }
    main .sbv2-media-frame > img.sbv2-ai-image,
    main .sbv2-media-frame > picture > img.sbv2-ai-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    }

.cc-sec-area.active,
.cc-sec-area.cc-visible {
    opacity: 1 !important;
    transform: translateY(0) !important;
}