:root {
  --primary-color: hsl(244, 78%, 57%);
  --secondary-color: hsl(333, 62%, 57%);
  --bg-color: hsl(244, 7%, 95%);
  --text-color: hsl(244, 10%, 11%);
  --text-muted: hsl(244, 8%, 46%);
  --border-color: rgba(30, 26, 56, 0.1);
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --shadow-sm: 0 1px 4px rgba(30, 26, 56, 0.07);
  --shadow-md: 0 4px 16px rgba(30, 26, 56, 0.10);
  --shadow-lg: 0 12px 32px rgba(30, 26, 56, 0.14);
  --nav-height: 68px;
  --max-width: 1200px;
  --transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --nav-bg: var(--bg-color);
  --btn-text: #ffffff;
  --chrome-primary: hsl(244, 78%, 57%);
  --chrome-secondary: hsl(333, 62%, 57%);
  --chrome-text: hsl(244, 10%, 11%);
  --chrome-bg: hsl(244, 7%, 95%);
  --chrome-white: #ffffff;
  --chrome-muted: hsl(244, 8%, 55%);
  --chrome-border: hsl(244, 10%, 88%);
  --chrome-gradient: linear-gradient(135deg, hsl(244, 78%, 57%), hsl(290, 60%, 52%), hsl(333, 62%, 57%));
  --chrome-card-bg: hsl(244, 10%, 99%);
  --chrome-radius-sm: 10px;
  --chrome-radius-md: 16px;
  --chrome-radius-lg: 24px;
  --chrome-radius-xl: 32px;
  --chrome-shadow-sm: 0 2px 8px rgba(60, 50, 120, 0.06);
  --chrome-shadow-md: 0 8px 30px rgba(60, 50, 120, 0.1);
  --chrome-shadow-lg: 0 16px 50px rgba(60, 50, 120, 0.14);
  --dl-primary: hsl(244, 78%, 57%);
  --dl-primary-dark: hsl(244, 78%, 47%);
  --dl-secondary: hsl(333, 62%, 57%);
  --dl-secondary-dark: hsl(333, 62%, 47%);
  --dl-text: hsl(244, 10%, 11%);
  --dl-text-muted: hsl(244, 8%, 42%);
  --dl-bg: hsl(244, 7%, 95%);
  --dl-bg-white: #ffffff;
  --dl-radius-sm: 10px;
  --dl-radius-md: 16px;
  --dl-radius-lg: 24px;
  --dl-radius-xl: 32px;
  --dl-shadow-sm: 0 2px 8px rgba(60, 50, 120, 0.06);
  --dl-shadow-md: 0 8px 30px rgba(60, 50, 120, 0.1);
  --dl-shadow-lg: 0 16px 50px rgba(60, 50, 120, 0.14);
  --dl-gradient-primary: linear-gradient(135deg, var(--dl-primary), var(--dl-secondary));
  --page-primary: hsl(244, 78%, 57%);
  --page-primary-dark: hsl(244, 78%, 47%);
  --page-secondary: hsl(333, 62%, 57%);
  --page-text: hsl(244, 10%, 11%);
  --page-bg: hsl(244, 7%, 95%);
  --page-white: #ffffff;
  --page-gray-100: hsl(244, 7%, 97%);
  --page-gray-200: hsl(244, 7%, 90%);
  --page-gray-300: hsl(244, 7%, 80%);
  --page-gray-500: hsl(244, 5%, 55%);
  --page-radius-sm: 10px;
  --page-radius-md: 16px;
  --page-radius-lg: 24px;
  --page-radius-xl: 32px;
  --page-shadow-soft: 0 2px 16px hsla(244, 30%, 30%, 0.07);
  --page-shadow-card: 0 4px 24px hsla(244, 30%, 30%, 0.09);
  --page-shadow-elevated: 0 8px 40px hsla(244, 30%, 30%, 0.13);
  --page-gradient-hero: linear-gradient(160deg, hsl(244, 78%, 57%) 0%, hsl(290, 60%, 55%) 50%, hsl(333, 62%, 57%) 100%);
  --feat-primary: hsl(244, 78%, 57%);
  --feat-primary-dark: hsl(244, 78%, 47%);
  --feat-secondary: hsl(333, 62%, 57%);
  --feat-secondary-dark: hsl(333, 62%, 47%);
  --feat-text: hsl(244, 10%, 11%);
  --feat-text-light: hsl(244, 8%, 40%);
  --feat-bg: hsl(244, 7%, 95%);
  --feat-bg-white: #ffffff;
  --feat-bg-subtle: hsl(244, 10%, 92%);
  --feat-radius-sm: 10px;
  --feat-radius-md: 18px;
  --feat-radius-lg: 28px;
  --feat-radius-xl: 36px;
  --feat-shadow-sm: 0 2px 8px rgba(60, 50, 120, 0.06);
  --feat-shadow-md: 0 8px 30px rgba(60, 50, 120, 0.1);
  --feat-shadow-lg: 0 16px 50px rgba(60, 50, 120, 0.14);
  --feat-gradient: linear-gradient(135deg, var(--feat-primary), var(--feat-secondary));
  --guide-primary: hsl(244, 78%, 57%);
  --guide-primary-dark: hsl(244, 78%, 47%);
  --guide-secondary: hsl(333, 62%, 57%);
  --guide-text: hsl(244, 10%, 11%);
  --guide-text-light: hsl(244, 8%, 40%);
  --guide-bg: hsl(244, 7%, 95%);
  --guide-white: #ffffff;
  --guide-border: hsl(244, 10%, 88%);
  --guide-card-shadow: 0 2px 16px hsla(244, 30%, 20%, 0.07);
  --guide-card-shadow-hover: 0 8px 32px hsla(244, 30%, 20%, 0.13);
  --guide-radius: 18px;
  --guide-radius-sm: 12px;
  --guide-gradient: linear-gradient(135deg, hsl(244, 78%, 57%), hsl(280, 65%, 55%), hsl(333, 62%, 57%));
  --sc-primary: hsl(244, 78%, 57%);
  --sc-primary-dark: hsl(244, 78%, 47%);
  --sc-secondary: hsl(333, 62%, 57%);
  --sc-text: hsl(244, 10%, 11%);
  --sc-text-light: hsl(244, 8%, 40%);
  --sc-bg: hsl(244, 7%, 95%);
  --sc-bg-white: #ffffff;
  --sc-border: hsl(244, 10%, 88%);
  --sc-border-light: hsl(244, 10%, 92%);
  --sc-kbd-bg: hsl(244, 10%, 96%);
  --sc-kbd-border: hsl(244, 10%, 82%);
  --sc-card-shadow: 0 2px 12px hsla(244, 30%, 20%, 0.07);
  --sc-card-shadow-hover: 0 6px 24px hsla(244, 30%, 20%, 0.12);
  --sc-radius: 16px;
  --sc-radius-sm: 10px;
  --sc-radius-xs: 6px;
  --page-surface: #ffffff;
  --page-border: hsl(244, 10%, 88%);
  --page-muted: hsl(244, 8%, 46%);
  --page-shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
  --page-shadow-md: 0 4px 16px rgba(0,0,0,0.08);
  --page-shadow-lg: 0 8px 32px rgba(0,0,0,0.1);
  --page-shadow-xl: 0 16px 48px rgba(0,0,0,0.12);
  --sr-primary: hsl(244, 78%, 57%);
  --sr-primary-dark: hsl(244, 78%, 47%);
  --sr-secondary: hsl(333, 62%, 57%);
  --sr-text: hsl(244, 10%, 11%);
  --sr-text-light: hsl(244, 8%, 40%);
  --sr-bg: hsl(244, 7%, 95%);
  --sr-white: #ffffff;
  --sr-border: hsl(244, 10%, 88%);
  --sr-card-shadow: 0 2px 16px hsla(244, 30%, 20%, 0.07);
  --sr-card-shadow-hover: 0 8px 32px hsla(244, 30%, 20%, 0.13);
  --sr-radius-sm: 10px;
  --sr-radius-md: 16px;
  --sr-radius-lg: 24px;
}

