
    :root {
      --bg:#080b10; --sidebar:#0d1119; --header:#0a0e14;
      --surface:#101722; --surface2:#151f2d; --surface3:#19283d;
      --stroke:#263142; --stroke2:#324157; --text:#e7edf6;
      --muted:#99a8bb; --accent:#91bdff; --chip:#253b57;
      --width:211px; --head-height:72px;
    }
    * { box-sizing:border-box; }
    html,body {margin:0;min-height:100%;height:100%;}
    body {font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans SC","Noto Sans JP",Arial,sans-serif;background:var(--bg);color:var(--text);}
    button,a { -webkit-tap-highlight-color:transparent; }
    button {font:inherit;}
    button:focus-visible,a:focus-visible {outline:2px solid var(--accent);outline-offset:3px;}
    a {color:#a9ceff;text-decoration:none;}
    a:hover {color:#e2f0ff;text-decoration:underline;}
    .layout {display:grid;grid-template-columns:var(--width) minmax(0,1fr);height:100vh;height:100dvh;overflow:hidden;}
    .sidebar {display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--sidebar);border-right:1px solid var(--stroke);}
    .brand {height:var(--head-height);flex:none;padding:0 20px;display:flex;gap:11px;align-items:center;border-bottom:1px solid var(--stroke);}
    .brand-icon {flex:none;width:33px;height:33px;border:1px solid #47617d;background:#1a2e45;border-radius:9px;display:grid;place-items:center;font-size:16px;color:#b5d3ff;font-weight:800;}
    .brand-name {font-size:14px;font-weight:750;line-height:1.25;letter-spacing:-.015em;}
    
    .nav {flex:1;min-height:0;overflow-y:auto;padding:22px 12px 30px;scrollbar-width:thin;scrollbar-color:#3a495d transparent;overscroll-behavior:contain;}
    .nav-group {margin:0 11px 11px;color:#75859b;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;}
    .nav-separator {height:1px;background:var(--stroke);margin:19px 11px 22px;}
    .nav-btn {width:100%;display:flex;align-items:center;gap:10px;padding:12px 13px;border:0;border-radius:9px;background:transparent;color:#d2dce9;font-size:14px;text-align:left;cursor:pointer;min-height:45px;}
    .nav-btn:hover {background:#1a2636;}
    .nav-btn[aria-current="page"] {background:var(--surface3);color:var(--accent);box-shadow:inset 3px 0 0 var(--accent);font-weight:700;}
    .nav-symbol {font-size:15px;flex:none;color:#8da2bd;}
    .nav-btn[aria-current="page"] .nav-symbol {color:var(--accent);}
    .subnav {margin:3px 0 0 15px;padding-left:13px;border-left:1px solid #304054;}
    .subnav-btn {display:block;width:100%;text-align:left;padding:9px 8px;border:0;border-radius:6px;color:#8c9caf;background:transparent;font-size:12px;cursor:pointer;}
    .subnav-btn:hover {color:#d7e8ff;background:#172131;}
    .subnav-btn[aria-current="step"] {color:#a9d0ff;font-weight:750;}
    .side-footer {border-top:1px solid var(--stroke);padding:15px 23px;color:#65768b;letter-spacing:.15em;font-size:10px;font-weight:700;}
    .workspace {min-width:0;min-height:0;display:flex;flex-direction:column;}
    .header {height:var(--head-height);padding:0 clamp(12px,3.4vw,43px);flex:none;display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--header);border-bottom:1px solid var(--stroke);}
    .header-path {font-size:12px;color:#8396af;letter-spacing:.06em;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
    .language-switch {display:flex;gap:4px;flex:none;border:1px solid var(--stroke);border-radius:10px;padding:4px;background:#141c27;}
    .lang-btn {font-size:12px;color:#acbacd;padding:8px 11px;border-radius:7px;min-height:35px;border:0;background:transparent;cursor:pointer;}
    .lang-btn:hover {background:#28394e;color:#fff;}
    .lang-btn[aria-current="true"] {background:#356bb0;color:#fff;}
    .body-scroll {flex:1;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#394a61 transparent;overscroll-behavior:contain;}
    .main {padding:47px clamp(17px,5vw,74px) 65px;max-width:1220px;margin:0 auto;}
    .eyebrow {color:var(--accent);letter-spacing:.17em;text-transform:uppercase;font-size:11px;font-weight:800;margin-bottom:12px;}
    h1 {margin:0 0 13px;font-size:clamp(27px,3.6vw,41px);font-weight:760;line-height:1.18;letter-spacing:-.035em;}
    .lede {margin:0 0 32px;color:var(--muted);font-size:14px;line-height:1.8;max-width:800px;}
    .panel {background:var(--surface);border:1px solid var(--stroke);border-radius:13px;overflow:hidden;}
    .panel-bar {padding:13px 19px;background:var(--surface2);border-bottom:1px solid var(--stroke);font-size:12px;font-weight:750;color:#bbd5f2;letter-spacing:.035em;}
    pre.tree {margin:0;overflow-x:auto;padding:20px 23px;color:#d9e7f6;font-family:"Cascadia Code","SFMono-Regular",Consolas,monospace;line-height:1.85;white-space:pre;font-size:12px;}
    .asset-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
    .asset-card {border:1px solid var(--stroke);border-radius:14px;overflow:hidden;background:#111924;}
    .asset-picture {height:clamp(250px,31vw,420px);position:relative;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 40%,#253246 0%,#0c111a 80%);border-bottom:1px solid var(--stroke);}
    .asset-picture img {width:100%;height:100%;object-fit:contain;display:block;position:absolute;inset:0;z-index:1;}
    .asset-picture.fallback img {display:none;}
    .image-fallback {display:none;text-align:center;color:#93a9c2;line-height:1.8;padding:20px;font-size:13px;}
    .asset-picture.fallback .image-fallback {display:block;}
    .asset-tag {position:absolute;left:13px;top:13px;background:#0e1725d9;border:1px solid #344862;color:#d1dff2;padding:7px 10px;border-radius:6px;font-size:11px;letter-spacing:.11em;font-weight:800;}
    .asset-info {padding:19px 20px 22px;}
    .asset-title {font-size:17px;font-weight:750;margin-bottom:8px;}
    .asset-description {font-size:12px;color:var(--muted);line-height:1.75;min-height:45px;}
    .asset-link {display:inline-flex;align-items:center;margin-top:15px;border:1px solid #40628c;background:#192e48;border-radius:8px;padding:10px 12px;font-size:12px;font-weight:700;}

    .spec-section {margin:22px 0 0;background:#101722;border:1px solid var(--stroke);border-radius:12px;padding:24px clamp(16px,3vw,28px);}
    .spec-title {display:flex;align-items:center;gap:11px;margin:0 0 17px;font-size:18px;font-weight:760;letter-spacing:-.02em;}
    .spec-number {display:inline-flex;align-items:center;justify-content:center;border:1px solid #3a5375;background:#1b2c43;color:#b4d5ff;width:30px;height:30px;flex:none;border-radius:8px;font-size:12px;}
    .spec-section p {color:#bbcadc;font-size:13px;line-height:1.8;margin:10px 0;}
    .clean-list {margin:0;padding:0;list-style:none;display:grid;gap:9px;}
    .clean-list li {border:1px solid #28364a;background:#141e2b;padding:12px 15px;border-radius:8px;font-size:13px;line-height:1.75;color:#c5d2e3;}
    .clean-list strong {color:#eef4fb;}
    .dmg-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
    .dmg-card {border:1px solid #2b3b4f;background:#141f2c;border-radius:10px;padding:15px;min-width:0;}
    .dmg-head {font-size:14px;font-weight:780;color:#e4edfa;margin-bottom:7px;}
    .dmg-card p {margin:0;font-size:12px;line-height:1.75;}
    .bullet-table {width:100%;border-collapse:collapse;font-size:13px;}
    .bullet-table th {text-align:left;font-size:11px;color:#9eb3cb;letter-spacing:.05em;background:#172233;}
    .bullet-table td,.bullet-table th {padding:13px 14px;border-bottom:1px solid #2b3b4e;vertical-align:top;line-height:1.6;}
    .bullet-table tbody tr:last-child td {border-bottom:0;}
    .table-wrap {overflow-x:auto;border:1px solid #2b3b4e;border-radius:9px;}
    .formula {margin-top:15px;padding:18px;background:#0c1521;border:1px solid #2c4463;border-radius:10px;overflow-x:auto;font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;color:#b5d7ff;font-size:13px;line-height:2;}
    .formula small {display:block;font-family:inherit;color:#8ca0b8;margin-top:5px;font-size:11px;line-height:1.7;}

    .option-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
    .option-row {display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:13px 14px;border:1px solid #2b3b4f;border-radius:9px;background:#151f2c;}
    .option-row span:first-child {font-size:13px;font-weight:650;line-height:1.6;}
    .option-row small {font-size:10px;font-weight:800;color:#abcaff;letter-spacing:.06em;border:1px solid #385476;border-radius:5px;padding:3px 6px;white-space:nowrap;}
    .option-detail {color:var(--muted);font-size:12px;line-height:1.7;margin-top:6px;font-weight:400;}
    @media (max-width:850px) {
      .asset-grid {grid-template-columns:1fr;}
      .asset-picture {height:340px;}
      .main {padding-top:33px;}
    }
    @media (max-width:630px) {
      :root {--width:108px;--head-height:63px;}
      .brand {padding:0 9px;gap:6px;}
      .brand-icon {width:24px;height:24px;border-radius:6px;font-size:12px;}
      .brand-name {font-size:11px;overflow-wrap:anywhere;}
      .nav {padding:14px 5px 18px;}
      .nav-group {margin:0 7px 7px;font-size:9px;}
      .nav-btn {padding:10px 8px;font-size:11px;gap:4px;}
      .nav-symbol {font-size:12px;}
      .subnav {margin-left:8px;padding-left:5px;}
      .subnav-btn {font-size:10px;padding:7px 3px;}
      .side-footer {padding:12px;font-size:8px;}
      .header {padding:0 8px;}
      .header-path {display:none;}
      .language-switch {margin-left:auto;padding:2px;gap:1px;}
      .lang-btn {padding:7px 5px;min-height:30px;font-size:10px;}
      .main {padding:24px 13px 45px;}
      h1 {font-size:24px;}
      .lede {font-size:12px;}
      .asset-info {padding:15px;}
      .asset-picture {height:230px;}
      .stat-grid,.dmg-grid,.option-grid {grid-template-columns:1fr;}
      .spec-section {padding:16px 13px;}

      .bullet-table th,.bullet-table td {padding:10px 8px;font-size:11px;}
      pre.tree {padding:13px;font-size:10px;}
    }
  
    /* Static navigation links retain V7 button styling. */
    .nav-btn,.subnav-btn,.lang-btn {text-decoration:none;}
    .nav-btn:hover,.subnav-btn:hover,.lang-btn:hover {text-decoration:none;}
    .nav-btn[aria-current="page"] {pointer-events:none;}
    .subnav-btn[aria-current="page"] {color:#a9d0ff;font-weight:750;}
    .brand {align-items:center;}
    .content-link {display:inline-flex;align-items:center;gap:7px;border-radius:8px;padding:11px 13px;border:1px solid #40628c;background:#192e48;color:#c4ddff;font-size:13px;font-weight:700;}
    @media (prefers-reduced-motion: reduce) { * {scroll-behavior:auto!important;} }