*,
    *::before,
    *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height);
    font-family: "Playfair Display", "Noto Serif SC", "Source Han Serif SC", Georgia, "Times New Roman", serif;
    color: var(--text-color);
    background: var(--bg-color);
    }
    
    .nimbus {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    height: var(--nav-height);
    background: rgba(240, 239, 243, 0.82);
    backdrop-filter: blur(18px) saturate(1.6);
    -webkit-backdrop-filter: blur(18px) saturate(1.6);
    border-bottom: 1px solid var(--border-color);
    }
    .jade_pip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: var(--max-width);
    height: 100%;
    margin: 0 auto;
    padding: 0 28px;
    }
    
    .rumble {
    flex-shrink: 0;
    }
    .obsidian {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--text-color);
    }
    .frozenOrb {
    display: block;
    flex-shrink: 0;
    }
    .driftKnob {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    }
    
    .quilted {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    }
    .pale_dust {
    position: relative;
    }
    .blazeKit {
    display: block;
    padding: 8px 14px;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    white-space: nowrap;
    letter-spacing: 0.01em;
    }
    .blazeKit:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.06);
    }
    
    .craggy {
    flex-shrink: 0;
    }
    .zephyr {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 26px;
    font-family: inherit;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    }
    .zephyr:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    filter: brightness(1.08);
    }
    .zephyr:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(93, 63, 211, 0.3);
    }
    
    .px_rail {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .px_rail:hover {
    background: rgba(30, 26, 56, 0.06); color: #ffffff;}
    .ember {
    display: block;
    width: 22px;
    height: 2.5px;
    background: var(--text-color);
    border-radius: 2px;
    transition: var(--transition);
    }
    
    .waxShell {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(20, 18, 40, 0.45);
    opacity: 0;
    transition: opacity 0.3s ease; color: #ffffff;}
    .waxShell.is-visible {
    display: block;
    opacity: 1;
    }
    
    .moonArc {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1200;
    width: 300px;
    max-width: 85vw;
    background: var(--bg-color);
    box-shadow: var(--shadow-lg);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    flex-direction: column;
    }
    .moonArc.is-open {
    display: flex;
    transform: translateX(0);
    }
    .sv3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 12px;
    border-bottom: 1px solid var(--border-color);
    }
    .tq7b {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-color);
    letter-spacing: -0.01em;
    }
    .fizzle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 1.5rem;
    line-height: 1;
    color: var(--text-muted);
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .fizzle:hover {
    background: rgba(30, 26, 56, 0.06);
    color: #ffffff;
    }
    .husk_tone {
    list-style: none;
    padding: 12px 16px;
    flex: 1;
    }
    .crumble {
    border-radius: var(--radius-sm);
    }
    .vortex9 {
    display: block;
    padding: 13px 12px;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    }
    .vortex9:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.05);
    }
    .plume {
    padding: 16px 24px 28px;
    }
    .gnarly {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 14px 20px;
    font-family: inherit;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    }
    .gnarly:hover {
    filter: brightness(1.08);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    }
    
    @media (max-width: 960px) {.quilted {
    display: none;
    }
    .craggy {
    display: none;
    }
    .px_rail {
    display: flex;
    }}
    @media (min-width: 961px) {.waxShell,
    .moonArc {
    display: none !important;
    }}
    .blazeKit.active {color: #ffffff; background: rgba(30, 26, 56, 0.06);}
    .vortex9.active {color: #ffffff; background: rgba(30, 26, 56, 0.05);}
    @import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;700;800&family=Inter:wght@400;500;600;700&display=swap");
    main.index{
    font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--chrome-text);
    background: var(--chrome-bg);
    line-height: 1.65;
    overflow-x: hidden;
    }
    main.index *, main.index *::before, main.index *::after{
    box-sizing: border-box;
    }
    main.index .dewSprig{
    position: relative;
    padding: 80px 24px 100px;
    text-align: center;
    background: linear-gradient(170deg, hsl(244, 30%, 98%) 0%, hsl(244, 20%, 94%) 50%, hsl(290, 15%, 93%) 100%);
    overflow: hidden;
    }
    main.index .dewSprig::before{
    content: "";
    position: absolute;
    top: -200px;
    right: -150px;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background: radial-gradient(circle, hsla(244, 78%, 57%, 0.08) 0%, transparent 70%);
    pointer-events: none; color: #ffffff;}
    main.index .dewSprig::after{
    content: "";
    position: absolute;
    bottom: -180px;
    left: -100px;
    width: 450px;
    height: 450px;
    border-radius: 50%;
    background: radial-gradient(circle, hsla(333, 62%, 57%, 0.06) 0%, transparent 70%);
    pointer-events: none;
    }
    main.index .torque5{
    max-width: 820px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    }
    main.index .tusk_edge{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 18px;
    background: var(--chrome-white);
    border: 1px solid var(--chrome-border);
    border-radius: 100px;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--chrome-primary);
    margin-bottom: 32px;
    letter-spacing: 0.02em;
    }
    main.index .tusk_edge svg{
    width: 14px;
    height: 14px;
    }
    main.index .torque5 h1{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(2.6rem, 6vw, 4.2rem);
    font-weight: 800;
    line-height: 1.15;
    margin: 0 0 24px;
    color: var(--chrome-text);
    letter-spacing: -0.02em;
    }
    main.index .torque5 h1 .jotMark{
    background: var(--chrome-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    }
    main.index .ratchet{
    font-size: 1.1rem;
    color: var(--chrome-muted);
    max-width: 600px;
    margin: 0 auto 40px;
    line-height: 1.75;
    }
    main.index .coyote{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
    }
    main.index .cedar12{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 36px;
    background: var(--chrome-gradient);
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    border: none;
    border-radius: var(--chrome-radius-lg);
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 6px 24px hsla(244, 78%, 57%, 0.35);
    transition: transform 0.2s, box-shadow 0.2s;
    letter-spacing: 0.01em;
    }
    main.index .cedar12:hover{
    transform: translateY(-2px);
    box-shadow: 0 10px 36px hsla(244, 78%, 57%, 0.4);
    }
    main.index .cedar12 svg{
    width: 18px;
    height: 18px;
    }
    main.index .dusk_orb{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 15px 30px;
    background: var(--chrome-white);
    color: var(--chrome-text);
    font-size: 0.95rem;
    font-weight: 600;
    border: 1.5px solid var(--chrome-border);
    border-radius: var(--chrome-radius-lg);
    text-decoration: none;
    transition: border-color 0.2s, box-shadow 0.2s;
    }
    main.index .dusk_orb:hover{
    border-color: var(--chrome-primary);
    box-shadow: var(--chrome-shadow-sm);
    }
    main.index .garnet{
    display: flex;
    justify-content: center;
    gap: 32px;
    margin-top: 48px;
    flex-wrap: wrap;
    }
    main.index .ridgePole{
    text-align: center;
    }
    main.index .ridgePole .sableWing{
    display: block;
    font-family: "Playfair Display", serif;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--chrome-text);
    }
    main.index .ridgePole .wren{
    font-size: 0.8rem;
    color: var(--chrome-muted);
    margin-top: 2px;
    }
    main.index .crispen{
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 24px;
    }
    main.index .pewterNub{
    padding-top: 88px;
    padding-bottom: 88px;
    }
    main.index .mawkish{
    text-align: center;
    max-width: 640px;
    margin: 0 auto 56px;
    }
    main.index .mawkish h2{
    font-family: "Playfair Display", serif;
    font-size: clamp(1.7rem, 3.5vw, 2.3rem);
    font-weight: 700;
    margin: 0 0 14px;
    letter-spacing: -0.015em;
    }
    main.index .mawkish p{
    color: var(--chrome-muted);
    font-size: 1rem;
    margin: 0;
    line-height: 1.7;
    }
    
    main.index .quasar7{
    background: var(--chrome-white);
    }
    main.index .kelpRun{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    }
    main.index .burr_fin{
    background: var(--chrome-card-bg);
    border: 1px solid var(--chrome-border);
    border-radius: var(--chrome-radius-lg);
    padding: 36px 28px;
    transition: box-shadow 0.25s, transform 0.25s;
    }
    main.index .burr_fin:hover{
    box-shadow: var(--chrome-shadow-md);
    transform: translateY(-4px);
    }
    main.index .cinder3{
    width: 52px;
    height: 52px;
    border-radius: var(--chrome-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    }
    main.index .cinder3 svg{
    width: 26px;
    height: 26px;
    }
    main.index .hazeLoop{ background: hsla(244, 78%, 57%, 0.1); color: #ffffff; }
    main.index .ovalCrest{ background: hsla(160, 60%, 45%, 0.1); color: hsl(160, 60%, 38%); }
    main.index .glyph4{ background: hsla(333, 62%, 57%, 0.1); color: var(--chrome-secondary); }
    main.index .pivotArm{ background: hsla(30, 80%, 55%, 0.1); color: hsl(30, 80%, 45%); }
    main.index .fluxBand{ background: hsla(200, 70%, 50%, 0.1); color: hsl(200, 70%, 42%); }
    main.index .brine{ background: hsla(270, 60%, 55%, 0.1); color: hsl(270, 60%, 48%); }
    main.index .burr_fin h3{
    font-family: "Playfair Display", serif;
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0 0 10px;
    }
    main.index .burr_fin p{
    color: var(--chrome-muted);
    font-size: 0.9rem;
    margin: 0;
    line-height: 1.7;
    }
    
    main.index .mulch{
    background: var(--chrome-bg);
    }
    main.index .smelt{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    }
    main.index .shard_veil{
    position: relative;
    border-radius: var(--chrome-radius-xl);
    overflow: hidden;
    aspect-ratio: 16 / 10;
    background: #1a1a2e; color: #ffffff;}
    main.index .shard_veil img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    opacity: 0.75;
    transition: opacity 0.3s;
    }
    main.index .shard_veil:hover img{
    opacity: 0.55;
    }
    main.index .fresco{
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 32px;
    background: linear-gradient(to top, rgba(15, 12, 40, 0.82) 0%, transparent 60%); color: #ffffff;}
    main.index .fresco h3{
    font-family: "Playfair Display", serif;
    color: #fff;
    font-size: 1.35rem;
    font-weight: 700;
    margin: 0 0 8px;
    }
    main.index .fresco p{
    color: hsla(0, 0%, 100%, 0.78);
    font-size: 0.88rem;
    margin: 0 0 16px;
    line-height: 1.6;
    }
    main.index .cobalt{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #fff;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    transition: gap 0.2s;
    }
    main.index .cobalt:hover{
    gap: 10px;
    }
    main.index .cobalt svg{
    width: 16px;
    height: 16px;
    }
    main.index .shard_veil.wispFang{
    grid-column: 1 / -1;
    aspect-ratio: 21 / 9;
    }
    
    main.index .sprig_dot{
    background: var(--chrome-white);
    }
    main.index .platform-grid{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    }
    main.index .platform-card{
    text-align: center;
    padding: 36px 20px;
    background: var(--chrome-card-bg);
    border: 1px solid var(--chrome-border);
    border-radius: var(--chrome-radius-lg);
    transition: box-shadow 0.25s, transform 0.25s;
    }
    main.index .platform-card:hover{
    box-shadow: var(--chrome-shadow-md);
    transform: translateY(-3px);
    }
    main.index .platform-icon{
    width: 48px;
    height: 48px;
    margin: 0 auto 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--chrome-primary);
    }
    main.index .platform-icon svg{
    width: 36px;
    height: 36px;
    }
    main.index .platform-card h3{
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 6px;
    }
    main.index .platform-card .platform-req{
    font-size: 0.8rem;
    color: var(--chrome-muted);
    margin: 0;
    }
    
    main.index .info-bar{
    background: linear-gradient(135deg, hsl(244, 35%, 18%), hsl(280, 30%, 22%));
    color: #fff;
    text-align: center;
    padding: 64px 24px;
    }
    main.index .info-bar-inner{
    max-width: 700px;
    margin: 0 auto;
    }
    main.index .info-bar h2{
    font-family: "Playfair Display", serif;
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    margin: 0 0 14px;
    }
    main.index .info-bar p{
    color: hsla(0, 0%, 100%, 0.75);
    font-size: 0.95rem;
    margin: 0 0 28px;
    line-height: 1.7;
    }
    main.index .info-bar .cedar12{
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.3);
    }
    
    main.index .quick-section{
    background: var(--chrome-bg);
    }
    main.index .quick-grid{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    }
    main.index .quick-card{
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 24px;
    background: var(--chrome-white);
    border: 1px solid var(--chrome-border);
    border-radius: var(--chrome-radius-md);
    text-decoration: none;
    color: var(--chrome-text);
    transition: box-shadow 0.2s, transform 0.2s;
    }
    main.index .quick-card:hover{
    box-shadow: var(--chrome-shadow-sm);
    transform: translateY(-2px);
    }
    main.index .quick-card-icon{
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: var(--chrome-radius-sm);
    background: hsla(244, 78%, 57%, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    }
    main.index .quick-card-icon svg{
    width: 22px;
    height: 22px;
    }
    main.index .quick-card-text h3{
    font-size: 0.95rem;
    font-weight: 700;
    margin: 0 0 3px;
    }
    main.index .quick-card-text p{
    font-size: 0.8rem;
    color: var(--chrome-muted);
    margin: 0;
    }
    
    main.index .chrome-footer{
    background: hsl(244, 15%, 14%);
    color: hsla(0, 0%, 100%, 0.6);
    padding: 48px 24px 36px;
    }
    main.index .ax9{
    max-width: 1120px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    }
    main.index .gritLayer{
    font-family: "Playfair Display", serif;
    font-size: 1.15rem;
    font-weight: 700;
    color: #fff;
    }
    main.index .footer-links{
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
    }
    main.index .footer-links a{
    color: hsla(0, 0%, 100%, 0.55);
    text-decoration: none;
    font-size: 0.85rem;
    transition: color 0.2s;
    }
    main.index .footer-links a:hover{
    color: #fff;
    }
    main.index .footer-copy{
    width: 100%;
    text-align: center;
    font-size: 0.8rem;
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px solid hsla(0, 0%, 100%, 0.08);
    }
    
    @media (max-width: 900px) {main.index .kelpRun{
    grid-template-columns: repeat(2, 1fr);
    }
    main.index .platform-grid{
    grid-template-columns: repeat(2, 1fr);
    }
    main.index .smelt{
    grid-template-columns: 1fr;
    }
    main.index .shard_veil.wispFang{
    aspect-ratio: 16 / 10;
    }
    main.index .quick-grid{
    grid-template-columns: 1fr;
    }}
    @media (max-width: 600px) {main.index .dewSprig{
    padding: 56px 20px 72px;
    }
    main.index .kelpRun{
    grid-template-columns: 1fr;
    }
    main.index .platform-grid{
    grid-template-columns: 1fr 1fr;
    }
    main.index .garnet{
    gap: 20px;
    }
    main.index .ax9{
    flex-direction: column;
    text-align: center;
    }
    main.index .footer-links{
    justify-content: center;
    }}
    main.index .latchPin{
    background: hsl(244, 14%, 12%);
    color: hsl(244, 10%, 78%);
    padding: 64px 24px 32px;
    font-family: "Georgia", "Times New Roman", serif;
    }
    main.index .ax9{
    max-width: var(--max-width, 1200px);
    margin: 0 auto;
    width: 100%;
    }
    main.index .boltRig{
    display: flex;
    gap: 48px;
    align-items: flex-start;
    flex-wrap: wrap;
    }
    main.index .gritLayer{
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 200px;
    }
    main.index .zinc_bar{
    flex: 0 0 28px;
    }
    main.index .rubble{
    font-size: 17px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.02em;
    }
    main.index .junco{
    display: flex;
    gap: 48px;
    flex: 1 1 auto;
    }
    main.index .oxbow{
    flex: 1 1 0;
    min-width: 120px;
    }
    main.index .brackish{
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin: 0 0 16px;
    }
    main.index .fennel{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    }
    main.index .opal_gem{
    line-height: 1;
    }
    main.index .voltSnap{
    font-size: 14px;
    color: hsl(244, 10%, 65%);
    text-decoration: none;
    transition: var(--transition, all 0.25s ease);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }
    main.index .voltSnap:hover{
    color: #fff;
    }
    main.index .dapple{
    flex: 0 0 220px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    padding: 24px;
    background: hsla(244, 78%, 57%, 0.1);
    border-radius: var(--radius-lg, 20px);
    border: 1px solid hsla(244, 78%, 57%, 0.18); color: #ffffff;}
    main.index .fogLamp{
    font-size: 14px;
    color: hsl(244, 10%, 78%);
    margin: 0;
    line-height: 1.5;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }
    main.index .caulk_rim{
    display: inline-block;
    padding: 10px 24px;
    background: linear-gradient(135deg, var(--primary-color, hsl(244, 78%, 57%)), var(--secondary-color, hsl(333, 62%, 57%)));
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    border-radius: var(--radius-md, 12px);
    text-decoration: none;
    transition: var(--transition, all 0.25s ease);
    box-shadow: 0 4px 16px hsla(244, 78%, 57%, 0.3);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }
    main.index .caulk_rim:hover{
    transform: translateY(-1px);
    box-shadow: 0 6px 24px hsla(244, 78%, 57%, 0.4);
    }
    main.index .nudge_cap{
    height: 1px;
    background: hsla(244, 20%, 80%, 0.12);
    margin: 48px 0 24px;
    }
    main.index .tandem8{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    flex-wrap: wrap;
    }
    main.index .knotPly{
    font-size: 13px;
    color: hsl(244, 8%, 50%);
    margin: 0;
    flex: 1 1 auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }
    main.index .anvil{
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 1 auto;
    }
    main.index .prismHue{
    font-size: 13px;
    color: hsl(244, 10%, 60%);
    text-decoration: none;
    transition: var(--transition, all 0.25s ease);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }
    main.index .prismHue:hover{
    color: #fff;
    }
    main.index .stumpGlow{
    color: hsl(244, 8%, 35%);
    font-size: 13px;
    user-select: none;
    }
    main.index .scald{
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    }
    main.index .yawnDip{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    color: hsl(244, 10%, 60%);
    background: hsla(244, 20%, 80%, 0.08);
    text-decoration: none;
    transition: var(--transition, all 0.25s ease);
    }
    main.index .yawnDip:hover{
    color: #fff;
    background: hsla(244, 78%, 57%, 0.25);
    }
    @media (max-width: 768px) {main.index .latchPin{
    padding: 48px 20px 28px;
    }
    main.index .boltRig{
    flex-direction: column;
    gap: 32px;
    }
    main.index .gritLayer{
    flex: 0 0 auto;
    }
    main.index .junco{
    flex-wrap: wrap;
    gap: 32px;
    }
    main.index .oxbow{
    flex: 0 0 calc(50% - 16px);
    }
    main.index .dapple{
    flex: 0 0 auto;
    width: 100%;
    }
    main.index .tandem8{
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    }
    main.index .knotPly{
    order: 3;
    }
    main.index .anvil{
    order: 1;
    }
    main.index .scald{
    order: 2;
    }}
    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;
    }

    *,
    *::before,
    *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height);
    font-family: "Playfair Display", "Noto Serif SC", "Source Han Serif SC", Georgia, "Times New Roman", serif;
    color: var(--text-color);
    background: var(--bg-color);
    }
    
    .nimbus {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    height: var(--nav-height);
    background: rgba(240, 239, 243, 0.82);
    backdrop-filter: blur(18px) saturate(1.6);
    -webkit-backdrop-filter: blur(18px) saturate(1.6);
    border-bottom: 1px solid var(--border-color);
    }
    .jade_pip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: var(--max-width);
    height: 100%;
    margin: 0 auto;
    padding: 0 28px;
    }
    
    .rumble {
    flex-shrink: 0;
    }
    .obsidian {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--text-color);
    }
    .frozenOrb {
    display: block;
    flex-shrink: 0;
    }
    .driftKnob {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    }
    
    .quilted {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    }
    .pale_dust {
    position: relative;
    }
    .blazeKit {
    display: block;
    padding: 8px 14px;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    white-space: nowrap;
    letter-spacing: 0.01em;
    }
    .blazeKit:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.06);
    }
    
    .craggy {
    flex-shrink: 0;
    }
    .zephyr {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 26px;
    font-family: inherit;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    }
    .zephyr:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    filter: brightness(1.08);
    }
    .zephyr:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(93, 63, 211, 0.3);
    }
    
    .px_rail {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .px_rail:hover {
    background: rgba(30, 26, 56, 0.06); color: #ffffff;}
    .ember {
    display: block;
    width: 22px;
    height: 2.5px;
    background: var(--text-color);
    border-radius: 2px;
    transition: var(--transition);
    }
    
    .waxShell {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(20, 18, 40, 0.45);
    opacity: 0;
    transition: opacity 0.3s ease; color: #ffffff;}
    .waxShell.is-visible {
    display: block;
    opacity: 1;
    }
    
    .moonArc {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1200;
    width: 300px;
    max-width: 85vw;
    background: var(--bg-color);
    box-shadow: var(--shadow-lg);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    flex-direction: column;
    }
    .moonArc.is-open {
    display: flex;
    transform: translateX(0);
    }
    .sv3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 12px;
    border-bottom: 1px solid var(--border-color);
    }
    .tq7b {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-color);
    letter-spacing: -0.01em;
    }
    .fizzle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 1.5rem;
    line-height: 1;
    color: var(--text-muted);
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .fizzle:hover {
    background: rgba(30, 26, 56, 0.06);
    color: #ffffff;
    }
    .husk_tone {
    list-style: none;
    padding: 12px 16px;
    flex: 1;
    }
    .crumble {
    border-radius: var(--radius-sm);
    }
    .vortex9 {
    display: block;
    padding: 13px 12px;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    }
    .vortex9:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.05);
    }
    .plume {
    padding: 16px 24px 28px;
    }
    .gnarly {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 14px 20px;
    font-family: inherit;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    }
    .gnarly:hover {
    filter: brightness(1.08);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    }
    
    @media (max-width: 960px) {.quilted {
    display: none;
    }
    .craggy {
    display: none;
    }
    .px_rail {
    display: flex;
    }}
    @media (min-width: 961px) {.waxShell,
    .moonArc {
    display: none !important;
    }}
    .blazeKit.active {color: #ffffff; background: rgba(30, 26, 56, 0.06);}
    .vortex9.active {color: #ffffff; background: rgba(30, 26, 56, 0.05);}
    @import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;700;800&family=Inter:wght@400;500;600;700&display=swap");
    main.download *{ margin: 0; padding: 0; box-sizing: border-box; }
    main.download{
    font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--dl-text);
    background: var(--dl-bg);
    line-height: 1.6;
    overflow-x: hidden;
    }
    main.download .spud8{
    font-family: "Playfair Display", Georgia, serif;
    }
    
    main.download .cleat_hop{
    position: relative;
    padding: 80px 24px 60px;
    background: linear-gradient(160deg, hsl(244, 30%, 98%) 0%, hsl(244, 20%, 93%) 50%, hsl(333, 15%, 93%) 100%);
    text-align: center;
    overflow: hidden;
    }
    main.download .cleat_hop::before{
    content: "";
    position: absolute;
    top: -200px;
    right: -200px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, hsla(244, 78%, 57%, 0.07) 0%, transparent 70%);
    border-radius: 50%; color: #ffffff;}
    main.download .cleat_hop::after{
    content: "";
    position: absolute;
    bottom: -150px;
    left: -150px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, hsla(333, 62%, 57%, 0.06) 0%, transparent 70%);
    border-radius: 50%;
    }
    main.download .lignite{
    position: relative;
    z-index: 1;
    max-width: 720px;
    margin: 0 auto;
    }
    main.download .chirpNod{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 16px;
    background: var(--dl-bg-white);
    border-radius: 100px;
    font-size: 13px;
    font-weight: 600;
    color: var(--dl-primary);
    box-shadow: var(--dl-shadow-sm);
    margin-bottom: 28px;
    }
    main.download .chirpNod svg{
    width: 14px;
    height: 14px;
    }
    main.download .cleat_hop h1{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(2.2rem, 5.5vw, 3.6rem);
    font-weight: 800;
    line-height: 1.15;
    color: var(--dl-text);
    margin-bottom: 18px;
    letter-spacing: -0.02em;
    }
    main.download .cleat_hop h1 .plank{
    background: var(--dl-gradient-primary);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    }
    main.download .galvanic{
    font-size: 17px;
    color: var(--dl-text-muted);
    max-width: 540px;
    margin: 0 auto 36px;
    line-height: 1.7;
    }
    main.download .brambleVex{
    font-size: 13px;
    color: var(--dl-text-muted);
    margin-top: 20px;
    }
    main.download .brambleVex span{
    font-weight: 600;
    color: var(--dl-text);
    }
    
    main.download .dint9{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    }
    main.download .reef_tab{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 18px 44px;
    background: var(--dl-gradient-primary);
    color: #fff;
    font-size: 17px;
    font-weight: 700;
    border: none;
    border-radius: var(--dl-radius-lg);
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 8px 32px rgba(90, 60, 180, 0.3), 0 2px 8px rgba(90, 60, 180, 0.15);
    transition: transform 0.2s, box-shadow 0.2s;
    letter-spacing: 0.01em;
    }
    main.download .reef_tab:hover{
    transform: translateY(-2px);
    box-shadow: 0 12px 40px rgba(90, 60, 180, 0.38), 0 4px 12px rgba(90, 60, 180, 0.2);
    }
    main.download .reef_tab svg{
    width: 20px;
    height: 20px;
    }
    main.download .blotHex{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 22px;
    background: var(--dl-bg-white);
    color: var(--dl-primary);
    font-size: 14px;
    font-weight: 600;
    border: 2px solid hsl(244, 30%, 88%);
    border-radius: var(--dl-radius-md);
    cursor: pointer;
    text-decoration: none;
    transition: border-color 0.2s, background 0.2s;
    }
    main.download .blotHex:hover{
    border-color: var(--dl-primary);
    background: hsl(244, 40%, 97%);
    }
    
    main.download .cuspArc{
    padding: 70px 24px;
    max-width: 1120px;
    margin: 0 auto;
    }
    main.download .cob{
    text-align: center;
    margin-bottom: 48px;
    }
    main.download .cob h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.6rem, 3.5vw, 2.2rem);
    font-weight: 700;
    margin-bottom: 12px;
    letter-spacing: -0.01em;
    }
    main.download .cob p{
    font-size: 15px;
    color: var(--dl-text-muted);
    max-width: 560px;
    margin: 0 auto;
    }
    main.download .quill_jab{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 20px;
    }
    main.download .talc{
    background: var(--dl-bg-white);
    border-radius: var(--dl-radius-lg);
    padding: 36px 28px 32px;
    box-shadow: var(--dl-shadow-sm);
    border: 1px solid hsl(244, 10%, 91%);
    transition: box-shadow 0.25s, transform 0.25s;
    display: flex;
    flex-direction: column;
    }
    main.download .talc:hover{
    box-shadow: var(--dl-shadow-md);
    transform: translateY(-4px);
    }
    main.download .sluice{
    width: 52px;
    height: 52px;
    border-radius: var(--dl-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    background: hsl(244, 30%, 96%);
    }
    main.download .sluice svg{
    width: 26px;
    height: 26px;
    color: var(--dl-primary);
    }
    main.download .talc h3{
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 6px;
    }
    main.download .verdigris{
    font-size: 13px;
    color: var(--dl-text-muted);
    margin-bottom: 16px;
    line-height: 1.65;
    }
    main.download .verdigris strong{
    color: var(--dl-text);
    font-weight: 600;
    }
    main.download .tuft3{
    font-size: 12.5px;
    color: var(--dl-text-muted);
    padding: 12px 0;
    border-top: 1px solid hsl(244, 10%, 93%);
    margin-top: auto;
    margin-bottom: 18px;
    line-height: 1.7;
    }
    main.download .mizzle{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px 20px;
    background: var(--dl-primary);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    border: none;
    border-radius: var(--dl-radius-sm);
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s, box-shadow 0.2s;
    box-shadow: 0 4px 14px rgba(90, 60, 180, 0.2);
    }
    main.download .mizzle:hover{
    background: var(--dl-primary-dark);
    box-shadow: 0 6px 20px rgba(90, 60, 180, 0.28);
    }
    main.download .mizzle svg{
    width: 16px;
    height: 16px;
    }
    main.download .dl-platform-btn-alt{
    background: var(--dl-secondary);
    box-shadow: 0 4px 14px rgba(190, 60, 120, 0.2);
    }
    main.download .dl-platform-btn-alt:hover{
    background: var(--dl-secondary-dark);
    box-shadow: 0 6px 20px rgba(190, 60, 120, 0.28);
    }
    
    main.download .dl-install-section{
    background: var(--dl-bg-white);
    border-radius: var(--dl-radius-xl);
    padding: 56px 40px;
    margin: 0 auto 0;
    max-width: 1120px;
    box-shadow: var(--dl-shadow-sm);
    border: 1px solid hsl(244, 10%, 91%);
    }
    main.download .dl-install-tabs{
    display: flex;
    gap: 8px;
    margin-bottom: 36px;
    flex-wrap: wrap;
    justify-content: center;
    }
    main.download .dl-tab{
    padding: 10px 22px;
    font-size: 14px;
    font-weight: 600;
    border: 2px solid hsl(244, 15%, 88%);
    border-radius: 100px;
    background: transparent;
    color: var(--dl-text-muted);
    cursor: pointer;
    transition: all 0.2s;
    }
    main.download .dl-tab.active{
    background: var(--dl-primary);
    color: #fff;
    border-color: var(--dl-primary);
    }
    main.download .dl-tab:hover:not(.active){
    border-color: var(--dl-primary);
    color: var(--dl-primary);
    }
    main.download .dl-steps{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 24px;
    }
    main.download .dl-step{
    text-align: center;
    padding: 24px 16px;
    }
    main.download .dl-step-num{
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--dl-gradient-primary);
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 16px;
    }
    main.download .dl-step h4{
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 8px;
    }
    main.download .dl-step p{
    font-size: 13.5px;
    color: var(--dl-text-muted);
    line-height: 1.65;
    }
    
    main.download .dl-feature-banner{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 24px;
    }
    main.download .dl-feature-card{
    position: relative;
    border-radius: var(--dl-radius-xl);
    overflow: hidden;
    min-height: 280px;
    display: flex;
    align-items: flex-end;
    }
    main.download .dl-feature-card img{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    }
    main.download .dl-feature-overlay{
    position: relative;
    z-index: 1;
    padding: 32px;
    background: linear-gradient(to top, rgba(20, 15, 50, 0.85) 0%, rgba(20, 15, 50, 0.3) 70%, transparent 100%);
    width: 100%; color: #ffffff;}
    main.download .dl-feature-overlay h3{
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 6px;
    }
    main.download .dl-feature-overlay p{
    color: rgba(255, 255, 255, 0.82);
    font-size: 13.5px;
    line-height: 1.6;
    }
    main.download .dl-feature-overlay a{
    color: hsl(244, 80%, 78%);
    font-weight: 600;
    text-decoration: none;
    font-size: 13.5px;
    }
    main.download .dl-feature-overlay a:hover{
    text-decoration: underline;
    }
    
    main.download .dl-security{
    max-width: 1120px;
    margin: 0 auto;
    padding: 70px 24px;
    }
    main.download .dl-security-inner{
    background: linear-gradient(160deg, hsl(244, 25%, 16%), hsl(244, 30%, 12%));
    border-radius: var(--dl-radius-xl);
    padding: 56px 48px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center; color: #ffffff;}
    main.download .dl-security-text h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    color: #fff;
    margin-bottom: 16px;
    }
    main.download .dl-security-text p{
    color: rgba(255, 255, 255, 0.72);
    font-size: 15px;
    line-height: 1.7;
    margin-bottom: 12px;
    }
    main.download .dl-security-text a{
    color: hsl(244, 80%, 78%);
    font-weight: 600;
    text-decoration: none;
    font-size: 14px;
    }
    main.download .dl-security-text a:hover{
    text-decoration: underline;
    }
    main.download .dl-security-list{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    }
    main.download .dl-security-item{
    background: rgba(255, 255, 255, 0.06);
    border-radius: var(--dl-radius-md);
    padding: 20px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    }
    main.download .dl-security-item svg{
    width: 22px;
    height: 22px;
    color: hsl(244, 80%, 78%);
    margin-bottom: 10px;
    }
    main.download .dl-security-item h4{
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 4px;
    }
    main.download .dl-security-item p{
    color: rgba(255, 255, 255, 0.58);
    font-size: 12.5px;
    line-height: 1.55;
    margin: 0;
    }
    
    main.download .dl-offline{
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 24px 70px;
    }
    main.download .dl-offline-inner{
    background: var(--dl-bg-white);
    border-radius: var(--dl-radius-xl);
    padding: 48px;
    box-shadow: var(--dl-shadow-sm);
    border: 1px solid hsl(244, 10%, 91%);
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 48px;
    align-items: center;
    }
    main.download .dl-offline-text h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.4rem, 2.8vw, 1.8rem);
    font-weight: 700;
    margin-bottom: 14px;
    }
    main.download .dl-offline-text p{
    font-size: 14.5px;
    color: var(--dl-text-muted);
    line-height: 1.7;
    margin-bottom: 10px;
    }
    main.download .dl-offline-table{
    width: 100%;
    border-collapse: collapse;
    font-size: 13.5px;
    }
    main.download .dl-offline-table th{
    text-align: left;
    padding: 12px 16px;
    background: hsl(244, 15%, 96%);
    font-weight: 600;
    font-size: 12.5px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--dl-text-muted);
    border-radius: var(--dl-radius-sm) var(--dl-radius-sm) 0 0;
    }
    main.download .dl-offline-table td{
    padding: 11px 16px;
    border-bottom: 1px solid hsl(244, 10%, 93%);
    color: var(--dl-text);
    }
    main.download .dl-offline-table tr:last-child td{
    border-bottom: none;
    }
    main.download .dl-offline-table .dl-size{
    font-weight: 600;
    color: var(--dl-primary);
    }
    
    main.download .dl-links-section{
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 24px 70px;
    }
    main.download .dl-links-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
    }
    main.download .dl-link-card{
    background: var(--dl-bg-white);
    border-radius: var(--dl-radius-lg);
    padding: 28px 24px;
    border: 1px solid hsl(244, 10%, 91%);
    text-decoration: none;
    color: var(--dl-text);
    transition: box-shadow 0.25s, transform 0.25s;
    display: flex;
    align-items: center;
    gap: 16px;
    }
    main.download .dl-link-card:hover{
    box-shadow: var(--dl-shadow-md);
    transform: translateY(-3px);
    }
    main.download .dl-link-icon{
    width: 44px;
    height: 44px;
    border-radius: var(--dl-radius-sm);
    background: hsl(244, 30%, 96%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    }
    main.download .dl-link-icon svg{
    width: 20px;
    height: 20px;
    color: var(--dl-primary);
    }
    main.download .dl-link-card h3{
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 3px;
    }
    main.download .dl-link-card p{
    font-size: 12.5px;
    color: var(--dl-text-muted);
    }
    
    main.download .dl-footer{
    background: hsl(244, 20%, 14%);
    padding: 40px 24px;
    text-align: center; color: #ffffff;}
    main.download .dl-footer-brand{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 8px;
    }
    main.download .dl-footer-copy{
    font-size: 13px;
    color: rgba(255, 255, 255, 0.45);
    margin-bottom: 16px;
    }
    main.download .dl-footer-links{
    display: flex;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
    }
    main.download .dl-footer-links a{
    font-size: 13px;
    color: rgba(255, 255, 255, 0.55);
    text-decoration: none;
    transition: color 0.2s;
    }
    main.download .dl-footer-links a:hover{
    color: #fff;
    }
    
    @media (max-width: 860px) {main.download .dl-feature-banner{
    grid-template-columns: 1fr;
    }
    main.download .dl-security-inner{
    grid-template-columns: 1fr;
    padding: 40px 28px;
    }
    main.download .dl-security-list{
    grid-template-columns: 1fr 1fr;
    }
    main.download .dl-offline-inner{
    grid-template-columns: 1fr;
    padding: 36px 28px;
    }
    main.download .dl-install-section{
    padding: 40px 24px;
    border-radius: var(--dl-radius-lg);
    }}
    @media (max-width: 600px) {main.download .cleat_hop{
    padding: 60px 20px 48px;
    }
    main.download .cuspArc{
    padding: 50px 16px;
    }
    main.download .quill_jab{
    grid-template-columns: 1fr;
    }
    main.download .dl-security-list{
    grid-template-columns: 1fr;
    }
    main.download .dl-steps{
    grid-template-columns: 1fr;
    }
    main.download .dl-feature-banner{
    padding: 0 16px;
    }
    main.download .dl-links-grid{
    grid-template-columns: 1fr;
    }}
    main.download .mossTap{
    background: hsl(244, 12%, 13%);
    color: hsl(244, 10%, 78%);
    padding: 0;
    font-family: "Georgia", "Noto Serif SC", "Source Han Serif SC", serif;
    }
    main.download .nook{
    max-width: var(--max-width, 1200px);
    margin: 0 auto;
    padding: 48px 32px 32px;
    }
    main.download .oysterHum{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 24px;
    padding-bottom: 40px;
    }
    main.download .tramLine{
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 0 0 auto;
    }
    main.download .ebb_curl{
    flex: 0 0 28px;
    }
    main.download .rind{
    font-size: 1.2rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.01em;
    }
    main.download .cruxPin{
    display: flex;
    align-items: center;
    gap: 20px;
    flex: 0 1 auto;
    flex-wrap: wrap;
    }
    main.download .swirl_pod{
    font-size: 0.95rem;
    color: hsl(244, 10%, 62%);
    }
    main.download .pewRing{
    display: inline-block;
    padding: 12px 28px;
    background: linear-gradient(135deg, var(--primary-color, hsl(244, 78%, 57%)), var(--secondary-color, hsl(333, 62%, 57%)));
    color: #fff;
    font-size: 0.9rem;
    font-weight: 600;
    font-family: inherit;
    text-decoration: none;
    border-radius: var(--radius-lg, 20px);
    box-shadow: 0 4px 20px rgba(99, 66, 235, 0.35);
    transition: var(--transition, all 0.25s cubic-bezier(0.4, 0, 0.2, 1));
    }
    main.download .pewRing:hover{
    box-shadow: 0 6px 28px rgba(99, 66, 235, 0.5);
    transform: translateY(-1px);
    }
    main.download .snag_web{
    height: 1px;
    background: rgba(255, 255, 255, 0.08);
    border: none;
    }
    main.download .pebbleFog{
    display: flex;
    gap: 24px;
    padding: 40px 0;
    flex-wrap: wrap;
    }
    main.download .kettle{
    flex: 1 1 160px;
    min-width: 140px;
    }
    main.download .rusk{
    font-size: 0.82rem;
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin: 0 0 18px;
    }
    main.download .gust_ray{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    }
    main.download .flint{
    line-height: 1.4;
    }
    main.download .roamDye{
    color: hsl(244, 10%, 62%);
    text-decoration: none;
    font-size: 0.88rem;
    transition: var(--transition, all 0.25s cubic-bezier(0.4, 0, 0.2, 1));
    }
    main.download .roamDye:hover{
    color: #fff;
    }
    main.download .groutPeg{
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    }
    main.download .dab7{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: var(--radius-md, 12px);
    background: rgba(255, 255, 255, 0.06);
    color: hsl(244, 10%, 62%);
    text-decoration: none;
    transition: var(--transition, all 0.25s cubic-bezier(0.4, 0, 0.2, 1));
    }
    main.download .dab7:hover{
    background: var(--primary-color, hsl(244, 78%, 57%));
    color: #fff;
    }
    main.download .xylem{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    padding-top: 28px;
    }
    main.download .lapelFin{
    margin: 0;
    font-size: 0.82rem;
    color: hsl(244, 8%, 44%);
    flex: 1 1 auto;
    }
    main.download .fawnMesh{
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 1 auto;
    flex-wrap: wrap;
    }
    main.download .gorseNip{
    color: hsl(244, 8%, 50%);
    text-decoration: none;
    font-size: 0.82rem;
    transition: var(--transition, all 0.25s cubic-bezier(0.4, 0, 0.2, 1));
    }
    main.download .gorseNip:hover{
    color: #fff;
    }
    main.download .vim_sash{
    color: hsl(244, 8%, 32%);
    font-size: 0.82rem;
    user-select: none;
    }
    @media (max-width: 768px) {main.download .nook{
    padding: 36px 20px 24px;
    }
    main.download .oysterHum{
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding-bottom: 32px;
    }
    main.download .cruxPin{
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    }
    main.download .pebbleFog{
    gap: 32px 20px;
    padding: 32px 0;
    }
    main.download .kettle{
    flex: 1 1 calc(50% - 10px);
    min-width: 130px;
    }
    main.download .xylem{
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding-top: 24px;
    }}
    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;
    }

    *,
    *::before,
    *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height);
    font-family: "Playfair Display", "Noto Serif SC", "Source Han Serif SC", Georgia, "Times New Roman", serif;
    color: var(--text-color);
    background: var(--bg-color);
    }
    
    .nimbus {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    height: var(--nav-height);
    background: rgba(240, 239, 243, 0.82);
    backdrop-filter: blur(18px) saturate(1.6);
    -webkit-backdrop-filter: blur(18px) saturate(1.6);
    border-bottom: 1px solid var(--border-color);
    }
    .jade_pip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: var(--max-width);
    height: 100%;
    margin: 0 auto;
    padding: 0 28px;
    }
    
    .rumble {
    flex-shrink: 0;
    }
    .obsidian {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--text-color);
    }
    .frozenOrb {
    display: block;
    flex-shrink: 0;
    }
    .driftKnob {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    }
    
    .quilted {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    }
    .pale_dust {
    position: relative;
    }
    .blazeKit {
    display: block;
    padding: 8px 14px;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    white-space: nowrap;
    letter-spacing: 0.01em;
    }
    .blazeKit:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.06);
    }
    
    .craggy {
    flex-shrink: 0;
    }
    .zephyr {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 26px;
    font-family: inherit;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    }
    .zephyr:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    filter: brightness(1.08);
    }
    .zephyr:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(93, 63, 211, 0.3);
    }
    
    .px_rail {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .px_rail:hover {
    background: rgba(30, 26, 56, 0.06); color: #ffffff;}
    .ember {
    display: block;
    width: 22px;
    height: 2.5px;
    background: var(--text-color);
    border-radius: 2px;
    transition: var(--transition);
    }
    
    .waxShell {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(20, 18, 40, 0.45);
    opacity: 0;
    transition: opacity 0.3s ease; color: #ffffff;}
    .waxShell.is-visible {
    display: block;
    opacity: 1;
    }
    
    .moonArc {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1200;
    width: 300px;
    max-width: 85vw;
    background: var(--bg-color);
    box-shadow: var(--shadow-lg);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    flex-direction: column;
    }
    .moonArc.is-open {
    display: flex;
    transform: translateX(0);
    }
    .sv3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 12px;
    border-bottom: 1px solid var(--border-color);
    }
    .tq7b {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-color);
    letter-spacing: -0.01em;
    }
    .fizzle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 1.5rem;
    line-height: 1;
    color: var(--text-muted);
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .fizzle:hover {
    background: rgba(30, 26, 56, 0.06);
    color: #ffffff;
    }
    .husk_tone {
    list-style: none;
    padding: 12px 16px;
    flex: 1;
    }
    .crumble {
    border-radius: var(--radius-sm);
    }
    .vortex9 {
    display: block;
    padding: 13px 12px;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    }
    .vortex9:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.05);
    }
    .plume {
    padding: 16px 24px 28px;
    }
    .gnarly {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 14px 20px;
    font-family: inherit;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    }
    .gnarly:hover {
    filter: brightness(1.08);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    }
    
    @media (max-width: 960px) {.quilted {
    display: none;
    }
    .craggy {
    display: none;
    }
    .px_rail {
    display: flex;
    }}
    @media (min-width: 961px) {.waxShell,
    .moonArc {
    display: none !important;
    }}
    .blazeKit.active {color: #ffffff; background: rgba(30, 26, 56, 0.06);}
    .vortex9.active {color: #ffffff; background: rgba(30, 26, 56, 0.05);}
    @import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700;800&family=Inter:wght@400;500;600;700&display=swap");
    main.mobile *{ margin: 0; padding: 0; box-sizing: border-box; }
    main.mobile{
    font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--page-text);
    background: var(--page-bg);
    overflow-x: hidden;
    line-height: 1.7;
    }
    main.mobile .umbra{ font-family: "Playfair Display", Georgia, serif; }
    
    main.mobile .zenith{
    position: relative;
    padding: 72px 20px 56px;
    background: var(--page-gradient-hero);
    text-align: center;
    overflow: hidden;
    }
    main.mobile .zenith::before{
    content: "";
    position: absolute;
    top: -40%;
    right: -30%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, hsla(0,0%,100%,0.1) 0%, transparent 70%);
    border-radius: 50%;
    }
    main.mobile .zenith::after{
    content: "";
    position: absolute;
    bottom: -20%;
    left: -20%;
    width: 350px;
    height: 350px;
    background: radial-gradient(circle, hsla(333,62%,57%,0.25) 0%, transparent 70%);
    border-radius: 50%;
    }
    main.mobile .quartz{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 16px;
    background: hsla(0,0%,100%,0.15);
    backdrop-filter: blur(8px);
    border: 1px solid hsla(0,0%,100%,0.2);
    border-radius: 100px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 24px;
    position: relative;
    z-index: 1;
    }
    main.mobile .quartz svg{
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    }
    main.mobile .zenith h1{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 36px;
    font-weight: 800;
    color: #fff;
    line-height: 1.2;
    margin-bottom: 16px;
    position: relative;
    z-index: 1;
    }
    main.mobile .cipher{
    font-size: 15px;
    color: hsla(0,0%,100%,0.88);
    max-width: 480px;
    margin: 0 auto 32px;
    line-height: 1.7;
    position: relative;
    z-index: 1;
    }
    main.mobile .mosaic{
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    position: relative;
    z-index: 1;
    }
    main.mobile .fable{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 15px 36px;
    border-radius: 100px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.25s ease;
    cursor: pointer;
    border: none;
    min-width: 220px;
    }
    main.mobile .prism{
    background: #fff;
    color: var(--page-primary);
    box-shadow: 0 4px 20px hsla(244, 78%, 30%, 0.25);
    }
    main.mobile .prism:hover{
    transform: translateY(-2px);
    box-shadow: 0 6px 28px hsla(244, 78%, 30%, 0.35);
    }
    main.mobile .mango{
    background: hsla(0,0%,100%,0.15);
    backdrop-filter: blur(8px);
    color: #fff;
    border: 1.5px solid hsla(0,0%,100%,0.35);
    }
    main.mobile .mango:hover{
    background: hsla(0,0%,100%,0.25);
    transform: translateY(-2px);
    }
    main.mobile .fable svg{
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    }
    main.mobile .riddle{
    margin-top: 28px;
    display: flex;
    justify-content: center;
    gap: 24px;
    position: relative;
    z-index: 1;
    }
    main.mobile .phantom{
    text-align: center;
    }
    main.mobile .spark{
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    font-family: "Playfair Display", Georgia, serif;
    }
    main.mobile .helix{
    font-size: 11px;
    color: hsla(0,0%,100%,0.7);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 2px;
    }
    
    main.mobile .cobalt{
    padding: 56px 20px;
    }
    main.mobile .mob-section--alt{
    background: var(--page-white);
    }
    main.mobile .flux{
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: var(--page-primary);
    margin-bottom: 8px;
    }
    main.mobile .pulse{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 12px;
    color: var(--page-text);
    }
    main.mobile .bloom{
    font-size: 14px;
    color: var(--page-gray-500);
    line-height: 1.7;
    max-width: 560px;
    margin-bottom: 32px;
    }
    
    main.mobile .aurora{
    display: flex;
    flex-direction: column;
    gap: 16px;
    }
    main.mobile .glyph{
    background: var(--page-white);
    border-radius: var(--page-radius-lg);
    padding: 28px 24px;
    box-shadow: var(--page-shadow-card);
    border: 1px solid var(--page-gray-200);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    }
    main.mobile .mob-section--alt .glyph{
    background: var(--page-gray-100);
    border-color: var(--page-gray-200);
    }
    main.mobile .glyph:hover{
    transform: translateY(-2px);
    box-shadow: var(--page-shadow-elevated);
    }
    main.mobile .relic{
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
    }
    main.mobile .nexus{
    width: 48px;
    height: 48px;
    border-radius: var(--page-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    }
    main.mobile .velvet{
    background: linear-gradient(135deg, #34a853 0%, #0f9d58 100%);
    }
    main.mobile .onyx{
    background: linear-gradient(135deg, #555 0%, #222 100%); color: #ffffff;}
    main.mobile .nexus svg{
    width: 24px;
    height: 24px;
    fill: #fff;
    }
    main.mobile .glacier{
    font-size: 18px;
    font-weight: 700;
    color: var(--page-text);
    }
    main.mobile .latch{
    font-size: 12px;
    color: var(--page-gray-500);
    margin-top: 2px;
    }
    main.mobile .crest{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 20px;
    }
    main.mobile .totem{
    padding: 12px;
    background: var(--page-bg);
    border-radius: var(--page-radius-sm);
    }
    main.mobile .mob-section--alt .totem{
    background: var(--page-white);
    }
    main.mobile .axiom{
    font-size: 11px;
    color: var(--page-gray-500);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
    }
    main.mobile .dusk{
    font-size: 14px;
    font-weight: 600;
    color: var(--page-text);
    }
    main.mobile .karma{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 600;
    color: var(--page-primary);
    text-decoration: none;
    transition: gap 0.2s ease;
    }
    main.mobile .karma:hover{
    gap: 10px;
    }
    main.mobile .karma svg{
    width: 16px;
    height: 16px;
    }
    
    main.mobile .mob-feature-visual{
    position: relative;
    border-radius: var(--page-radius-xl);
    overflow: hidden;
    margin-bottom: 32px;
    aspect-ratio: 16 / 10;
    }
    main.mobile .mob-feature-visual img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    }
    main.mobile .mob-feature-visual__overlay{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 24px;
    background: linear-gradient(to top, hsla(244, 30%, 10%, 0.75) 0%, transparent 100%); color: #ffffff;}
    main.mobile .mob-feature-visual__overlay p{
    color: #fff;
    font-size: 14px;
    line-height: 1.6;
    }
    
    main.mobile .sync-grid{
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    }
    main.mobile .sync-item{
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 20px;
    background: var(--page-white);
    border-radius: var(--page-radius-md);
    border: 1px solid var(--page-gray-200);
    transition: box-shadow 0.2s ease;
    }
    main.mobile .sync-item:hover{
    box-shadow: var(--page-shadow-soft);
    }
    main.mobile .sync-item__icon{
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: linear-gradient(135deg, var(--page-primary), hsl(270, 65%, 58%));
    }
    main.mobile .sync-item__icon svg{
    width: 20px;
    height: 20px;
    fill: none;
    stroke: #fff;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    }
    main.mobile .sync-item__text h3{
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 4px;
    color: var(--page-text);
    }
    main.mobile .sync-item__text p{
    font-size: 13px;
    color: var(--page-gray-500);
    line-height: 1.6;
    }
    
    main.mobile .steps-list{
    display: flex;
    flex-direction: column;
    gap: 16px;
    counter-reset: step-counter;
    }
    main.mobile .step-card{
    display: flex;
    gap: 16px;
    padding: 22px 20px;
    background: var(--page-gray-100);
    border-radius: var(--page-radius-md);
    counter-increment: step-counter;
    position: relative;
    }
    main.mobile .step-card__num{
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--page-gradient-hero);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0;
    }
    main.mobile .step-card__body h3{
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 4px;
    color: var(--page-text);
    }
    main.mobile .step-card__body p{
    font-size: 13px;
    color: var(--page-gray-500);
    line-height: 1.6;
    }
    
    main.mobile .speed-visual{
    border-radius: var(--page-radius-xl);
    overflow: hidden;
    margin-top: 28px;
    box-shadow: var(--page-shadow-card);
    }
    main.mobile .speed-visual img{
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    }
    
    main.mobile .faq-list{
    display: flex;
    flex-direction: column;
    gap: 12px;
    }
    main.mobile .faq-item{
    background: var(--page-white);
    border-radius: var(--page-radius-md);
    border: 1px solid var(--page-gray-200);
    overflow: hidden;
    }
    main.mobile .faq-item summary{
    padding: 18px 20px;
    font-size: 15px;
    font-weight: 600;
    color: var(--page-text);
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    }
    main.mobile .faq-item summary::-webkit-details-marker{ display: none; }
    main.mobile .faq-item summary::after{
    content: "";
    width: 20px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    flex-shrink: 0;
    transition: transform 0.25s ease;
    }
    main.mobile .faq-item[open] summary::after{
    transform: rotate(180deg);
    }
    main.mobile .faq-item__answer{
    padding: 0 20px 18px;
    font-size: 14px;
    color: var(--page-gray-500);
    line-height: 1.7;
    }
    main.mobile .faq-item__answer a{
    color: var(--page-primary);
    text-decoration: none;
    font-weight: 500;
    }
    main.mobile .faq-item__answer a:hover{
    text-decoration: underline;
    }
    
    main.mobile .mob-cta-banner{
    margin: 0 20px 56px;
    padding: 40px 24px;
    background: var(--page-gradient-hero);
    border-radius: var(--page-radius-xl);
    text-align: center;
    position: relative;
    overflow: hidden;
    }
    main.mobile .mob-cta-banner::before{
    content: "";
    position: absolute;
    top: -50%;
    left: -30%;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, hsla(0,0%,100%,0.08) 0%, transparent 70%);
    border-radius: 50%;
    }
    main.mobile .mob-cta-banner h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 26px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 12px;
    position: relative;
    z-index: 1;
    }
    main.mobile .mob-cta-banner p{
    font-size: 14px;
    color: hsla(0,0%,100%,0.85);
    margin-bottom: 24px;
    position: relative;
    z-index: 1;
    }
    main.mobile .mob-cta-banner .prism{
    position: relative;
    z-index: 1;
    }
    
    main.mobile .mob-footer{
    background: var(--page-text);
    padding: 40px 20px 32px;
    color: hsla(0,0%,100%,0.6);
    }
    main.mobile .mob-footer__brand{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 8px;
    }
    main.mobile .mob-footer__tagline{
    font-size: 13px;
    color: hsla(0,0%,100%,0.45);
    margin-bottom: 28px;
    }
    main.mobile .mob-footer__links{
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
    margin-bottom: 28px;
    }
    main.mobile .mob-footer__links a{
    font-size: 13px;
    color: hsla(0,0%,100%,0.55);
    text-decoration: none;
    transition: color 0.2s ease;
    }
    main.mobile .mob-footer__links a:hover{
    color: #fff;
    }
    main.mobile .mob-footer__divider{
    height: 1px;
    background: hsla(0,0%,100%,0.1);
    margin-bottom: 20px;
    }
    main.mobile .mob-footer__copy{
    font-size: 12px;
    color: hsla(0,0%,100%,0.35);
    }
    
    main.mobile .inline-link{
    color: var(--page-primary);
    text-decoration: none;
    font-weight: 500;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s ease;
    }
    main.mobile .inline-link:hover{
    border-bottom-color: var(--page-primary);
    }
    
    @media (min-width: 480px) {main.mobile .zenith h1{ font-size: 42px; }
    main.mobile .mosaic{ flex-direction: row; justify-content: center; }
    main.mobile .pulse{ font-size: 32px; }
    main.mobile .sync-grid{ grid-template-columns: 1fr 1fr; }}
    @media (min-width: 768px) {main.mobile .zenith{ padding: 96px 32px 72px; }
    main.mobile .zenith h1{ font-size: 48px; }
    main.mobile .cobalt{ padding: 72px 32px; }
    main.mobile .aurora{ flex-direction: row; }
    main.mobile .glyph{ flex: 1; }
    main.mobile .pulse{ font-size: 36px; }}
    main.mobile .scrim{
    background: hsl(244, 12%, 13%);
    padding: 36px 20px 32px;
    width: 100%;
    box-sizing: border-box; color: #ffffff;}
    main.mobile .vortex{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 22px;
    max-width: 480px;
    margin: 0 auto;
    width: 100%;
    }
    main.mobile .basalt{
    display: flex;
    align-items: center;
    gap: 10px;
    }
    main.mobile .orbit{
    flex: 0 0 28px;
    display: block;
    }
    main.mobile .jade{
    font-family: Georgia, "Times New Roman", serif;
    font-size: 17px;
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.02em;
    line-height: 1.2;
    }
    main.mobile .opal{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 6px 4px;
    }
    main.mobile .wren{
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 13.5px;
    color: hsl(244, 15%, 68%);
    text-decoration: none;
    padding: 4px 6px;
    border-radius: var(--radius-sm, 6px);
    transition: var(--transition, all 0.25s ease);
    line-height: 1.4;
    }
    main.mobile .wren:hover{
    color: #fff;
    background: hsla(244, 60%, 60%, 0.15);
    }
    main.mobile .tundra{
    color: hsl(244, 10%, 38%);
    font-size: 14px;
    line-height: 1;
    flex: 0 0 auto;
    user-select: none;
    }
    main.mobile .mirage{
    display: flex;
    justify-content: center;
    width: 100%;
    }
    main.mobile .sable{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 300px;
    padding: 13px 24px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, var(--primary-color, hsl(244, 78%, 57%)), var(--secondary-color, hsl(333, 62%, 57%)));
    border: none;
    border-radius: var(--radius-lg, 20px);
    text-decoration: none;
    letter-spacing: 0.01em;
    box-shadow: 0 4px 18px hsla(244, 78%, 45%, 0.35);
    transition: var(--transition, all 0.25s ease);
    cursor: pointer;
    line-height: 1.3;
    text-align: center;
    }
    main.mobile .sable:hover{
    box-shadow: 0 6px 24px hsla(288, 70%, 50%, 0.4);
    transform: translateY(-1px);
    }
    main.mobile .nectar{
    width: 60%;
    height: 1px;
    background: hsla(244, 20%, 50%, 0.18);
    flex: 0 0 1px;
    }
    main.mobile .ivory{
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 12px;
    color: hsl(244, 8%, 44%);
    text-align: center;
    margin: 0;
    line-height: 1.5;
    letter-spacing: 0.01em;
    }
    @media (max-width: 360px) {main.mobile .scrim{
    padding: 28px 16px 24px;
    }
    main.mobile .vortex{
    gap: 18px;
    }
    main.mobile .jade{
    font-size: 15px;
    }
    main.mobile .wren{
    font-size: 12.5px;
    padding: 3px 4px;
    }
    main.mobile .sable{
    font-size: 14px;
    padding: 12px 20px;
    }
    main.mobile .nectar{
    width: 80%;
    }}
    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;
    }

    *,
    *::before,
    *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height);
    font-family: "Playfair Display", "Noto Serif SC", "Source Han Serif SC", Georgia, "Times New Roman", serif;
    color: var(--text-color);
    background: var(--bg-color);
    }
    
    .nimbus {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    height: var(--nav-height);
    background: rgba(240, 239, 243, 0.82);
    backdrop-filter: blur(18px) saturate(1.6);
    -webkit-backdrop-filter: blur(18px) saturate(1.6);
    border-bottom: 1px solid var(--border-color);
    }
    .jade_pip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: var(--max-width);
    height: 100%;
    margin: 0 auto;
    padding: 0 28px;
    }
    
    .rumble {
    flex-shrink: 0;
    }
    .obsidian {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--text-color);
    }
    .frozenOrb {
    display: block;
    flex-shrink: 0;
    }
    .driftKnob {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    }
    
    .quilted {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    }
    .pale_dust {
    position: relative;
    }
    .blazeKit {
    display: block;
    padding: 8px 14px;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    white-space: nowrap;
    letter-spacing: 0.01em;
    }
    .blazeKit:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.06);
    }
    
    .craggy {
    flex-shrink: 0;
    }
    .zephyr {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 26px;
    font-family: inherit;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    }
    .zephyr:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    filter: brightness(1.08);
    }
    .zephyr:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(93, 63, 211, 0.3);
    }
    
    .px_rail {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .px_rail:hover {
    background: rgba(30, 26, 56, 0.06); color: #ffffff;}
    .ember {
    display: block;
    width: 22px;
    height: 2.5px;
    background: var(--text-color);
    border-radius: 2px;
    transition: var(--transition);
    }
    
    .waxShell {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(20, 18, 40, 0.45);
    opacity: 0;
    transition: opacity 0.3s ease; color: #ffffff;}
    .waxShell.is-visible {
    display: block;
    opacity: 1;
    }
    
    .moonArc {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1200;
    width: 300px;
    max-width: 85vw;
    background: var(--bg-color);
    box-shadow: var(--shadow-lg);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    flex-direction: column;
    }
    .moonArc.is-open {
    display: flex;
    transform: translateX(0);
    }
    .sv3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 12px;
    border-bottom: 1px solid var(--border-color);
    }
    .tq7b {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-color);
    letter-spacing: -0.01em;
    }
    .fizzle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 1.5rem;
    line-height: 1;
    color: var(--text-muted);
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .fizzle:hover {
    background: rgba(30, 26, 56, 0.06);
    color: #ffffff;
    }
    .husk_tone {
    list-style: none;
    padding: 12px 16px;
    flex: 1;
    }
    .crumble {
    border-radius: var(--radius-sm);
    }
    .vortex9 {
    display: block;
    padding: 13px 12px;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    }
    .vortex9:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.05);
    }
    .plume {
    padding: 16px 24px 28px;
    }
    .gnarly {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 14px 20px;
    font-family: inherit;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    }
    .gnarly:hover {
    filter: brightness(1.08);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    }
    
    @media (max-width: 960px) {.quilted {
    display: none;
    }
    .craggy {
    display: none;
    }
    .px_rail {
    display: flex;
    }}
    @media (min-width: 961px) {.waxShell,
    .moonArc {
    display: none !important;
    }}
    .blazeKit.active {color: #ffffff; background: rgba(30, 26, 56, 0.06);}
    .vortex9.active {color: #ffffff; background: rgba(30, 26, 56, 0.05);}
    @import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;700;800&family=Inter:wght@400;500;600;700&display=swap");
    main.features *{ margin: 0; padding: 0; box-sizing: border-box; }
    main.features{
    font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--feat-text);
    background: var(--feat-bg);
    overflow-x: hidden;
    line-height: 1.7;
    }
    main.features .feat-serif{
    font-family: "Playfair Display", Georgia, serif;
    }
    
    main.features .acorn{
    position: relative;
    padding: 100px 24px 80px;
    text-align: center;
    background: linear-gradient(170deg, hsl(244, 20%, 98%) 0%, hsl(244, 15%, 93%) 50%, hsl(333, 15%, 93%) 100%);
    overflow: hidden;
    }
    main.features .acorn::before{
    content: "";
    position: absolute;
    top: -200px;
    right: -200px;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    background: radial-gradient(circle, hsla(244, 78%, 57%, 0.08) 0%, transparent 70%);
    pointer-events: none; color: #ffffff;}
    main.features .acorn::after{
    content: "";
    position: absolute;
    bottom: -150px;
    left: -150px;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background: radial-gradient(circle, hsla(333, 62%, 57%, 0.06) 0%, transparent 70%);
    pointer-events: none;
    }
    main.features .prism{
    max-width: 820px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    }
    main.features .glacier{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 20px;
    background: var(--feat-bg-white);
    border-radius: 100px;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--feat-primary);
    box-shadow: var(--feat-shadow-sm);
    margin-bottom: 32px;
    }
    main.features .glacier svg{
    width: 16px;
    height: 16px;
    }
    main.features .acorn h1{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(2.2rem, 5vw, 3.6rem);
    font-weight: 800;
    line-height: 1.2;
    color: var(--feat-text);
    margin-bottom: 24px;
    letter-spacing: -0.02em;
    }
    main.features .acorn h1 .xylon{
    background: var(--feat-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    }
    main.features .lumen{
    font-size: 1.1rem;
    color: var(--feat-text-light);
    max-width: 640px;
    margin: 0 auto 40px;
    line-height: 1.8;
    }
    main.features .rover{
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
    }
    main.features .nexus{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 36px;
    background: var(--feat-gradient);
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    border: none;
    border-radius: 100px;
    text-decoration: none;
    box-shadow: 0 6px 24px hsla(244, 78%, 57%, 0.35);
    transition: transform 0.2s, box-shadow 0.2s;
    cursor: pointer;
    }
    main.features .nexus:hover{
    transform: translateY(-2px);
    box-shadow: 0 10px 32px hsla(244, 78%, 57%, 0.45);
    }
    main.features .flint{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 36px;
    background: var(--feat-bg-white);
    color: var(--feat-text);
    font-size: 1rem;
    font-weight: 600;
    border: 2px solid hsl(244, 15%, 85%);
    border-radius: 100px;
    text-decoration: none;
    transition: border-color 0.2s, background 0.2s;
    cursor: pointer;
    }
    main.features .flint:hover{
    border-color: var(--feat-primary);
    background: hsl(244, 30%, 97%);
    }
    
    main.features .lynx{
    padding: 90px 24px;
    }
    main.features .yield{
    background: var(--feat-bg-white);
    }
    main.features .orbit{
    max-width: 1140px;
    margin: 0 auto;
    }
    main.features .zenith{
    text-align: center;
    max-width: 680px;
    margin: 0 auto 56px;
    }
    main.features .zenith h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.7rem, 3.5vw, 2.4rem);
    font-weight: 700;
    margin-bottom: 16px;
    letter-spacing: -0.01em;
    }
    main.features .zenith p{
    font-size: 1.02rem;
    color: var(--feat-text-light);
    line-height: 1.8;
    }
    
    main.features .mirth{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    }
    main.features .relic{
    background: var(--feat-bg-white);
    border-radius: var(--feat-radius-lg);
    padding: 36px 30px;
    box-shadow: var(--feat-shadow-sm);
    border: 1px solid hsl(244, 10%, 91%);
    transition: transform 0.25s, box-shadow 0.25s;
    position: relative;
    overflow: hidden;
    }
    main.features .yield .relic{
    background: var(--feat-bg);
    }
    main.features .relic:hover{
    transform: translateY(-4px);
    box-shadow: var(--feat-shadow-md);
    }
    main.features .pulse{
    width: 56px;
    height: 56px;
    border-radius: var(--feat-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 22px;
    position: relative;
    }
    main.features .pulse svg{
    width: 28px;
    height: 28px;
    }
    main.features .phantom{ background: hsla(244, 78%, 57%, 0.1); color: #ffffff; }
    main.features .mosaic{ background: hsla(170, 60%, 45%, 0.1); color: hsl(170, 60%, 38%); }
    main.features .icicle{ background: hsla(333, 62%, 57%, 0.1); color: var(--feat-secondary); }
    main.features .haven{ background: hsla(40, 80%, 50%, 0.1); color: hsl(40, 80%, 42%); }
    main.features .nook3{ background: hsla(200, 70%, 50%, 0.1); color: hsl(200, 70%, 42%); }
    main.features .junco{ background: hsla(270, 60%, 55%, 0.1); color: hsl(270, 60%, 48%); }
    main.features .relic h3{
    font-size: 1.15rem;
    font-weight: 700;
    margin-bottom: 12px;
    }
    main.features .relic p{
    font-size: 0.93rem;
    color: var(--feat-text-light);
    line-height: 1.75;
    }
    main.features .oxide{
    display: inline-block;
    margin-top: 14px;
    padding: 4px 12px;
    font-size: 0.78rem;
    font-weight: 600;
    border-radius: 100px;
    background: hsla(244, 78%, 57%, 0.08);
    color: #ffffff;
    }
    
    main.features .grove{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: center;
    }
    main.features .shard{
    direction: rtl;
    }
    main.features .shard > *{
    direction: ltr;
    }
    main.features .beacon{
    border-radius: var(--feat-radius-xl);
    overflow: hidden;
    box-shadow: var(--feat-shadow-lg);
    aspect-ratio: 4 / 3;
    position: relative;
    }
    main.features .beacon img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    }
    main.features .cobalt h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    margin-bottom: 18px;
    }
    main.features .cobalt p{
    font-size: 1rem;
    color: var(--feat-text-light);
    line-height: 1.8;
    margin-bottom: 14px;
    }
    main.features .quest{
    list-style: none;
    margin: 20px 0 28px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    }
    main.features .quest li{
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 0.95rem;
    color: var(--feat-text);
    line-height: 1.6;
    }
    main.features .quest li svg{
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    margin-top: 2px;
    color: var(--feat-primary);
    }
    main.features .forge{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--feat-primary);
    text-decoration: none;
    transition: gap 0.2s;
    }
    main.features .forge:hover{
    gap: 10px;
    }
    main.features .forge svg{
    width: 18px;
    height: 18px;
    }
    
    main.features .slate{
    padding: 60px 24px;
    background: var(--feat-gradient);
    }
    main.features .quartz{
    max-width: 1000px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    text-align: center;
    }
    main.features .whirl h3{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(2rem, 4vw, 2.8rem);
    font-weight: 800;
    color: #fff;
    margin-bottom: 6px;
    }
    main.features .whirl p{
    font-size: 0.9rem;
    color: hsla(0, 0%, 100%, 0.82);
    font-weight: 500;
    }
    
    main.features .feat-devtools-img{
    border-radius: var(--feat-radius-xl);
    overflow: hidden;
    box-shadow: var(--feat-shadow-lg);
    margin-top: 48px;
    aspect-ratio: 16 / 9;
    }
    main.features .feat-devtools-img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    }
    
    main.features .feat-cta{
    padding: 90px 24px;
    text-align: center;
    background: linear-gradient(170deg, hsl(244, 15%, 93%) 0%, hsl(333, 12%, 94%) 100%);
    }
    main.features .feat-cta-inner{
    max-width: 640px;
    margin: 0 auto;
    }
    main.features .feat-cta h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.8rem, 3.5vw, 2.5rem);
    font-weight: 700;
    margin-bottom: 18px;
    }
    main.features .feat-cta p{
    font-size: 1.05rem;
    color: var(--feat-text-light);
    margin-bottom: 36px;
    line-height: 1.8;
    }
    main.features .feat-cta-buttons{
    display: flex;
    gap: 14px;
    justify-content: center;
    flex-wrap: wrap;
    }
    
    main.features .feat-footer{
    background: var(--feat-text);
    color: hsl(244, 8%, 70%);
    padding: 48px 24px;
    }
    main.features .feat-footer-inner{
    max-width: 1140px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 24px;
    }
    main.features .feat-footer-brand{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.2rem;
    font-weight: 700;
    color: #fff;
    }
    main.features .feat-footer-links{
    display: flex;
    gap: 28px;
    flex-wrap: wrap;
    }
    main.features .feat-footer-links a{
    color: hsl(244, 8%, 65%);
    text-decoration: none;
    font-size: 0.88rem;
    transition: color 0.2s;
    }
    main.features .feat-footer-links a:hover{
    color: #fff;
    }
    main.features .feat-footer-copy{
    width: 100%;
    text-align: center;
    padding-top: 28px;
    margin-top: 28px;
    border-top: 1px solid hsl(244, 8%, 22%);
    font-size: 0.84rem;
    }
    
    @media (max-width: 900px) {main.features .mirth{
    grid-template-columns: repeat(2, 1fr);
    }
    main.features .grove{
    grid-template-columns: 1fr;
    gap: 32px;
    }
    main.features .shard{
    direction: ltr;
    }
    main.features .quartz{
    grid-template-columns: repeat(2, 1fr);
    }}
    @media (max-width: 600px) {main.features .mirth{
    grid-template-columns: 1fr;
    }
    main.features .acorn{
    padding: 72px 20px 56px;
    }
    main.features .lynx{
    padding: 60px 20px;
    }
    main.features .quartz{
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    }
    main.features .relic{
    padding: 28px 22px;
    }
    main.features .feat-footer-inner{
    flex-direction: column;
    text-align: center;
    }
    main.features .feat-footer-links{
    justify-content: center;
    }}
    main.features .knoll{
    background: hsl(244, 12%, 13%);
    padding: 0;
    margin-top: 0;
    font-family: "Georgia", "Noto Serif SC", serif; color: #ffffff;}
    main.features .trove{
    max-width: var(--max-width, 1200px);
    margin: 0 auto;
    padding: 56px 32px 36px;
    }
    main.features .vortex{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 24px;
    padding-bottom: 40px;
    }
    main.features .delta{
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 0 0 auto;
    }
    main.features .jewel{
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    }
    main.features .grain{
    font-size: 1.2rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.01em;
    font-family: "Georgia", "Noto Serif SC", serif;
    }
    main.features .cipher{
    display: flex;
    align-items: center;
    gap: 20px;
    flex: 0 1 auto;
    }
    main.features .drift{
    font-size: 0.92rem;
    color: hsl(244, 10%, 68%);
    white-space: nowrap;
    }
    main.features .vapor{
    display: inline-block;
    padding: 11px 28px;
    background: linear-gradient(135deg, var(--primary-color, hsl(244, 78%, 57%)), var(--secondary-color, hsl(333, 62%, 57%)));
    color: #fff;
    font-size: 0.9rem;
    font-weight: 600;
    border-radius: var(--radius-lg, 20px);
    text-decoration: none;
    transition: var(--transition, all 0.25s ease);
    box-shadow: 0 4px 18px rgba(99, 66, 232, 0.35);
    white-space: nowrap;
    flex: 0 0 auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }
    main.features .vapor:hover{
    box-shadow: 0 6px 24px rgba(99, 66, 232, 0.5);
    transform: translateY(-1px);
    }
    main.features .osprey{
    height: 1px;
    background: rgba(255, 255, 255, 0.08);
    width: 100%;
    }
    main.features .husk{
    display: flex;
    justify-content: space-between;
    gap: 32px;
    padding: 40px 0;
    }
    main.features .cloak{
    flex: 1 1 0;
    min-width: 140px;
    }
    main.features .inlet{
    font-size: 0.82rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.5);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin: 0 0 18px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }
    main.features .unity{
    list-style: none;
    margin: 0;
    padding: 0;
    }
    main.features .marsh{
    margin-bottom: 12px;
    }
    main.features .noble{
    font-size: 0.9rem;
    color: hsl(244, 10%, 72%);
    text-decoration: none;
    transition: var(--transition, all 0.25s ease);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }
    main.features .noble:hover{
    color: #fff;
    }
    main.features .epoch{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    padding-top: 28px;
    }
    main.features .flux{
    font-size: 0.82rem;
    color: hsl(244, 8%, 48%);
    margin: 0;
    flex: 1 1 auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }
    main.features .birch{
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 1 auto;
    }
    main.features .velvet{
    font-size: 0.8rem;
    color: hsl(244, 8%, 52%);
    text-decoration: none;
    transition: var(--transition, all 0.25s ease);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }
    main.features .velvet:hover{
    color: #fff;
    }
    main.features .aurora{
    color: hsl(244, 8%, 36%);
    font-size: 0.8rem;
    user-select: none;
    }
    main.features .kelp7{
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    }
    main.features .elm93{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.06);
    color: hsl(244, 8%, 56%);
    text-decoration: none;
    transition: var(--transition, all 0.25s ease);
    flex: 0 0 36px;
    }
    main.features .elm93:hover{
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    }
    @media (max-width: 768px) {main.features .trove{
    padding: 40px 20px 28px;
    }
    main.features .vortex{
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding-bottom: 32px;
    }
    main.features .cipher{
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
    flex: 1 1 100%;
    }
    main.features .drift{
    white-space: normal;
    }
    main.features .vapor{
    width: 100%;
    text-align: center;
    }
    main.features .husk{
    flex-wrap: wrap;
    gap: 28px 24px;
    padding: 32px 0;
    }
    main.features .cloak{
    flex: 1 1 calc(50% - 12px);
    min-width: 130px;
    }
    main.features .epoch{
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    padding-top: 24px;
    }
    main.features .flux{
    flex: 1 1 100%;
    }
    main.features .birch{
    flex: 1 1 100%;
    }
    main.features .kelp7{
    flex: 1 1 100%;
    }}
    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;
    }

    *,
    *::before,
    *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height);
    font-family: "Playfair Display", "Noto Serif SC", "Source Han Serif SC", Georgia, "Times New Roman", serif;
    color: var(--text-color);
    background: var(--bg-color);
    }
    
    .nimbus {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    height: var(--nav-height);
    background: rgba(240, 239, 243, 0.82);
    backdrop-filter: blur(18px) saturate(1.6);
    -webkit-backdrop-filter: blur(18px) saturate(1.6);
    border-bottom: 1px solid var(--border-color);
    }
    .jade_pip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: var(--max-width);
    height: 100%;
    margin: 0 auto;
    padding: 0 28px;
    }
    
    .rumble {
    flex-shrink: 0;
    }
    .obsidian {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--text-color);
    }
    .frozenOrb {
    display: block;
    flex-shrink: 0;
    }
    .driftKnob {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    }
    
    .quilted {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    }
    .pale_dust {
    position: relative;
    }
    .blazeKit {
    display: block;
    padding: 8px 14px;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    white-space: nowrap;
    letter-spacing: 0.01em;
    }
    .blazeKit:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.06);
    }
    
    .craggy {
    flex-shrink: 0;
    }
    .zephyr {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 26px;
    font-family: inherit;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    }
    .zephyr:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    filter: brightness(1.08);
    }
    .zephyr:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(93, 63, 211, 0.3);
    }
    
    .px_rail {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .px_rail:hover {
    background: rgba(30, 26, 56, 0.06); color: #ffffff;}
    .ember {
    display: block;
    width: 22px;
    height: 2.5px;
    background: var(--text-color);
    border-radius: 2px;
    transition: var(--transition);
    }
    
    .waxShell {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(20, 18, 40, 0.45);
    opacity: 0;
    transition: opacity 0.3s ease; color: #ffffff;}
    .waxShell.is-visible {
    display: block;
    opacity: 1;
    }
    
    .moonArc {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1200;
    width: 300px;
    max-width: 85vw;
    background: var(--bg-color);
    box-shadow: var(--shadow-lg);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    flex-direction: column;
    }
    .moonArc.is-open {
    display: flex;
    transform: translateX(0);
    }
    .sv3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 12px;
    border-bottom: 1px solid var(--border-color);
    }
    .tq7b {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-color);
    letter-spacing: -0.01em;
    }
    .fizzle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 1.5rem;
    line-height: 1;
    color: var(--text-muted);
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .fizzle:hover {
    background: rgba(30, 26, 56, 0.06);
    color: #ffffff;
    }
    .husk_tone {
    list-style: none;
    padding: 12px 16px;
    flex: 1;
    }
    .crumble {
    border-radius: var(--radius-sm);
    }
    .vortex9 {
    display: block;
    padding: 13px 12px;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    }
    .vortex9:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.05);
    }
    .plume {
    padding: 16px 24px 28px;
    }
    .gnarly {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 14px 20px;
    font-family: inherit;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    }
    .gnarly:hover {
    filter: brightness(1.08);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    }
    
    @media (max-width: 960px) {.quilted {
    display: none;
    }
    .craggy {
    display: none;
    }
    .px_rail {
    display: flex;
    }}
    @media (min-width: 961px) {.waxShell,
    .moonArc {
    display: none !important;
    }}
    .blazeKit.active {color: #ffffff; background: rgba(30, 26, 56, 0.06);}
    .vortex9.active {color: #ffffff; background: rgba(30, 26, 56, 0.05);}
    @import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;700;800&family=Inter:wght@400;500;600;700&display=swap");
    main.guide *{ margin: 0; padding: 0; box-sizing: border-box; }
    main.guide{
    font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--guide-text);
    background: var(--guide-bg);
    line-height: 1.7;
    overflow-x: hidden;
    }
    main.guide .echo9{
    position: relative;
    padding: 80px 24px 72px;
    background: var(--guide-white);
    text-align: center;
    overflow: hidden;
    }
    main.guide .echo9::before{
    content: "";
    position: absolute;
    top: -120px;
    right: -80px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, hsla(244, 78%, 57%, 0.08) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none; color: #ffffff;}
    main.guide .echo9::after{
    content: "";
    position: absolute;
    bottom: -60px;
    left: -40px;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, hsla(333, 62%, 57%, 0.06) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
    }
    main.guide .quarry{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 20px;
    background: hsla(244, 78%, 57%, 0.08);
    border-radius: 100px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #ffffff;
    margin-bottom: 28px;
    letter-spacing: 0.02em;
    }
    main.guide .quarry svg{
    width: 16px;
    height: 16px;
    }
    main.guide .echo9 h1{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(2.2rem, 5vw, 3.4rem);
    font-weight: 800;
    line-height: 1.2;
    color: var(--guide-text);
    max-width: 720px;
    margin: 0 auto 20px;
    letter-spacing: -0.01em;
    }
    main.guide .bloom{
    font-size: 1.08rem;
    color: var(--guide-text-light);
    max-width: 580px;
    margin: 0 auto 36px;
    line-height: 1.75;
    }
    main.guide .fjord{
    display: flex;
    gap: 14px;
    justify-content: center;
    flex-wrap: wrap;
    }
    main.guide .loom{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 32px;
    background: var(--guide-gradient);
    color: #fff;
    font-size: 0.95rem;
    font-weight: 600;
    border: none;
    border-radius: 100px;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 4px 20px hsla(244, 78%, 57%, 0.3);
    transition: transform 0.2s, box-shadow 0.2s;
    }
    main.guide .loom:hover{
    transform: translateY(-2px);
    box-shadow: 0 6px 28px hsla(244, 78%, 57%, 0.4);
    }
    main.guide .spire{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    background: var(--guide-white);
    color: var(--guide-text);
    font-size: 0.95rem;
    font-weight: 600;
    border: 2px solid var(--guide-border);
    border-radius: 100px;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s;
    }
    main.guide .spire:hover{
    border-color: var(--guide-primary);
    background: hsla(244, 78%, 57%, 0.04); color: #ffffff;}
    main.guide .guide-container{
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 24px;
    }
    main.guide .helix{
    padding: 56px 24px;
    }
    main.guide .strata{
    max-width: 1080px;
    margin: 0 auto;
    background: var(--guide-white);
    border-radius: var(--guide-radius);
    padding: 40px 44px;
    box-shadow: var(--guide-card-shadow);
    border: 1px solid var(--guide-border);
    }
    main.guide .talon{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 24px;
    color: var(--guide-text);
    }
    main.guide .rift{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
    }
    main.guide .wisp{
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    border-radius: var(--guide-radius-sm);
    text-decoration: none;
    color: var(--guide-text);
    font-weight: 500;
    font-size: 0.93rem;
    transition: background 0.2s;
    background: hsla(244, 10%, 50%, 0.04);
    }
    main.guide .wisp:hover{
    background: hsla(244, 78%, 57%, 0.08); color: #ffffff;}
    main.guide .vertex{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: var(--guide-gradient);
    color: #fff;
    font-size: 0.82rem;
    font-weight: 700;
    flex-shrink: 0;
    }
    main.guide .basalt{
    padding: 64px 24px;
    }
    main.guide .basalt:nth-child(even){
    background: var(--guide-white);
    }
    main.guide .alloy{
    max-width: 1080px;
    margin: 0 auto;
    }
    main.guide .cairn{
    margin-bottom: 40px;
    }
    main.guide .cairn h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.6rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--guide-text);
    margin-bottom: 10px;
    line-height: 1.3;
    }
    main.guide .cairn p{
    font-size: 1rem;
    color: var(--guide-text-light);
    max-width: 640px;
    }
    main.guide .apex{
    display: flex;
    flex-direction: column;
    gap: 20px;
    }
    main.guide .thorn{
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 20px;
    align-items: start;
    padding: 28px 32px;
    background: var(--guide-bg);
    border-radius: var(--guide-radius);
    border: 1px solid var(--guide-border);
    transition: box-shadow 0.25s;
    }
    main.guide .basalt:nth-child(even) .thorn{
    background: var(--guide-bg);
    }
    main.guide .thorn:hover{
    box-shadow: var(--guide-card-shadow-hover);
    }
    main.guide .delta7{
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: var(--guide-gradient);
    color: #fff;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.2rem;
    font-weight: 700;
    flex-shrink: 0;
    }
    main.guide .thorn h3{
    font-size: 1.05rem;
    font-weight: 700;
    margin-bottom: 6px;
    color: var(--guide-text);
    }
    main.guide .thorn p{
    font-size: 0.93rem;
    color: var(--guide-text-light);
    line-height: 1.7;
    }
    main.guide .thorn code{
    display: inline-block;
    padding: 2px 8px;
    background: hsla(244, 20%, 50%, 0.1);
    border-radius: 6px;
    font-size: 0.85rem;
    font-family: "SF Mono", "Fira Code", monospace;
    color: var(--guide-primary-dark);
    }
    main.guide .guide-img-card{
    margin-top: 40px;
    border-radius: var(--guide-radius);
    overflow: hidden;
    box-shadow: var(--guide-card-shadow);
    border: 1px solid var(--guide-border);
    }
    main.guide .guide-img-card img{
    width: 100%;
    display: block;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    }
    main.guide .guide-import-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    }
    main.guide .guide-import-card{
    padding: 32px 28px;
    background: var(--guide-bg);
    border-radius: var(--guide-radius);
    border: 1px solid var(--guide-border);
    transition: box-shadow 0.25s, transform 0.25s;
    }
    main.guide .basalt:nth-child(even) .guide-import-card{
    background: var(--guide-bg);
    }
    main.guide .guide-import-card:hover{
    box-shadow: var(--guide-card-shadow-hover);
    transform: translateY(-3px);
    }
    main.guide .guide-import-icon{
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    margin-bottom: 16px;
    font-size: 1.3rem;
    }
    main.guide .guide-import-icon.safari{ background: hsla(210, 80%, 55%, 0.12); color: hsl(210, 80%, 50%); }
    main.guide .guide-import-icon.firefox{ background: hsla(25, 90%, 55%, 0.12); color: hsl(25, 90%, 45%); }
    main.guide .guide-import-icon.edge{ background: hsla(200, 80%, 45%, 0.12); color: hsl(200, 80%, 40%); }
    main.guide .guide-import-card h3{
    font-size: 1.02rem;
    font-weight: 700;
    margin-bottom: 8px;
    }
    main.guide .guide-import-card ol{
    padding-left: 18px;
    font-size: 0.9rem;
    color: var(--guide-text-light);
    }
    main.guide .guide-import-card ol li{
    margin-bottom: 4px;
    }
    main.guide .guide-sync-layout{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: center;
    }
    main.guide .guide-sync-content h3{
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 10px;
    }
    main.guide .guide-sync-content p{
    font-size: 0.95rem;
    color: var(--guide-text-light);
    margin-bottom: 14px;
    }
    main.guide .guide-sync-list{
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
    }
    main.guide .guide-sync-list li{
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.92rem;
    color: var(--guide-text);
    }
    main.guide .guide-sync-check{
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    background: hsla(150, 60%, 45%, 0.12);
    color: hsl(150, 60%, 38%);
    flex-shrink: 0;
    }
    main.guide .guide-sync-check svg{
    width: 13px;
    height: 13px;
    }
    main.guide .guide-sync-img{
    border-radius: var(--guide-radius);
    overflow: hidden;
    box-shadow: var(--guide-card-shadow);
    border: 1px solid var(--guide-border);
    }
    main.guide .guide-sync-img img{
    width: 100%;
    display: block;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    }
    main.guide .guide-shortcuts-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
    }
    main.guide .guide-shortcut-card{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 22px;
    background: var(--guide-bg);
    border-radius: var(--guide-radius-sm);
    border: 1px solid var(--guide-border);
    transition: box-shadow 0.2s;
    }
    main.guide .basalt:nth-child(even) .guide-shortcut-card{
    background: var(--guide-bg);
    }
    main.guide .guide-shortcut-card:hover{
    box-shadow: var(--guide-card-shadow);
    }
    main.guide .guide-shortcut-label{
    font-size: 0.92rem;
    font-weight: 500;
    color: var(--guide-text);
    }
    main.guide .guide-shortcut-keys{
    display: flex;
    gap: 4px;
    }
    main.guide .guide-key{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    background: var(--guide-white);
    border: 1.5px solid var(--guide-border);
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 600;
    font-family: "SF Mono", "Fira Code", monospace;
    color: var(--guide-text);
    box-shadow: 0 2px 0 hsla(244, 10%, 50%, 0.1);
    min-width: 28px;
    }
    main.guide .opal{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    }
    main.guide .crux{
    padding: 28px 24px;
    background: var(--guide-bg);
    border-radius: var(--guide-radius);
    border: 1px solid var(--guide-border);
    }
    main.guide .crux h3{
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    }
    main.guide .crux h3 svg{
    width: 20px;
    height: 20px;
    color: var(--guide-primary);
    }
    main.guide .crux ol{
    padding-left: 18px;
    font-size: 0.9rem;
    color: var(--guide-text-light);
    line-height: 1.8;
    }
    main.guide .guide-ext-layout{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: center;
    }
    main.guide .guide-ext-img{
    border-radius: var(--guide-radius);
    overflow: hidden;
    box-shadow: var(--guide-card-shadow);
    border: 1px solid var(--guide-border);
    }
    main.guide .guide-ext-img img{
    width: 100%;
    display: block;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    }
    main.guide .guide-ext-content h3{
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 10px;
    }
    main.guide .guide-ext-content p{
    font-size: 0.95rem;
    color: var(--guide-text-light);
    margin-bottom: 16px;
    line-height: 1.7;
    }
    main.guide .guide-cta-section{
    padding: 72px 24px;
    text-align: center;
    }
    main.guide .guide-cta-box{
    max-width: 680px;
    margin: 0 auto;
    padding: 56px 48px;
    background: var(--guide-white);
    border-radius: var(--guide-radius);
    box-shadow: var(--guide-card-shadow);
    border: 1px solid var(--guide-border);
    position: relative;
    overflow: hidden;
    }
    main.guide .guide-cta-box::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--guide-gradient);
    }
    main.guide .guide-cta-box h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.6rem;
    font-weight: 700;
    margin-bottom: 12px;
    }
    main.guide .guide-cta-box p{
    font-size: 0.95rem;
    color: var(--guide-text-light);
    margin-bottom: 28px;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
    }
    main.guide .guide-cta-actions{
    display: flex;
    gap: 14px;
    justify-content: center;
    flex-wrap: wrap;
    }
    main.guide .guide-security-img{
    margin-top: 32px;
    border-radius: var(--guide-radius);
    overflow: hidden;
    box-shadow: var(--guide-card-shadow);
    border: 1px solid var(--guide-border);
    }
    main.guide .guide-security-img img{
    width: 100%;
    display: block;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    }
    main.guide .glyph{
    color: var(--guide-primary);
    text-decoration: none;
    font-weight: 500;
    border-bottom: 1.5px solid hsla(244, 78%, 57%, 0.3);
    transition: border-color 0.2s;
    }
    main.guide .glyph:hover{
    border-color: var(--guide-primary);
    }
    main.guide .guide-footer{
    background: var(--guide-text);
    color: hsla(0, 0%, 100%, 0.7);
    padding: 48px 24px;
    }
    main.guide .guide-footer-inner{
    max-width: 1080px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    }
    main.guide .guide-footer-brand{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.15rem;
    font-weight: 700;
    color: #fff;
    }
    main.guide .guide-footer-brand span{
    display: block;
    font-family: "Inter", sans-serif;
    font-size: 0.82rem;
    font-weight: 400;
    color: hsla(0, 0%, 100%, 0.5);
    margin-top: 4px;
    }
    main.guide .guide-footer-links{
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
    }
    main.guide .guide-footer-links a{
    color: hsla(0, 0%, 100%, 0.6);
    text-decoration: none;
    font-size: 0.85rem;
    transition: color 0.2s;
    }
    main.guide .guide-footer-links a:hover{
    color: #fff;
    }
    main.guide .guide-footer-copy{
    width: 100%;
    text-align: center;
    padding-top: 28px;
    margin-top: 28px;
    border-top: 1px solid hsla(0, 0%, 100%, 0.1);
    font-size: 0.82rem;
    color: hsla(0, 0%, 100%, 0.4);
    }
    @media (max-width: 768px) {main.guide .echo9{ padding: 56px 20px 48px; }
    main.guide .strata{ padding: 28px 24px; }
    main.guide .guide-sync-layout, main.guide .guide-ext-layout{ grid-template-columns: 1fr; }
    main.guide .thorn{ grid-template-columns: 44px 1fr; gap: 14px; padding: 20px 20px; }
    main.guide .guide-cta-box{ padding: 40px 28px; }
    main.guide .guide-footer-inner{ flex-direction: column; text-align: center; }
    main.guide .guide-footer-links{ justify-content: center; }}
    main.guide .mantle{
    background: var(--text-color, hsl(244, 10%, 11%));
    padding: 48px 24px 36px;
    margin-top: 80px;
    border-top: 3px solid var(--primary-color, hsl(244, 78%, 57%));
    }
    main.guide .onyx{
    max-width: var(--max-width, 1200px);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    }
    main.guide .haze{
    display: flex;
    align-items: center;
    gap: 10px;
    }
    main.guide .crest{
    flex: 0 0 20px;
    }
    main.guide .fable{
    font-family: "Georgia", "Times New Roman", serif;
    font-size: 1.1rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.02em;
    }
    main.guide .vale{
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
    }
    main.guide .sigil{
    color: hsl(244, 20%, 72%);
    text-decoration: none;
    font-size: 0.9rem;
    padding: 4px 6px;
    border-radius: var(--radius-sm, 6px);
    transition: var(--transition, all 0.25s ease);
    }
    main.guide .sigil:hover{
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    }
    main.guide .briar{
    color: hsl(244, 10%, 36%);
    font-size: 0.85rem;
    user-select: none;
    flex: 0 0 auto;
    }
    main.guide .dusk{
    color: hsl(244, 8%, 48%);
    font-size: 0.8rem;
    margin: 0;
    text-align: center;
    letter-spacing: 0.01em;
    }
    @media (max-width: 600px) {main.guide .mantle{
    padding: 36px 16px 28px;
    margin-top: 56px;
    }
    main.guide .vale{
    gap: 8px;
    }
    main.guide .sigil{
    font-size: 0.82rem;
    }
    main.guide .fable{
    font-size: 1rem;
    }}
    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;
    }

    *,
    *::before,
    *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height);
    font-family: "Playfair Display", "Noto Serif SC", "Source Han Serif SC", Georgia, "Times New Roman", serif;
    color: var(--text-color);
    background: var(--bg-color);
    }
    
    .nimbus {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    height: var(--nav-height);
    background: rgba(240, 239, 243, 0.82);
    backdrop-filter: blur(18px) saturate(1.6);
    -webkit-backdrop-filter: blur(18px) saturate(1.6);
    border-bottom: 1px solid var(--border-color);
    }
    .jade_pip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: var(--max-width);
    height: 100%;
    margin: 0 auto;
    padding: 0 28px;
    }
    
    .rumble {
    flex-shrink: 0;
    }
    .obsidian {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--text-color);
    }
    .frozenOrb {
    display: block;
    flex-shrink: 0;
    }
    .driftKnob {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    }
    
    .quilted {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    }
    .pale_dust {
    position: relative;
    }
    .blazeKit {
    display: block;
    padding: 8px 14px;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    white-space: nowrap;
    letter-spacing: 0.01em;
    }
    .blazeKit:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.06);
    }
    
    .craggy {
    flex-shrink: 0;
    }
    .zephyr {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 26px;
    font-family: inherit;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    }
    .zephyr:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    filter: brightness(1.08);
    }
    .zephyr:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(93, 63, 211, 0.3);
    }
    
    .px_rail {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .px_rail:hover {
    background: rgba(30, 26, 56, 0.06); color: #ffffff;}
    .ember {
    display: block;
    width: 22px;
    height: 2.5px;
    background: var(--text-color);
    border-radius: 2px;
    transition: var(--transition);
    }
    
    .waxShell {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(20, 18, 40, 0.45);
    opacity: 0;
    transition: opacity 0.3s ease; color: #ffffff;}
    .waxShell.is-visible {
    display: block;
    opacity: 1;
    }
    
    .moonArc {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1200;
    width: 300px;
    max-width: 85vw;
    background: var(--bg-color);
    box-shadow: var(--shadow-lg);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    flex-direction: column;
    }
    .moonArc.is-open {
    display: flex;
    transform: translateX(0);
    }
    .sv3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 12px;
    border-bottom: 1px solid var(--border-color);
    }
    .tq7b {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-color);
    letter-spacing: -0.01em;
    }
    .fizzle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 1.5rem;
    line-height: 1;
    color: var(--text-muted);
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .fizzle:hover {
    background: rgba(30, 26, 56, 0.06);
    color: #ffffff;
    }
    .husk_tone {
    list-style: none;
    padding: 12px 16px;
    flex: 1;
    }
    .crumble {
    border-radius: var(--radius-sm);
    }
    .vortex9 {
    display: block;
    padding: 13px 12px;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    }
    .vortex9:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.05);
    }
    .plume {
    padding: 16px 24px 28px;
    }
    .gnarly {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 14px 20px;
    font-family: inherit;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    }
    .gnarly:hover {
    filter: brightness(1.08);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    }
    
    @media (max-width: 960px) {.quilted {
    display: none;
    }
    .craggy {
    display: none;
    }
    .px_rail {
    display: flex;
    }}
    @media (min-width: 961px) {.waxShell,
    .moonArc {
    display: none !important;
    }}
    .blazeKit.active {color: #ffffff; background: rgba(30, 26, 56, 0.06);}
    .vortex9.active {color: #ffffff; background: rgba(30, 26, 56, 0.05);}
    @import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700;800&family=Inter:wght@400;500;600;700&display=swap");
    main.shortcuts *{ box-sizing: border-box; }
    main.shortcuts{
    font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--sc-text);
    background: var(--sc-bg);
    line-height: 1.7;
    overflow-x: hidden;
    }
    main.shortcuts .ridge{
    position: relative;
    padding: 80px 24px 60px;
    background: linear-gradient(160deg, hsl(244, 78%, 57%) 0%, hsl(280, 60%, 50%) 50%, hsl(333, 62%, 57%) 100%);
    color: #fff;
    text-align: center;
    overflow: hidden;
    }
    main.shortcuts .ridge::before{
    content: "";
    position: absolute;
    inset: 0;
    background: url("media/shortcuts-browser-tab-navigation-1.jpg") center/cover no-repeat;
    opacity: 0.1;
    mix-blend-mode: overlay;
    }
    main.shortcuts .velvet{
    position: relative;
    max-width: 800px;
    margin: 0 auto;
    }
    main.shortcuts .ridge h1{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(2rem, 5vw, 3rem);
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 20px;
    letter-spacing: -0.02em;
    }
    main.shortcuts .cipher{
    font-size: 1.05rem;
    opacity: 0.92;
    max-width: 620px;
    margin: 0 auto 28px;
    line-height: 1.75;
    }
    main.shortcuts .pylon{
    display: flex;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
    font-size: 0.88rem;
    opacity: 0.85;
    }
    main.shortcuts .pylon span{
    display: flex;
    align-items: center;
    gap: 6px;
    }
    main.shortcuts .pylon svg{
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    }
    main.shortcuts .sc-container{
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 24px;
    }
    main.shortcuts .sc-toc{
    padding: 48px 24px 0;
    }
    main.shortcuts .sc-toc-inner{
    max-width: 1120px;
    margin: 0 auto;
    background: var(--sc-bg-white);
    border-radius: var(--sc-radius);
    padding: 28px 32px;
    box-shadow: var(--sc-card-shadow);
    border: 1px solid var(--sc-border-light);
    }
    main.shortcuts .sc-toc h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.3rem;
    margin: 0 0 16px;
    color: var(--sc-text);
    }
    main.shortcuts .sc-toc-grid{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 8px 16px;
    }
    main.shortcuts .sc-toc-link{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: var(--sc-radius-xs);
    text-decoration: none;
    color: var(--sc-text);
    font-size: 0.92rem;
    font-weight: 500;
    transition: background 0.2s, color 0.2s;
    }
    main.shortcuts .sc-toc-link:hover{
    background: hsl(244, 78%, 57%, 0.08);
    color: #ffffff;
    }
    main.shortcuts .sc-toc-link .toc-icon{
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
    flex-shrink: 0;
    }
    main.shortcuts .raven{
    padding: 40px 24px 0;
    }
    main.shortcuts .xeric{
    max-width: 1120px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    }
    main.shortcuts .drape{
    font-size: 0.9rem;
    color: var(--sc-text-light);
    font-weight: 500;
    }
    main.shortcuts .notch{
    display: flex;
    background: var(--sc-bg-white);
    border-radius: var(--sc-radius-sm);
    border: 1px solid var(--sc-border);
    overflow: hidden;
    }
    main.shortcuts .whelk{
    padding: 10px 24px;
    font-size: 0.9rem;
    font-weight: 600;
    border: none;
    background: transparent;
    color: var(--sc-text-light);
    cursor: pointer;
    transition: all 0.25s;
    font-family: inherit;
    }
    main.shortcuts .whelk.quartz{
    background: var(--sc-primary);
    color: #fff;
    }
    main.shortcuts .whelk:not(.active):hover{
    background: hsl(244, 78%, 57%, 0.06);
    color: #ffffff;
    }
    main.shortcuts .latch{
    padding: 40px 24px 60px;
    }
    main.shortcuts .aurora{
    max-width: 1120px;
    margin: 0 auto 40px;
    }
    main.shortcuts .aurora:last-child{
    margin-bottom: 0;
    }
    main.shortcuts .drift{
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--sc-border-light);
    }
    main.shortcuts .vortex{
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    }
    main.shortcuts .vortex svg{
    width: 20px;
    height: 20px;
    }
    main.shortcuts .drift h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.35rem;
    margin: 0;
    color: var(--sc-text);
    }
    main.shortcuts .drift .quill{
    font-size: 0.78rem;
    font-weight: 600;
    background: hsl(244, 78%, 57%, 0.1);
    color: #ffffff;
    padding: 3px 10px;
    border-radius: 20px;
    margin-left: auto;
    white-space: nowrap;
    }
    main.shortcuts .onyx{
    background: var(--sc-bg-white);
    border-radius: var(--sc-radius);
    box-shadow: var(--sc-card-shadow);
    border: 1px solid var(--sc-border-light);
    overflow: hidden;
    }
    main.shortcuts .zenith{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0;
    border-bottom: 1px solid var(--sc-border-light);
    transition: background 0.15s;
    }
    main.shortcuts .zenith:last-child{
    border-bottom: none;
    }
    main.shortcuts .zenith:hover{
    background: hsl(244, 78%, 57%, 0.025); color: #ffffff;}
    main.shortcuts .prism{
    background: hsl(244, 10%, 97%);
    font-weight: 600;
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--sc-text-light);
    }
    main.shortcuts .prism:hover{
    background: hsl(244, 10%, 97%);
    }
    main.shortcuts .facet{
    padding: 14px 20px;
    font-size: 0.92rem;
    display: flex;
    align-items: center;
    }
    main.shortcuts .facet:not(:last-child){
    border-right: 1px solid var(--sc-border-light);
    }
    main.shortcuts .glacier{
    font-weight: 500;
    color: var(--sc-text);
    }
    main.shortcuts kbd{
    display: inline-block;
    background: var(--sc-kbd-bg);
    border: 1px solid var(--sc-kbd-border);
    border-bottom-width: 2px;
    border-radius: 5px;
    padding: 2px 8px;
    font-family: "SF Mono", "Fira Code", "Consolas", monospace;
    font-size: 0.82rem;
    color: var(--sc-text);
    white-space: nowrap;
    line-height: 1.6;
    }
    main.shortcuts .facet kbd + span, main.shortcuts .facet span + kbd{
    margin-left: 3px;
    }
    main.shortcuts .facet .grit{
    margin: 0 2px;
    color: var(--sc-text-light);
    font-size: 0.8rem;
    }
    main.shortcuts .sc-banner{
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 24px 60px;
    }
    main.shortcuts .sc-banner-inner{
    background: linear-gradient(135deg, hsl(244, 78%, 57%) 0%, hsl(280, 55%, 50%) 100%);
    border-radius: var(--sc-radius);
    padding: 48px 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    flex-wrap: wrap;
    color: #fff;
    }
    main.shortcuts .sc-banner-text h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.6rem;
    margin: 0 0 10px;
    color: #fff;
    }
    main.shortcuts .sc-banner-text p{
    margin: 0;
    opacity: 0.9;
    font-size: 0.95rem;
    max-width: 480px;
    line-height: 1.7;
    }
    main.shortcuts .sc-banner-actions{
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    }
    main.shortcuts .sc-btn{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    border-radius: var(--sc-radius-sm);
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
    font-family: inherit;
    border: none;
    cursor: pointer;
    }
    main.shortcuts .sc-btn-white{
    background: #fff;
    color: var(--sc-primary);
    box-shadow: 0 2px 8px hsla(244, 30%, 20%, 0.15);
    }
    main.shortcuts .sc-btn-white:hover{
    transform: translateY(-2px);
    box-shadow: 0 6px 20px hsla(244, 30%, 20%, 0.2);
    }
    main.shortcuts .sc-btn-outline-white{
    background: hsla(0, 0%, 100%, 0.15);
    color: #fff;
    border: 1.5px solid hsla(0, 0%, 100%, 0.4);
    }
    main.shortcuts .sc-btn-outline-white:hover{
    background: hsla(0, 0%, 100%, 0.25);
    }
    main.shortcuts .sc-links-section{
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 24px 60px;
    }
    main.shortcuts .sc-links-grid{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 16px;
    }
    main.shortcuts .sc-link-card{
    background: var(--sc-bg-white);
    border-radius: var(--sc-radius);
    padding: 24px;
    border: 1px solid var(--sc-border-light);
    box-shadow: var(--sc-card-shadow);
    text-decoration: none;
    color: var(--sc-text);
    transition: transform 0.2s, box-shadow 0.2s;
    display: block;
    }
    main.shortcuts .sc-link-card:hover{
    transform: translateY(-3px);
    box-shadow: var(--sc-card-shadow-hover);
    }
    main.shortcuts .sc-link-card h3{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.05rem;
    margin: 0 0 8px;
    color: var(--sc-primary);
    }
    main.shortcuts .sc-link-card p{
    font-size: 0.88rem;
    color: var(--sc-text-light);
    margin: 0;
    line-height: 1.65;
    }
    main.shortcuts .sc-footer{
    background: var(--sc-text);
    color: hsl(244, 10%, 70%);
    padding: 40px 24px;
    }
    main.shortcuts .sc-footer-inner{
    max-width: 1120px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    }
    main.shortcuts .sc-footer-brand{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.1rem;
    color: #fff;
    font-weight: 700;
    }
    main.shortcuts .sc-footer-brand span{
    display: block;
    font-family: "Inter", sans-serif;
    font-size: 0.78rem;
    font-weight: 400;
    color: hsl(244, 10%, 55%);
    margin-top: 4px;
    }
    main.shortcuts .sc-footer-links{
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
    }
    main.shortcuts .sc-footer-links a{
    color: hsl(244, 10%, 65%);
    text-decoration: none;
    font-size: 0.85rem;
    transition: color 0.2s;
    }
    main.shortcuts .sc-footer-links a:hover{
    color: #fff;
    }
    main.shortcuts .sc-footer-copy{
    width: 100%;
    text-align: center;
    font-size: 0.8rem;
    padding-top: 24px;
    margin-top: 24px;
    border-top: 1px solid hsl(244, 10%, 22%);
    color: hsl(244, 10%, 45%);
    }
    @media (max-width: 768px) {main.shortcuts .ridge{
    padding: 60px 20px 48px;
    }
    main.shortcuts .ridge h1{
    font-size: 1.7rem;
    }
    main.shortcuts .zenith{
    grid-template-columns: 1fr;
    }
    main.shortcuts .prism{
    display: none;
    }
    main.shortcuts .facet{
    padding: 10px 16px;
    }
    main.shortcuts .facet:not(:last-child){
    border-right: none;
    border-bottom: 1px dashed var(--sc-border-light);
    }
    main.shortcuts .facet::before{
    content: attr(data-label);
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--sc-text-light);
    margin-right: 12px;
    min-width: 70px;
    }
    main.shortcuts .sc-banner-inner{
    padding: 32px 24px;
    flex-direction: column;
    text-align: center;
    }
    main.shortcuts .sc-toc-inner{
    padding: 20px;
    }
    main.shortcuts .sc-toc-grid{
    grid-template-columns: 1fr 1fr;
    }
    main.shortcuts .sc-footer-inner{
    flex-direction: column;
    text-align: center;
    }
    main.shortcuts .sc-footer-links{
    justify-content: center;
    }}
    @media (max-width: 480px) {main.shortcuts .sc-toc-grid{
    grid-template-columns: 1fr;
    }
    main.shortcuts .notch{
    width: 100%;
    }
    main.shortcuts .whelk{
    flex: 1;
    text-align: center;
    }}
    main.shortcuts .umbra{
    background: var(--text-color, hsl(244, 10%, 11%));
    padding: 48px 24px 36px;
    margin-top: 0;
    }
    main.shortcuts .phantom{
    max-width: var(--max-width, 1200px);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 32px;
    }
    main.shortcuts .pulse{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 24px;
    padding-bottom: 28px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    main.shortcuts .ivory{
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
    }
    main.shortcuts .vigor{
    color: var(--primary-color, hsl(244, 78%, 57%));
    flex: 0 0 24px;
    }
    main.shortcuts .brine{
    font-family: Georgia, "Times New Roman", serif;
    font-size: 17px;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: -0.01em;
    }
    main.shortcuts .cobalt{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    flex: 0 1 auto;
    }
    main.shortcuts .cleft{
    color: rgba(255, 255, 255, 0.6);
    text-decoration: none;
    font-size: 14px;
    padding: 4px 6px;
    border-radius: var(--radius-sm, 6px);
    transition: var(--transition, all 0.25s ease);
    }
    main.shortcuts .cleft:hover{
    color: #ffffff;
    background: rgba(255, 255, 255, 0.07);
    }
    main.shortcuts .helix{
    color: rgba(255, 255, 255, 0.2);
    font-size: 14px;
    user-select: none;
    }
    main.shortcuts .jade3{
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    }
    main.shortcuts .flare{
    color: rgba(255, 255, 255, 0.4);
    font-size: 13px;
    margin: 0;
    flex: 1 1 auto;
    }
    main.shortcuts .mosaic{
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    }
    main.shortcuts .nexus{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-sm, 6px);
    color: rgba(255, 255, 255, 0.45);
    transition: var(--transition, all 0.25s ease);
    }
    main.shortcuts .nexus:hover{
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
    }
    @media (max-width: 640px) {main.shortcuts .umbra{
    padding: 36px 20px 28px;
    }
    main.shortcuts .pulse{
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    padding-bottom: 24px;
    }
    main.shortcuts .cobalt{
    gap: 4px;
    }
    main.shortcuts .jade3{
    flex-direction: column;
    align-items: flex-start;
    gap: 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;
    }

    *,
    *::before,
    *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height);
    font-family: "Playfair Display", "Noto Serif SC", "Source Han Serif SC", Georgia, "Times New Roman", serif;
    color: var(--text-color);
    background: var(--bg-color);
    }
    
    .nimbus {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    height: var(--nav-height);
    background: rgba(240, 239, 243, 0.82);
    backdrop-filter: blur(18px) saturate(1.6);
    -webkit-backdrop-filter: blur(18px) saturate(1.6);
    border-bottom: 1px solid var(--border-color);
    }
    .jade_pip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: var(--max-width);
    height: 100%;
    margin: 0 auto;
    padding: 0 28px;
    }
    
    .rumble {
    flex-shrink: 0;
    }
    .obsidian {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--text-color);
    }
    .frozenOrb {
    display: block;
    flex-shrink: 0;
    }
    .driftKnob {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    }
    
    .quilted {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    }
    .pale_dust {
    position: relative;
    }
    .blazeKit {
    display: block;
    padding: 8px 14px;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    white-space: nowrap;
    letter-spacing: 0.01em;
    }
    .blazeKit:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.06);
    }
    
    .craggy {
    flex-shrink: 0;
    }
    .zephyr {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 26px;
    font-family: inherit;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    }
    .zephyr:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    filter: brightness(1.08);
    }
    .zephyr:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(93, 63, 211, 0.3);
    }
    
    .px_rail {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .px_rail:hover {
    background: rgba(30, 26, 56, 0.06); color: #ffffff;}
    .ember {
    display: block;
    width: 22px;
    height: 2.5px;
    background: var(--text-color);
    border-radius: 2px;
    transition: var(--transition);
    }
    
    .waxShell {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(20, 18, 40, 0.45);
    opacity: 0;
    transition: opacity 0.3s ease; color: #ffffff;}
    .waxShell.is-visible {
    display: block;
    opacity: 1;
    }
    
    .moonArc {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1200;
    width: 300px;
    max-width: 85vw;
    background: var(--bg-color);
    box-shadow: var(--shadow-lg);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    flex-direction: column;
    }
    .moonArc.is-open {
    display: flex;
    transform: translateX(0);
    }
    .sv3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 12px;
    border-bottom: 1px solid var(--border-color);
    }
    .tq7b {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-color);
    letter-spacing: -0.01em;
    }
    .fizzle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 1.5rem;
    line-height: 1;
    color: var(--text-muted);
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .fizzle:hover {
    background: rgba(30, 26, 56, 0.06);
    color: #ffffff;
    }
    .husk_tone {
    list-style: none;
    padding: 12px 16px;
    flex: 1;
    }
    .crumble {
    border-radius: var(--radius-sm);
    }
    .vortex9 {
    display: block;
    padding: 13px 12px;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    }
    .vortex9:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.05);
    }
    .plume {
    padding: 16px 24px 28px;
    }
    .gnarly {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 14px 20px;
    font-family: inherit;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    }
    .gnarly:hover {
    filter: brightness(1.08);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    }
    
    @media (max-width: 960px) {.quilted {
    display: none;
    }
    .craggy {
    display: none;
    }
    .px_rail {
    display: flex;
    }}
    @media (min-width: 961px) {.waxShell,
    .moonArc {
    display: none !important;
    }}
    .blazeKit.active {color: #ffffff; background: rgba(30, 26, 56, 0.06);}
    .vortex9.active {color: #ffffff; background: rgba(30, 26, 56, 0.05);}
    @import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700;800&family=Inter:wght@400;500;600;700&display=swap");
    main.update .dusk{
    position: relative;
    padding: 80px 24px 64px;
    background: linear-gradient(160deg, hsl(244, 78%, 57%) 0%, hsl(280, 60%, 50%) 50%, hsl(333, 62%, 57%) 100%);
    text-align: center;
    overflow: hidden;
    }
    main.update .dusk::before{
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(255,255,255,0.15) 0%, transparent 70%);
    pointer-events: none;
    }
    main.update .lumen{
    position: relative;
    max-width: 780px;
    margin: 0 auto;
    z-index: 1;
    }
    main.update .dusk h1{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(2rem, 5vw, 3.2rem);
    font-weight: 800;
    color: #ffffff;
    line-height: 1.25;
    margin: 0 0 20px;
    letter-spacing: -0.02em;
    }
    main.update .glyph{
    font-family: "Inter", sans-serif;
    font-size: 1.05rem;
    color: rgba(255,255,255,0.9);
    line-height: 1.7;
    margin: 0 0 32px;
    max-width: 620px;
    margin-left: auto;
    margin-right: auto;
    }
    main.update .alloy{
    display: flex;
    gap: 14px;
    justify-content: center;
    flex-wrap: wrap;
    }
    main.update .fathom{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 32px;
    background: #ffffff;
    color: var(--page-primary);
    font-family: "Inter", sans-serif;
    font-size: 0.95rem;
    font-weight: 700;
    border: none;
    border-radius: 50px;
    text-decoration: none;
    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
    transition: transform 0.2s, box-shadow 0.2s;
    cursor: pointer;
    }
    main.update .fathom:hover{
    transform: translateY(-2px);
    box-shadow: 0 6px 28px rgba(0,0,0,0.2);
    }
    main.update .forge{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 28px;
    background: rgba(255,255,255,0.15);
    color: #ffffff;
    font-family: "Inter", sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    border: 1.5px solid rgba(255,255,255,0.4);
    border-radius: 50px;
    text-decoration: none;
    backdrop-filter: blur(8px);
    transition: background 0.2s, border-color 0.2s;
    }
    main.update .forge:hover{
    background: rgba(255,255,255,0.25);
    border-color: rgba(255,255,255,0.6);
    }
    main.update .knoll{
    max-width: 960px;
    margin: -36px auto 0;
    padding: 0 24px;
    position: relative;
    z-index: 2;
    }
    main.update .echo{
    background: var(--page-surface);
    border-radius: var(--page-radius-lg);
    padding: 28px 36px;
    display: flex;
    align-items: center;
    gap: 20px;
    box-shadow: var(--page-shadow-lg);
    border: 1px solid var(--page-border);
    }
    main.update .crux{
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    background: linear-gradient(135deg, var(--page-primary), var(--page-secondary));
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    }
    main.update .crux svg{
    width: 26px;
    height: 26px;
    fill: none;
    stroke: #fff;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    }
    main.update .flux{
    flex: 1;
    }
    main.update .flux strong{
    font-family: "Inter", sans-serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--page-text);
    display: block;
    margin-bottom: 4px;
    }
    main.update .flux span{
    font-family: "Inter", sans-serif;
    font-size: 0.88rem;
    color: var(--page-muted);
    line-height: 1.5;
    }
    main.update .flux code{
    background: hsl(244, 20%, 93%);
    padding: 2px 7px;
    border-radius: 5px;
    font-size: 0.82rem;
    color: var(--page-primary);
    font-weight: 600;
    }
    main.update .orbit{
    max-width: 960px;
    margin: 0 auto;
    padding: 56px 24px;
    }
    main.update .orbit h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.85rem;
    font-weight: 700;
    color: var(--page-text);
    margin: 0 0 12px;
    letter-spacing: -0.01em;
    }
    main.update .cairn{
    font-family: "Inter", sans-serif;
    font-size: 0.95rem;
    color: var(--page-muted);
    line-height: 1.6;
    margin: 0 0 36px;
    max-width: 640px;
    }
    main.update .quarry{
    position: relative;
    padding-left: 36px;
    }
    main.update .quarry::before{
    content: "";
    position: absolute;
    left: 14px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background: linear-gradient(to bottom, var(--page-primary), var(--page-secondary), var(--page-border));
    border-radius: 2px;
    }
    main.update .spire{
    position: relative;
    margin-bottom: 40px;
    }
    main.update .spire:last-child{
    margin-bottom: 0;
    }
    main.update .basalt{
    position: absolute;
    left: -29px;
    top: 6px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--page-primary);
    border: 3px solid var(--page-bg);
    box-shadow: 0 0 0 2px var(--page-primary);
    z-index: 1;
    }
    main.update .spire.vault .basalt{
    width: 14px;
    height: 14px;
    left: -30px;
    top: 5px;
    background: linear-gradient(135deg, var(--page-primary), var(--page-secondary));
    box-shadow: 0 0 0 3px rgba(99, 66, 204, 0.25);
    animation: pulse-dot 2s ease-in-out infinite;
    }
    @keyframes pulse-dot {0%, 100% { box-shadow: 0 0 0 3px rgba(99, 66, 204, 0.25); }
    50% { box-shadow: 0 0 0 6px rgba(99, 66, 204, 0.1); }}
    main.update .axiom{
    background: var(--page-surface);
    border-radius: var(--page-radius-lg);
    padding: 32px;
    box-shadow: var(--page-shadow-sm);
    border: 1px solid var(--page-border);
    transition: box-shadow 0.25s, transform 0.25s;
    }
    main.update .axiom:hover{
    box-shadow: var(--page-shadow-md);
    transform: translateY(-2px);
    }
    main.update .spire.vault .axiom{
    border-color: transparent;
    background: linear-gradient(var(--page-surface), var(--page-surface)) padding-box,
    linear-gradient(135deg, var(--page-primary), var(--page-secondary)) border-box;
    border: 1.5px solid transparent;
    box-shadow: var(--page-shadow-md);
    }
    main.update .talon{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
    flex-wrap: wrap;
    }
    main.update .wicker{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    }
    main.update .wicker h3{
    font-family: "Inter", sans-serif;
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--page-text);
    margin: 0;
    }
    main.update .crest{
    display: inline-block;
    padding: 3px 10px;
    background: linear-gradient(135deg, var(--page-primary), var(--page-secondary));
    color: #fff;
    font-family: "Inter", sans-serif;
    font-size: 0.7rem;
    font-weight: 700;
    border-radius: 20px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    }
    main.update .delta{
    font-family: "Inter", sans-serif;
    font-size: 0.82rem;
    color: var(--page-muted);
    padding-top: 4px;
    white-space: nowrap;
    }
    main.update .vertex{
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 16px;
    }
    main.update .opal{
    display: inline-block;
    padding: 4px 12px;
    background: hsl(244, 20%, 93%);
    color: var(--page-text);
    font-family: "Inter", sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 20px;
    }
    main.update .spark{
    display: grid;
    gap: 16px;
    }
    main.update .lattice{
    font-family: "Inter", sans-serif;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--page-primary);
    margin: 0 0 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    }
    main.update .lattice svg{
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    }
    main.update .monolith{
    list-style: none;
    padding: 0;
    margin: 0;
    }
    main.update .monolith li{
    font-family: "Inter", sans-serif;
    font-size: 0.88rem;
    color: var(--page-text);
    line-height: 1.65;
    padding: 4px 0 4px 20px;
    position: relative;
    }
    main.update .monolith li::before{
    content: "";
    position: absolute;
    left: 0;
    top: 12px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--page-border);
    }
    main.update .monolith li strong{
    color: var(--page-text);
    font-weight: 600;
    }
    main.update .security-count{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: hsl(30, 90%, 96%);
    border: 1px solid hsl(30, 70%, 88%);
    border-radius: var(--page-radius-sm);
    font-family: "Inter", sans-serif;
    font-size: 0.82rem;
    color: hsl(30, 60%, 35%);
    font-weight: 600;
    margin-top: 4px;
    }
    main.update .security-count svg{
    width: 14px;
    height: 14px;
    }
    main.update .update-image-section{
    max-width: 960px;
    margin: 0 auto 56px;
    padding: 0 24px;
    }
    main.update .update-image-card{
    border-radius: var(--page-radius-xl);
    overflow: hidden;
    box-shadow: var(--page-shadow-lg);
    border: 1px solid var(--page-border);
    position: relative;
    }
    main.update .update-image-card img{
    width: 100%;
    display: block;
    aspect-ratio: 16 / 7;
    object-fit: cover;
    }
    main.update .update-image-overlay{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 40px 36px 28px;
    background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, transparent 100%); color: #ffffff;}
    main.update .update-image-overlay p{
    font-family: "Inter", sans-serif;
    font-size: 0.9rem;
    color: rgba(255,255,255,0.92);
    margin: 0;
    line-height: 1.6;
    }
    main.update .how-to-update{
    max-width: 960px;
    margin: 0 auto;
    padding: 0 24px 56px;
    }
    main.update .how-to-update h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.85rem;
    font-weight: 700;
    color: var(--page-text);
    margin: 0 0 12px;
    }
    main.update .how-to-update .cairn{
    margin-bottom: 32px;
    }
    main.update .steps-grid{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    }
    main.update .step-card{
    background: var(--page-surface);
    border-radius: var(--page-radius-lg);
    padding: 28px 24px;
    box-shadow: var(--page-shadow-sm);
    border: 1px solid var(--page-border);
    text-align: center;
    transition: box-shadow 0.25s, transform 0.25s;
    }
    main.update .step-card:hover{
    box-shadow: var(--page-shadow-md);
    transform: translateY(-3px);
    }
    main.update .step-number{
    width: 44px;
    height: 44px;
    margin: 0 auto 16px;
    background: linear-gradient(135deg, var(--page-primary), hsl(270, 65%, 55%));
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.2rem;
    font-weight: 800;
    color: #fff;
    }
    main.update .step-card h3{
    font-family: "Inter", sans-serif;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--page-text);
    margin: 0 0 8px;
    }
    main.update .step-card p{
    font-family: "Inter", sans-serif;
    font-size: 0.84rem;
    color: var(--page-muted);
    line-height: 1.6;
    margin: 0;
    }
    main.update .step-card code{
    background: hsl(244, 20%, 93%);
    padding: 2px 7px;
    border-radius: 5px;
    font-size: 0.78rem;
    color: var(--page-primary);
    font-weight: 600;
    }
    main.update .faq-section{
    max-width: 960px;
    margin: 0 auto;
    padding: 0 24px 56px;
    }
    main.update .faq-section h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.85rem;
    font-weight: 700;
    color: var(--page-text);
    margin: 0 0 32px;
    }
    main.update .faq-list{
    display: grid;
    gap: 14px;
    }
    main.update .faq-item{
    background: var(--page-surface);
    border-radius: var(--page-radius-md);
    border: 1px solid var(--page-border);
    overflow: hidden;
    }
    main.update .faq-item summary{
    padding: 20px 24px;
    font-family: "Inter", sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--page-text);
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    transition: background 0.2s;
    }
    main.update .faq-item summary:hover{
    background: hsl(244, 10%, 97%);
    }
    main.update .faq-item summary::-webkit-details-marker{
    display: none;
    }
    main.update .faq-chevron{
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    transition: transform 0.25s;
    color: var(--page-muted);
    }
    main.update .faq-item[open] .faq-chevron{
    transform: rotate(180deg);
    }
    main.update .faq-answer{
    padding: 0 24px 20px;
    font-family: "Inter", sans-serif;
    font-size: 0.88rem;
    color: var(--page-muted);
    line-height: 1.7;
    }
    main.update .faq-answer a{
    color: var(--page-primary);
    text-decoration: none;
    font-weight: 600;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s;
    }
    main.update .faq-answer a:hover{
    border-bottom-color: var(--page-primary);
    }
    main.update .cta-bottom{
    max-width: 960px;
    margin: 0 auto;
    padding: 0 24px 64px;
    }
    main.update .cta-bottom-card{
    background: linear-gradient(135deg, var(--page-primary) 0%, hsl(280, 60%, 50%) 60%, var(--page-secondary) 100%);
    border-radius: var(--page-radius-xl);
    padding: 52px 40px;
    text-align: center;
    position: relative;
    overflow: hidden; color: #ffffff;}
    main.update .cta-bottom-card::before{
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 20%, rgba(255,255,255,0.12) 0%, transparent 50%);
    pointer-events: none;
    }
    main.update .cta-bottom-card h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.7rem;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 12px;
    position: relative;
    }
    main.update .cta-bottom-card p{
    font-family: "Inter", sans-serif;
    font-size: 0.95rem;
    color: rgba(255,255,255,0.88);
    margin: 0 0 28px;
    line-height: 1.6;
    position: relative;
    }
    main.update .cta-bottom-card .fathom{
    position: relative;
    }
    main.update .page-footer{
    background: var(--page-text, hsl(244, 10%, 11%));
    padding: 48px 24px 36px;
    }
    main.update .torque{
    max-width: 960px;
    margin: 0 auto;
    }
    main.update .footer-top{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 32px;
    margin-bottom: 32px;
    flex-wrap: wrap;
    }
    main.update .footer-brand{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.15rem;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 6px;
    }
    main.update .footer-tagline{
    font-family: "Inter", sans-serif;
    font-size: 0.8rem;
    color: rgba(255,255,255,0.45);
    margin: 0;
    }
    main.update .footer-links{
    display: flex;
    gap: 24px;
    flex-wrap: wrap;
    }
    main.update .footer-links a{
    font-family: "Inter", sans-serif;
    font-size: 0.84rem;
    color: rgba(255,255,255,0.55);
    text-decoration: none;
    transition: color 0.2s;
    }
    main.update .footer-links a:hover{
    color: #ffffff;
    }
    main.update .mantle{
    height: 1px;
    background: rgba(255,255,255,0.1);
    margin-bottom: 24px;
    }
    main.update .apex{
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    }
    main.update .jade{
    font-family: "Inter", sans-serif;
    font-size: 0.78rem;
    color: rgba(255,255,255,0.35);
    margin: 0;
    }
    main.update .footer-legal{
    display: flex;
    gap: 20px;
    }
    main.update .footer-legal a{
    font-family: "Inter", sans-serif;
    font-size: 0.78rem;
    color: rgba(255,255,255,0.35);
    text-decoration: none;
    transition: color 0.2s;
    }
    main.update .footer-legal a:hover{
    color: rgba(255,255,255,0.7);
    }
    @media (max-width: 768px) {main.update .dusk{
    padding: 60px 20px 52px;
    }
    main.update .echo{
    flex-direction: column;
    text-align: center;
    padding: 24px;
    }
    main.update .steps-grid{
    grid-template-columns: 1fr;
    }
    main.update .quarry{
    padding-left: 28px;
    }
    main.update .quarry::before{
    left: 10px;
    }
    main.update .basalt{
    left: -24px;
    }
    main.update .spire.vault .basalt{
    left: -25px;
    }
    main.update .axiom{
    padding: 24px 20px;
    }
    main.update .talon{
    flex-direction: column;
    gap: 8px;
    }
    main.update .footer-top{
    flex-direction: column;
    gap: 20px;
    }
    main.update .cta-bottom-card{
    padding: 40px 24px;
    }
    main.update .update-image-overlay{
    padding: 24px 20px 20px;
    }}
    @media (max-width: 480px) {main.update .alloy{
    flex-direction: column;
    align-items: center;
    }
    main.update .fathom, main.update .forge{
    width: 100%;
    justify-content: center;
    }}
    main.update .grove{
    background: hsl(244, 12%, 13%);
    color: hsl(244, 10%, 82%);
    padding: 64px 24px 0;
    font-family: "Georgia", "Noto Serif SC", "Source Han Serif SC", serif;
    }
    main.update .torque{
    max-width: var(--max-width, 1200px);
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 40px 32px;
    padding-bottom: 48px;
    }
    main.update .aether{
    flex: 1 1 260px;
    min-width: 220px;
    }
    main.update .slate{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    }
    main.update .sable{
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    }
    main.update .husk{
    font-size: 1.2rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.01em;
    font-family: "Georgia", "Noto Serif SC", serif;
    }
    main.update .shard{
    font-size: 0.95rem;
    line-height: 1.65;
    color: hsl(244, 8%, 58%);
    margin: 0;
    max-width: 260px;
    }
    main.update .rift{
    flex: 0 1 150px;
    min-width: 120px;
    }
    main.update .nova{
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: hsl(244, 10%, 72%);
    margin: 0 0 16px;
    font-family: "Georgia", "Noto Serif SC", serif;
    }
    main.update .tundra{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    }
    main.update .timber{
    margin: 0;
    padding: 0;
    }
    main.update .sigil{
    font-size: 0.92rem;
    color: hsl(244, 8%, 58%);
    text-decoration: none;
    transition: var(--transition, all 0.25s ease);
    border-radius: var(--radius-sm, 6px);
    padding: 2px 0;
    display: inline-block;
    }
    main.update .sigil:hover{
    color: #fff;
    }
    main.update .riddle{
    flex: 0 1 180px;
    min-width: 160px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 14px;
    }
    main.update .fable{
    font-size: 0.95rem;
    color: hsl(244, 10%, 72%);
    margin: 0;
    font-weight: 600;
    }
    main.update .bloom{
    display: inline-block;
    padding: 12px 30px;
    font-size: 0.95rem;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, var(--primary-color, hsl(244, 78%, 57%)), var(--secondary-color, hsl(333, 62%, 57%)));
    border: none;
    border-radius: var(--radius-lg, 20px);
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 4px 18px rgba(90, 56, 220, 0.25), 0 1.5px 6px rgba(200, 60, 130, 0.13);
    transition: var(--transition, all 0.25s ease);
    letter-spacing: 0.02em;
    font-family: "Georgia", "Noto Serif SC", serif;
    }
    main.update .bloom:hover{
    box-shadow: 0 6px 28px rgba(90, 56, 220, 0.38), 0 2px 10px rgba(200, 60, 130, 0.18);
    transform: translateY(-2px);
    filter: brightness(1.08);
    }
    main.update .mantle{
    max-width: var(--max-width, 1200px);
    margin: 0 auto;
    height: 1px;
    background: rgba(255, 255, 255, 0.08);
    }
    main.update .apex{
    max-width: var(--max-width, 1200px);
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: 22px 0 28px;
    gap: 12px 24px;
    }
    main.update .jade{
    font-size: 0.85rem;
    color: hsl(244, 8%, 46%);
    margin: 0;
    flex: 1 1 auto;
    }
    main.update .warden{
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 1 auto;
    }
    main.update .oxide{
    font-size: 0.85rem;
    color: hsl(244, 8%, 52%);
    text-decoration: none;
    transition: var(--transition, all 0.25s ease);
    }
    main.update .oxide:hover{
    color: #fff;
    }
    main.update .rune{
    color: hsl(244, 8%, 34%);
    font-size: 0.85rem;
    user-select: none;
    }
    @media (max-width: 768px) {main.update .grove{
    padding: 44px 18px 0;
    }
    main.update .torque{
    flex-direction: column;
    gap: 32px;
    }
    main.update .aether{
    flex: 1 1 100%;
    }
    main.update .rift{
    flex: 1 1 100%;
    }
    main.update .riddle{
    flex: 1 1 100%;
    align-items: stretch;
    }
    main.update .bloom{
    text-align: center;
    width: 100%;
    }
    main.update .apex{
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 18px 0 24px;
    }
    main.update .warden{
    flex-wrap: wrap;
    }}
    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;
    }

    *,
    *::before,
    *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    }
    body {
    padding-top: var(--nav-height);
    font-family: "Playfair Display", "Noto Serif SC", "Source Han Serif SC", Georgia, "Times New Roman", serif;
    color: var(--text-color);
    background: var(--bg-color);
    }
    
    .nimbus {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    height: var(--nav-height);
    background: rgba(240, 239, 243, 0.82);
    backdrop-filter: blur(18px) saturate(1.6);
    -webkit-backdrop-filter: blur(18px) saturate(1.6);
    border-bottom: 1px solid var(--border-color);
    }
    .jade_pip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: var(--max-width);
    height: 100%;
    margin: 0 auto;
    padding: 0 28px;
    }
    
    .rumble {
    flex-shrink: 0;
    }
    .obsidian {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--text-color);
    }
    .frozenOrb {
    display: block;
    flex-shrink: 0;
    }
    .driftKnob {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    }
    
    .quilted {
    display: flex;
    align-items: center;
    gap: 4px;
    list-style: none;
    }
    .pale_dust {
    position: relative;
    }
    .blazeKit {
    display: block;
    padding: 8px 14px;
    font-size: 0.9rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    white-space: nowrap;
    letter-spacing: 0.01em;
    }
    .blazeKit:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.06);
    }
    
    .craggy {
    flex-shrink: 0;
    }
    .zephyr {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 26px;
    font-family: inherit;
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    }
    .zephyr:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    filter: brightness(1.08);
    }
    .zephyr:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(93, 63, 211, 0.3);
    }
    
    .px_rail {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .px_rail:hover {
    background: rgba(30, 26, 56, 0.06); color: #ffffff;}
    .ember {
    display: block;
    width: 22px;
    height: 2.5px;
    background: var(--text-color);
    border-radius: 2px;
    transition: var(--transition);
    }
    
    .waxShell {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(20, 18, 40, 0.45);
    opacity: 0;
    transition: opacity 0.3s ease; color: #ffffff;}
    .waxShell.is-visible {
    display: block;
    opacity: 1;
    }
    
    .moonArc {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1200;
    width: 300px;
    max-width: 85vw;
    background: var(--bg-color);
    box-shadow: var(--shadow-lg);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    overflow-y: auto;
    flex-direction: column;
    }
    .moonArc.is-open {
    display: flex;
    transform: translateX(0);
    }
    .sv3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px 12px;
    border-bottom: 1px solid var(--border-color);
    }
    .tq7b {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-color);
    letter-spacing: -0.01em;
    }
    .fizzle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 1.5rem;
    line-height: 1;
    color: var(--text-muted);
    background: transparent;
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: var(--transition);
    }
    .fizzle:hover {
    background: rgba(30, 26, 56, 0.06);
    color: #ffffff;
    }
    .husk_tone {
    list-style: none;
    padding: 12px 16px;
    flex: 1;
    }
    .crumble {
    border-radius: var(--radius-sm);
    }
    .vortex9 {
    display: block;
    padding: 13px 12px;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    }
    .vortex9:hover {
    color: #ffffff;
    background: rgba(30, 26, 56, 0.05);
    }
    .plume {
    padding: 16px 24px 28px;
    }
    .gnarly {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 14px 20px;
    font-family: inherit;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--btn-text);
    text-decoration: none;
    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
    border: none;
    border-radius: var(--radius-lg);
    box-shadow: 0 4px 14px rgba(93, 63, 211, 0.35);
    cursor: pointer;
    transition: var(--transition);
    }
    .gnarly:hover {
    filter: brightness(1.08);
    box-shadow: 0 6px 22px rgba(93, 63, 211, 0.45);
    }
    
    @media (max-width: 960px) {.quilted {
    display: none;
    }
    .craggy {
    display: none;
    }
    .px_rail {
    display: flex;
    }}
    @media (min-width: 961px) {.waxShell,
    .moonArc {
    display: none !important;
    }}
    .blazeKit.active {color: #ffffff; background: rgba(30, 26, 56, 0.06);}
    .vortex9.active {color: #ffffff; background: rgba(30, 26, 56, 0.05);}
    @import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;700;800&family=Inter:wght@400;500;600;700&display=swap");
    main.system-requirements *{ margin: 0; padding: 0; box-sizing: border-box; }
    main.system-requirements .flint{
    font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--sr-text);
    background: var(--sr-bg);
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    }
    main.system-requirements .tundra{
    position: relative;
    overflow: hidden;
    padding: 80px 24px 64px;
    background: linear-gradient(160deg, hsl(244, 60%, 22%) 0%, hsl(244, 78%, 37%) 40%, hsl(280, 50%, 40%) 100%);
    color: #ffffff;
    text-align: center;
    }
    main.system-requirements .tundra::before{
    content: "";
    position: absolute;
    top: -40%;
    right: -20%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, hsla(333, 62%, 57%, 0.2) 0%, transparent 70%);
    pointer-events: none;
    }
    main.system-requirements .tundra::after{
    content: "";
    position: absolute;
    bottom: -30%;
    left: -10%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, hsla(244, 78%, 57%, 0.15) 0%, transparent 70%);
    pointer-events: none; color: #ffffff;}
    main.system-requirements .comet{
    position: relative;
    z-index: 1;
    max-width: 800px;
    margin: 0 auto;
    }
    main.system-requirements .tundra h1{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(2rem, 5vw, 3.2rem);
    font-weight: 800;
    line-height: 1.25;
    margin-bottom: 20px;
    letter-spacing: -0.02em;
    }
    main.system-requirements .haze{
    font-size: 1.08rem;
    line-height: 1.75;
    opacity: 0.9;
    max-width: 640px;
    margin: 0 auto 32px;
    }
    main.system-requirements .dune{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.88rem;
    opacity: 0.7;
    background: hsla(0, 0%, 100%, 0.08);
    padding: 8px 20px;
    border-radius: 100px;
    }
    main.system-requirements .pulse{
    margin-top: 40px;
    max-width: 680px;
    width: 100%;
    border-radius: var(--sr-radius-lg);
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 20px 60px hsla(244, 50%, 10%, 0.35);
    }
    main.system-requirements .pulse img{
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    aspect-ratio: 16/9;
    }
    main.system-requirements .anvil{
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 24px;
    }
    main.system-requirements .zenith{
    padding: 72px 0;
    }
    main.system-requirements .crux{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    margin-bottom: 12px;
    letter-spacing: -0.01em;
    }
    main.system-requirements .rift{
    color: var(--sr-text-light);
    font-size: 1rem;
    margin-bottom: 40px;
    max-width: 600px;
    }
    
    main.system-requirements .nexus{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 24px;
    }
    main.system-requirements .cascade{
    background: var(--sr-white);
    border-radius: var(--sr-radius-lg);
    padding: 36px 32px;
    box-shadow: var(--sr-card-shadow);
    border: 1px solid var(--sr-border);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
    position: relative;
    overflow: hidden;
    }
    main.system-requirements .cascade:hover{
    box-shadow: var(--sr-card-shadow-hover);
    transform: translateY(-3px);
    }
    main.system-requirements .grain{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    }
    main.system-requirements .onyx{ background: linear-gradient(90deg, var(--sr-primary), hsl(220, 70%, 55%)); }
    main.system-requirements .frost{ background: linear-gradient(90deg, hsl(244, 50%, 50%), hsl(280, 50%, 55%)); }
    main.system-requirements .cobalt{ background: linear-gradient(90deg, hsl(30, 70%, 55%), hsl(15, 65%, 50%)); }
    main.system-requirements .glacier{ background: linear-gradient(90deg, hsl(140, 55%, 42%), hsl(170, 50%, 45%)); }
    main.system-requirements .sr-card-accent--ios{ background: linear-gradient(90deg, var(--sr-secondary), hsl(350, 60%, 55%)); }
    main.system-requirements .shard{
    width: 48px;
    height: 48px;
    border-radius: var(--sr-radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    }
    main.system-requirements .shard svg{
    width: 28px;
    height: 28px;
    }
    main.system-requirements .solstice{ background: hsla(244, 78%, 57%, 0.1); color: #ffffff; }
    main.system-requirements .vertex{ background: hsla(280, 50%, 55%, 0.1); color: hsl(280, 50%, 45%); }
    main.system-requirements .quartz{ background: hsla(30, 70%, 55%, 0.1); color: hsl(30, 70%, 45%); }
    main.system-requirements .loom{ background: hsla(140, 55%, 42%, 0.1); color: hsl(140, 55%, 35%); }
    main.system-requirements .sr-card-icon--ios{ background: hsla(333, 62%, 57%, 0.1); color: var(--sr-secondary); }
    main.system-requirements .cascade h3{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.35rem;
    font-weight: 700;
    margin-bottom: 20px;
    }
    main.system-requirements .helix{
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
    }
    main.system-requirements .rune{
    display: flex;
    gap: 12px;
    font-size: 0.94rem;
    line-height: 1.6;
    }
    main.system-requirements .phantom{
    flex-shrink: 0;
    width: 80px;
    font-weight: 600;
    color: var(--sr-text);
    font-size: 0.85rem;
    padding-top: 1px;
    }
    main.system-requirements .basalt{
    color: var(--sr-text-light);
    }
    main.system-requirements .grove{
    border: none;
    border-top: 1px solid var(--sr-border);
    margin: 8px 0;
    }
    
    main.system-requirements .sr-recommend{
    background: var(--sr-white);
    border-radius: var(--sr-radius-lg);
    padding: 48px 40px;
    box-shadow: var(--sr-card-shadow);
    border: 1px solid var(--sr-border);
    }
    main.system-requirements .sr-recommend-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 32px;
    margin-top: 32px;
    }
    main.system-requirements .sr-recommend-item{
    text-align: center;
    padding: 28px 20px;
    border-radius: var(--sr-radius-md);
    background: var(--sr-bg);
    transition: background 0.2s;
    }
    main.system-requirements .sr-recommend-item:hover{
    background: hsla(244, 78%, 57%, 0.05); color: #ffffff;}
    main.system-requirements .sr-recommend-icon{
    width: 52px;
    height: 52px;
    margin: 0 auto 16px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--sr-primary), hsl(280, 50%, 55%));
    color: var(--sr-white);
    }
    main.system-requirements .sr-recommend-icon svg{
    width: 24px;
    height: 24px;
    }
    main.system-requirements .sr-recommend-item h4{
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: 6px;
    }
    main.system-requirements .sr-recommend-item p{
    font-size: 0.9rem;
    color: var(--sr-text-light);
    line-height: 1.55;
    }
    
    main.system-requirements .sr-storage-table{
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: var(--sr-radius-md);
    overflow: hidden;
    box-shadow: var(--sr-card-shadow);
    border: 1px solid var(--sr-border);
    margin-top: 32px;
    }
    main.system-requirements .sr-storage-table thead{
    background: linear-gradient(135deg, var(--sr-primary), hsl(260, 60%, 50%));
    color: #ffffff;
    }
    main.system-requirements .sr-storage-table th{
    padding: 16px 24px;
    text-align: left;
    font-weight: 600;
    font-size: 0.9rem;
    letter-spacing: 0.02em;
    }
    main.system-requirements .sr-storage-table td{
    padding: 14px 24px;
    font-size: 0.92rem;
    background: var(--sr-white);
    border-bottom: 1px solid var(--sr-border);
    color: var(--sr-text-light);
    }
    main.system-requirements .sr-storage-table tbody tr:last-child td{
    border-bottom: none;
    }
    main.system-requirements .sr-storage-table tbody tr:hover td{
    background: hsla(244, 78%, 57%, 0.03); color: #ffffff;}
    
    main.system-requirements .sr-notes{
    background: var(--sr-white);
    border-radius: var(--sr-radius-lg);
    padding: 36px 36px;
    box-shadow: var(--sr-card-shadow);
    border: 1px solid var(--sr-border);
    margin-top: 32px;
    }
    main.system-requirements .sr-notes h3{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.2rem;
    margin-bottom: 16px;
    }
    main.system-requirements .sr-notes ul{
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
    }
    main.system-requirements .sr-notes li{
    position: relative;
    padding-left: 20px;
    font-size: 0.92rem;
    color: var(--sr-text-light);
    line-height: 1.65;
    }
    main.system-requirements .sr-notes li::before{
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--sr-primary);
    opacity: 0.5;
    }
    
    main.system-requirements .sr-cta{
    text-align: center;
    padding: 72px 24px;
    background: linear-gradient(160deg, hsl(244, 60%, 22%) 0%, hsl(244, 78%, 37%) 50%, hsl(280, 50%, 40%) 100%);
    color: #ffffff;
    border-radius: var(--sr-radius-lg);
    margin: 0 24px 0;
    position: relative;
    overflow: hidden;
    }
    main.system-requirements .sr-cta::before{
    content: "";
    position: absolute;
    top: -50%;
    left: 50%;
    transform: translateX(-50%);
    width: 800px;
    height: 800px;
    background: radial-gradient(circle, hsla(333, 62%, 57%, 0.12) 0%, transparent 60%);
    pointer-events: none;
    }
    main.system-requirements .sr-cta-inner{
    position: relative;
    z-index: 1;
    max-width: 560px;
    margin: 0 auto;
    }
    main.system-requirements .sr-cta h2{
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    margin-bottom: 16px;
    }
    main.system-requirements .sr-cta p{
    opacity: 0.85;
    margin-bottom: 32px;
    font-size: 1rem;
    }
    main.system-requirements .sr-cta-btn{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 16px 40px;
    background: var(--sr-white);
    color: var(--sr-primary);
    font-weight: 700;
    font-size: 1.05rem;
    border-radius: 100px;
    text-decoration: none;
    box-shadow: 0 4px 24px hsla(0, 0%, 0%, 0.2);
    transition: transform 0.2s, box-shadow 0.2s;
    }
    main.system-requirements .sr-cta-btn:hover{
    transform: translateY(-2px);
    box-shadow: 0 8px 32px hsla(0, 0%, 0%, 0.3);
    }
    main.system-requirements .sr-cta-btn svg{
    width: 18px;
    height: 18px;
    }
    main.system-requirements .sr-cta-links{
    margin-top: 20px;
    display: flex;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
    }
    main.system-requirements .sr-cta-links a{
    color: hsla(0, 0%, 100%, 0.7);
    text-decoration: none;
    font-size: 0.9rem;
    transition: color 0.2s;
    }
    main.system-requirements .sr-cta-links a:hover{
    color: var(--sr-white);
    }
    
    main.system-requirements .sr-footer{
    padding: 48px 24px 36px;
    text-align: center;
    }
    main.system-requirements .sr-footer-brand{
    font-family: "Playfair Display", Georgia, serif;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--sr-text);
    margin-bottom: 12px;
    }
    main.system-requirements .sr-footer-links{
    display: flex;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 20px;
    }
    main.system-requirements .sr-footer-links a{
    color: var(--sr-text-light);
    text-decoration: none;
    font-size: 0.88rem;
    transition: color 0.2s;
    }
    main.system-requirements .sr-footer-links a:hover{
    color: var(--sr-primary);
    }
    main.system-requirements .sr-footer-copy{
    font-size: 0.82rem;
    color: var(--sr-text-light);
    opacity: 0.7;
    }
    
    main.system-requirements .sr-inline-link{
    color: var(--sr-primary);
    text-decoration: none;
    font-weight: 500;
    border-bottom: 1px solid hsla(244, 78%, 57%, 0.3);
    transition: border-color 0.2s;
    }
    main.system-requirements .sr-inline-link:hover{
    border-color: var(--sr-primary);
    }
    
    @media (max-width: 768px) {main.system-requirements .tundra{ padding: 60px 20px 48px; }
    main.system-requirements .zenith{ padding: 48px 0; }
    main.system-requirements .nexus{ grid-template-columns: 1fr; }
    main.system-requirements .sr-recommend{ padding: 32px 24px; }
    main.system-requirements .sr-recommend-grid{ grid-template-columns: repeat(2, 1fr); gap: 16px; }
    main.system-requirements .cascade{ padding: 28px 24px; }
    main.system-requirements .sr-cta{ margin: 0 16px; padding: 48px 20px; }
    main.system-requirements .sr-notes{ padding: 28px 24px; }
    main.system-requirements .sr-storage-table th, main.system-requirements .sr-storage-table td{ padding: 12px 16px; font-size: 0.85rem; }
    main.system-requirements .phantom{ width: 70px; }}
    @media (max-width: 480px) {main.system-requirements .sr-recommend-grid{ grid-template-columns: 1fr; }
    main.system-requirements .sr-footer-links{ gap: 16px; }}
    main.system-requirements .drift{
    background: var(--text-color, hsl(244, 10%, 11%));
    padding: 40px 24px 36px;
    margin-top: 80px;
    border-top: 3px solid var(--primary-color, hsl(244, 78%, 57%));
    }
    main.system-requirements .aurora{
    max-width: var(--max-width, 1200px);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    }
    main.system-requirements .briar{
    display: flex;
    align-items: center;
    gap: 10px;
    color: #fff;
    }
    main.system-requirements .inlet{
    flex: 0 0 20px;
    color: var(--primary-color, hsl(244, 78%, 57%));
    }
    main.system-requirements .vortex{
    font-family: Georgia, "Times New Roman", serif;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: #fff;
    flex: 0 0 auto;
    }
    main.system-requirements .cipher{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
    }
    main.system-requirements .prism{
    color: hsl(244, 20%, 72%);
    text-decoration: none;
    font-size: 14px;
    padding: 4px 8px;
    border-radius: var(--radius-sm, 6px);
    transition: var(--transition, all 0.25s ease);
    flex: 0 0 auto;
    }
    main.system-requirements .prism:hover{
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    }
    main.system-requirements .prism:focus-visible{
    outline: 2px solid var(--primary-color, hsl(244, 78%, 57%));
    outline-offset: 2px;
    }
    main.system-requirements .meridian{
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: hsl(244, 15%, 32%);
    flex: 0 0 4px; color: #ffffff;}
    main.system-requirements .glyph{
    color: hsl(244, 10%, 48%);
    font-size: 13px;
    margin: 0;
    text-align: center;
    letter-spacing: 0.01em;
    }
    @media (max-width: 600px) {main.system-requirements .drift{
    padding: 32px 16px 28px;
    margin-top: 56px;
    }
    main.system-requirements .aurora{
    gap: 20px;
    }
    main.system-requirements .cipher{
    gap: 4px;
    }
    main.system-requirements .prism{
    font-size: 13px;
    padding: 4px 6px;
    }
    main.system-requirements .glyph{
    font-size: 12px;
    }}
    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;
}