html[theme=default] {
  --primary-rgb: 36, 48, 39;
  --primary: rgb(36, 48, 39);
  --primary-50: rgb(236.45, 235.15, 227.1);
  --primary-100: rgb(225.9, 225.3, 217.2);
  --primary-150: rgb(215.35, 215.45, 207.3);
  --primary-200: rgb(204.8, 205.6, 197.4);
  --primary-250: rgb(194.25, 195.75, 187.5);
  --primary-300: rgb(183.7, 185.9, 177.6);
  --primary-350: rgb(173.15, 176.05, 167.7);
  --primary-400: rgb(162.6, 166.2, 157.8);
  --primary-450: rgb(152.05, 156.35, 147.9);
  --primary-500: rgb(141.5, 146.5, 138);
  --primary-550: rgb(130.95, 136.65, 128.1);
  --primary-600: rgb(120.4, 126.8, 118.2);
  --primary-650: rgb(109.85, 116.95, 108.3);
  --primary-700: rgb(99.3, 107.1, 98.4);
  --primary-750: rgb(88.75, 97.25, 88.5);
  --primary-800: rgb(78.2, 87.4, 78.6);
  --primary-850: rgb(67.65, 77.55, 68.7);
  --primary-900: rgb(57.1, 67.7, 58.8);
  --primary-950: rgb(46.55, 57.85, 48.9);
  --primary-high: rgb(57.1, 67.7, 58.8);
  --primary-midium: rgb(99.3, 107.1, 98.4);
  --primary-low-mid: rgb(141.5, 146.5, 138);
  --primary-low: rgb(204.8, 205.6, 197.4);
  --primary-very-low: rgb(246.8945, 244.9015, 236.901);
  --secondary-rgb: 247, 245, 237;
  --secondary: rgb(247, 245, 237);
  --secondary-50: rgb(46.55, 57.85, 48.9);
  --secondary-100: rgb(57.1, 67.7, 58.8);
  --secondary-150: rgb(67.65, 77.55, 68.7);
  --secondary-200: rgb(78.2, 87.4, 78.6);
  --secondary-250: rgb(88.75, 97.25, 88.5);
  --secondary-300: rgb(99.3, 107.1, 98.4);
  --secondary-350: rgb(109.85, 116.95, 108.3);
  --secondary-400: rgb(120.4, 126.8, 118.2);
  --secondary-450: rgb(130.95, 136.65, 128.1);
  --secondary-500: rgb(141.5, 146.5, 138);
  --secondary-550: rgb(152.05, 156.35, 147.9);
  --secondary-600: rgb(162.6, 166.2, 157.8);
  --secondary-650: rgb(173.15, 176.05, 167.7);
  --secondary-700: rgb(183.7, 185.9, 177.6);
  --secondary-750: rgb(194.25, 195.75, 187.5);
  --secondary-800: rgb(204.8, 205.6, 197.4);
  --secondary-850: rgb(215.35, 215.45, 207.3);
  --secondary-900: rgb(225.9, 225.3, 217.2);
  --secondary-950: rgb(236.45, 235.15, 227.1);
  --secondary-high: rgb(225.9, 225.3, 217.2);
  --secondary-midium: rgb(183.7, 185.9, 177.6);
  --secondary-low-mid: rgb(141.5, 146.5, 138);
  --secondary-low: rgb(78.2, 87.4, 78.6);
  --secondary-very-low: rgb(36.1055, 48.0985, 39.099);
  --tertiary-rgb: 111, 141, 114;
  --tertiary: rgb(111, 141, 114);
  --tertiary-50: rgb(240.2, 239.8, 230.85);
  --tertiary-100: rgb(233.4, 234.6, 224.7);
  --tertiary-150: rgb(226.6, 229.4, 218.55);
  --tertiary-200: rgb(219.8, 224.2, 212.4);
  --tertiary-250: rgb(213, 219, 206.25);
  --tertiary-300: rgb(206.2, 213.8, 200.1);
  --tertiary-350: rgb(199.4, 208.6, 193.95);
  --tertiary-400: rgb(192.6, 203.4, 187.8);
  --tertiary-450: rgb(185.8, 198.2, 181.65);
  --tertiary-500: rgb(179, 193, 175.5);
  --tertiary-550: rgb(172.2, 187.8, 169.35);
  --tertiary-600: rgb(165.4, 182.6, 163.2);
  --tertiary-650: rgb(158.6, 177.4, 157.05);
  --tertiary-700: rgb(151.8, 172.2, 150.9);
  --tertiary-750: rgb(145, 167, 144.75);
  --tertiary-800: rgb(138.2, 161.8, 138.6);
  --tertiary-850: rgb(131.4, 156.6, 132.45);
  --tertiary-900: rgb(124.6, 151.4, 126.3);
  --tertiary-950: rgb(117.8, 146.2, 120.15);
  --tertiary-high: rgb(124.6, 151.4, 126.3);
  --tertiary-midium: rgb(151.8, 172.2, 150.9);
  --tertiary-low-mid: rgb(179, 193, 175.5);
  --tertiary-low: rgb(219.8, 224.2, 212.4);
  --tertiary-very-low: rgb(246.932, 244.948, 236.9385);
  --surface: #e8efe4;
  --surface-soft: #dbe7d5;
  --border-subtle: #bac8b5;
  --border-strong: #405447;
  --text-strong: #243027;
  --text-main: #36443a;
  --text-muted: #667369;
  --accent: #6f8d72;
  --accent-soft: rgba(111, 141, 114, 0.14);
  --accent-contrast: #fffdf5;
  --verdigris: #55705c;
  --paper: #f7f5ed;
  --paper-deep: #eef1e8;
  --label: #68766c;
  --logo-filter: none;
  --sidebar-glass: rgba(240, 244, 236, 0.46);
  --content-glass: rgba(247, 245, 237, 0.08);
  --panel-glass: rgba(255, 253, 247, 0.48);
  --panel-shadow: rgba(52, 67, 57, 0.16);
  --glass-border: rgba(255, 255, 255, 0.4);
  --glass-highlight: rgba(255, 255, 255, 0.32);
}

@media (prefers-color-scheme: dark) {
  html[theme=default] {
    --primary-rgb: 226, 234, 224;
    --primary: rgb(226, 234, 224);
    --primary-50: rgb(33.15, 39.25, 34.95);
    --primary-100: rgb(43.3, 49.5, 44.9);
    --primary-150: rgb(53.45, 59.75, 54.85);
    --primary-200: rgb(63.6, 70, 64.8);
    --primary-250: rgb(73.75, 80.25, 74.75);
    --primary-300: rgb(83.9, 90.5, 84.7);
    --primary-350: rgb(94.05, 100.75, 94.65);
    --primary-400: rgb(104.2, 111, 104.6);
    --primary-450: rgb(114.35, 121.25, 114.55);
    --primary-500: rgb(124.5, 131.5, 124.5);
    --primary-550: rgb(134.65, 141.75, 134.45);
    --primary-600: rgb(144.8, 152, 144.4);
    --primary-650: rgb(154.95, 162.25, 154.35);
    --primary-700: rgb(165.1, 172.5, 164.3);
    --primary-750: rgb(175.25, 182.75, 174.25);
    --primary-800: rgb(185.4, 193, 184.2);
    --primary-850: rgb(195.55, 203.25, 194.15);
    --primary-900: rgb(205.7, 213.5, 204.1);
    --primary-950: rgb(215.85, 223.75, 214.05);
    --primary-high: rgb(205.7, 213.5, 204.1);
    --primary-midium: rgb(165.1, 172.5, 164.3);
    --primary-low-mid: rgb(124.5, 131.5, 124.5);
    --primary-low: rgb(63.6, 70, 64.8);
    --primary-very-low: rgb(23.1015, 29.1025, 25.0995);
    --secondary-rgb: 23, 29, 25;
    --secondary: rgb(23, 29, 25);
    --secondary-50: rgb(215.85, 223.75, 214.05);
    --secondary-100: rgb(205.7, 213.5, 204.1);
    --secondary-150: rgb(195.55, 203.25, 194.15);
    --secondary-200: rgb(185.4, 193, 184.2);
    --secondary-250: rgb(175.25, 182.75, 174.25);
    --secondary-300: rgb(165.1, 172.5, 164.3);
    --secondary-350: rgb(154.95, 162.25, 154.35);
    --secondary-400: rgb(144.8, 152, 144.4);
    --secondary-450: rgb(134.65, 141.75, 134.45);
    --secondary-500: rgb(124.5, 131.5, 124.5);
    --secondary-550: rgb(114.35, 121.25, 114.55);
    --secondary-600: rgb(104.2, 111, 104.6);
    --secondary-650: rgb(94.05, 100.75, 94.65);
    --secondary-700: rgb(83.9, 90.5, 84.7);
    --secondary-750: rgb(73.75, 80.25, 74.75);
    --secondary-800: rgb(63.6, 70, 64.8);
    --secondary-850: rgb(53.45, 59.75, 54.85);
    --secondary-900: rgb(43.3, 49.5, 44.9);
    --secondary-950: rgb(33.15, 39.25, 34.95);
    --secondary-high: rgb(43.3, 49.5, 44.9);
    --secondary-midium: rgb(83.9, 90.5, 84.7);
    --secondary-low-mid: rgb(124.5, 131.5, 124.5);
    --secondary-low: rgb(185.4, 193, 184.2);
    --secondary-very-low: rgb(225.8985, 233.8975, 223.9005);
    --tertiary-rgb: 155, 189, 157;
    --tertiary: rgb(155, 189, 157);
    --tertiary-50: rgb(29.6, 37, 31.6);
    --tertiary-100: rgb(36.2, 45, 38.2);
    --tertiary-150: rgb(42.8, 53, 44.8);
    --tertiary-200: rgb(49.4, 61, 51.4);
    --tertiary-250: #38453a;
    --tertiary-300: rgb(62.6, 77, 64.6);
    --tertiary-350: rgb(69.2, 85, 71.2);
    --tertiary-400: rgb(75.8, 93, 77.8);
    --tertiary-450: rgb(82.4, 101, 84.4);
    --tertiary-500: #596d5b;
    --tertiary-550: rgb(95.6, 117, 97.6);
    --tertiary-600: rgb(102.2, 125, 104.2);
    --tertiary-650: rgb(108.8, 133, 110.8);
    --tertiary-700: rgb(115.4, 141, 117.4);
    --tertiary-750: #7a957c;
    --tertiary-800: rgb(128.6, 157, 130.6);
    --tertiary-850: rgb(135.2, 165, 137.2);
    --tertiary-900: rgb(141.8, 173, 143.8);
    --tertiary-950: rgb(148.4, 181, 150.4);
    --tertiary-high: rgb(141.8, 173, 143.8);
    --tertiary-midium: rgb(115.4, 141, 117.4);
    --tertiary-low-mid: #596d5b;
    --tertiary-low: rgb(49.4, 61, 51.4);
    --tertiary-very-low: rgb(23.066, 29.08, 25.066);
    --surface: #202a23;
    --surface-soft: #2b372e;
    --border-subtle: #526257;
    --border-strong: #dce8db;
    --text-strong: #edf3eb;
    --text-main: #cbd7c9;
    --text-muted: #94a393;
    --accent: #9bbd9d;
    --accent-soft: rgba(155, 189, 157, 0.17);
    --accent-contrast: #172019;
    --verdigris: #86a78b;
    --paper: #171d19;
    --paper-deep: #202823;
    --label: #9caa9c;
    --logo-filter: none;
    --sidebar-glass: rgba(32, 42, 35, 0.48);
    --content-glass: rgba(23, 29, 25, 0.1);
    --panel-glass: rgba(36, 44, 39, 0.44);
    --panel-shadow: rgba(0, 0, 0, 0.3);
    --glass-border: rgba(220, 232, 219, 0.2);
    --glass-highlight: rgba(255, 255, 255, 0.05);
  }
}
html[theme=dark] {
  --primary-rgb: 226, 234, 224;
  --primary: rgb(226, 234, 224);
  --primary-50: rgb(33.15, 39.25, 34.95);
  --primary-100: rgb(43.3, 49.5, 44.9);
  --primary-150: rgb(53.45, 59.75, 54.85);
  --primary-200: rgb(63.6, 70, 64.8);
  --primary-250: rgb(73.75, 80.25, 74.75);
  --primary-300: rgb(83.9, 90.5, 84.7);
  --primary-350: rgb(94.05, 100.75, 94.65);
  --primary-400: rgb(104.2, 111, 104.6);
  --primary-450: rgb(114.35, 121.25, 114.55);
  --primary-500: rgb(124.5, 131.5, 124.5);
  --primary-550: rgb(134.65, 141.75, 134.45);
  --primary-600: rgb(144.8, 152, 144.4);
  --primary-650: rgb(154.95, 162.25, 154.35);
  --primary-700: rgb(165.1, 172.5, 164.3);
  --primary-750: rgb(175.25, 182.75, 174.25);
  --primary-800: rgb(185.4, 193, 184.2);
  --primary-850: rgb(195.55, 203.25, 194.15);
  --primary-900: rgb(205.7, 213.5, 204.1);
  --primary-950: rgb(215.85, 223.75, 214.05);
  --primary-high: rgb(205.7, 213.5, 204.1);
  --primary-midium: rgb(165.1, 172.5, 164.3);
  --primary-low-mid: rgb(124.5, 131.5, 124.5);
  --primary-low: rgb(63.6, 70, 64.8);
  --primary-very-low: rgb(23.1015, 29.1025, 25.0995);
  --secondary-rgb: 23, 29, 25;
  --secondary: rgb(23, 29, 25);
  --secondary-50: rgb(215.85, 223.75, 214.05);
  --secondary-100: rgb(205.7, 213.5, 204.1);
  --secondary-150: rgb(195.55, 203.25, 194.15);
  --secondary-200: rgb(185.4, 193, 184.2);
  --secondary-250: rgb(175.25, 182.75, 174.25);
  --secondary-300: rgb(165.1, 172.5, 164.3);
  --secondary-350: rgb(154.95, 162.25, 154.35);
  --secondary-400: rgb(144.8, 152, 144.4);
  --secondary-450: rgb(134.65, 141.75, 134.45);
  --secondary-500: rgb(124.5, 131.5, 124.5);
  --secondary-550: rgb(114.35, 121.25, 114.55);
  --secondary-600: rgb(104.2, 111, 104.6);
  --secondary-650: rgb(94.05, 100.75, 94.65);
  --secondary-700: rgb(83.9, 90.5, 84.7);
  --secondary-750: rgb(73.75, 80.25, 74.75);
  --secondary-800: rgb(63.6, 70, 64.8);
  --secondary-850: rgb(53.45, 59.75, 54.85);
  --secondary-900: rgb(43.3, 49.5, 44.9);
  --secondary-950: rgb(33.15, 39.25, 34.95);
  --secondary-high: rgb(43.3, 49.5, 44.9);
  --secondary-midium: rgb(83.9, 90.5, 84.7);
  --secondary-low-mid: rgb(124.5, 131.5, 124.5);
  --secondary-low: rgb(185.4, 193, 184.2);
  --secondary-very-low: rgb(225.8985, 233.8975, 223.9005);
  --tertiary-rgb: 155, 189, 157;
  --tertiary: rgb(155, 189, 157);
  --tertiary-50: rgb(29.6, 37, 31.6);
  --tertiary-100: rgb(36.2, 45, 38.2);
  --tertiary-150: rgb(42.8, 53, 44.8);
  --tertiary-200: rgb(49.4, 61, 51.4);
  --tertiary-250: #38453a;
  --tertiary-300: rgb(62.6, 77, 64.6);
  --tertiary-350: rgb(69.2, 85, 71.2);
  --tertiary-400: rgb(75.8, 93, 77.8);
  --tertiary-450: rgb(82.4, 101, 84.4);
  --tertiary-500: #596d5b;
  --tertiary-550: rgb(95.6, 117, 97.6);
  --tertiary-600: rgb(102.2, 125, 104.2);
  --tertiary-650: rgb(108.8, 133, 110.8);
  --tertiary-700: rgb(115.4, 141, 117.4);
  --tertiary-750: #7a957c;
  --tertiary-800: rgb(128.6, 157, 130.6);
  --tertiary-850: rgb(135.2, 165, 137.2);
  --tertiary-900: rgb(141.8, 173, 143.8);
  --tertiary-950: rgb(148.4, 181, 150.4);
  --tertiary-high: rgb(141.8, 173, 143.8);
  --tertiary-midium: rgb(115.4, 141, 117.4);
  --tertiary-low-mid: #596d5b;
  --tertiary-low: rgb(49.4, 61, 51.4);
  --tertiary-very-low: rgb(23.066, 29.08, 25.066);
  --surface: #202a23;
  --surface-soft: #2b372e;
  --border-subtle: #526257;
  --border-strong: #dce8db;
  --text-strong: #edf3eb;
  --text-main: #cbd7c9;
  --text-muted: #94a393;
  --accent: #9bbd9d;
  --accent-soft: rgba(155, 189, 157, 0.17);
  --accent-contrast: #172019;
  --verdigris: #86a78b;
  --paper: #171d19;
  --paper-deep: #202823;
  --label: #9caa9c;
  --logo-filter: none;
  --sidebar-glass: rgba(32, 42, 35, 0.48);
  --content-glass: rgba(23, 29, 25, 0.1);
  --panel-glass: rgba(36, 44, 39, 0.44);
  --panel-shadow: rgba(0, 0, 0, 0.3);
  --glass-border: rgba(220, 232, 219, 0.2);
  --glass-highlight: rgba(255, 255, 255, 0.05);
}

html[theme=light] {
  --primary-rgb: 36, 48, 39;
  --primary: rgb(36, 48, 39);
  --primary-50: rgb(236.45, 235.15, 227.1);
  --primary-100: rgb(225.9, 225.3, 217.2);
  --primary-150: rgb(215.35, 215.45, 207.3);
  --primary-200: rgb(204.8, 205.6, 197.4);
  --primary-250: rgb(194.25, 195.75, 187.5);
  --primary-300: rgb(183.7, 185.9, 177.6);
  --primary-350: rgb(173.15, 176.05, 167.7);
  --primary-400: rgb(162.6, 166.2, 157.8);
  --primary-450: rgb(152.05, 156.35, 147.9);
  --primary-500: rgb(141.5, 146.5, 138);
  --primary-550: rgb(130.95, 136.65, 128.1);
  --primary-600: rgb(120.4, 126.8, 118.2);
  --primary-650: rgb(109.85, 116.95, 108.3);
  --primary-700: rgb(99.3, 107.1, 98.4);
  --primary-750: rgb(88.75, 97.25, 88.5);
  --primary-800: rgb(78.2, 87.4, 78.6);
  --primary-850: rgb(67.65, 77.55, 68.7);
  --primary-900: rgb(57.1, 67.7, 58.8);
  --primary-950: rgb(46.55, 57.85, 48.9);
  --primary-high: rgb(57.1, 67.7, 58.8);
  --primary-midium: rgb(99.3, 107.1, 98.4);
  --primary-low-mid: rgb(141.5, 146.5, 138);
  --primary-low: rgb(204.8, 205.6, 197.4);
  --primary-very-low: rgb(246.8945, 244.9015, 236.901);
  --secondary-rgb: 247, 245, 237;
  --secondary: rgb(247, 245, 237);
  --secondary-50: rgb(46.55, 57.85, 48.9);
  --secondary-100: rgb(57.1, 67.7, 58.8);
  --secondary-150: rgb(67.65, 77.55, 68.7);
  --secondary-200: rgb(78.2, 87.4, 78.6);
  --secondary-250: rgb(88.75, 97.25, 88.5);
  --secondary-300: rgb(99.3, 107.1, 98.4);
  --secondary-350: rgb(109.85, 116.95, 108.3);
  --secondary-400: rgb(120.4, 126.8, 118.2);
  --secondary-450: rgb(130.95, 136.65, 128.1);
  --secondary-500: rgb(141.5, 146.5, 138);
  --secondary-550: rgb(152.05, 156.35, 147.9);
  --secondary-600: rgb(162.6, 166.2, 157.8);
  --secondary-650: rgb(173.15, 176.05, 167.7);
  --secondary-700: rgb(183.7, 185.9, 177.6);
  --secondary-750: rgb(194.25, 195.75, 187.5);
  --secondary-800: rgb(204.8, 205.6, 197.4);
  --secondary-850: rgb(215.35, 215.45, 207.3);
  --secondary-900: rgb(225.9, 225.3, 217.2);
  --secondary-950: rgb(236.45, 235.15, 227.1);
  --secondary-high: rgb(225.9, 225.3, 217.2);
  --secondary-midium: rgb(183.7, 185.9, 177.6);
  --secondary-low-mid: rgb(141.5, 146.5, 138);
  --secondary-low: rgb(78.2, 87.4, 78.6);
  --secondary-very-low: rgb(36.1055, 48.0985, 39.099);
  --tertiary-rgb: 111, 141, 114;
  --tertiary: rgb(111, 141, 114);
  --tertiary-50: rgb(240.2, 239.8, 230.85);
  --tertiary-100: rgb(233.4, 234.6, 224.7);
  --tertiary-150: rgb(226.6, 229.4, 218.55);
  --tertiary-200: rgb(219.8, 224.2, 212.4);
  --tertiary-250: rgb(213, 219, 206.25);
  --tertiary-300: rgb(206.2, 213.8, 200.1);
  --tertiary-350: rgb(199.4, 208.6, 193.95);
  --tertiary-400: rgb(192.6, 203.4, 187.8);
  --tertiary-450: rgb(185.8, 198.2, 181.65);
  --tertiary-500: rgb(179, 193, 175.5);
  --tertiary-550: rgb(172.2, 187.8, 169.35);
  --tertiary-600: rgb(165.4, 182.6, 163.2);
  --tertiary-650: rgb(158.6, 177.4, 157.05);
  --tertiary-700: rgb(151.8, 172.2, 150.9);
  --tertiary-750: rgb(145, 167, 144.75);
  --tertiary-800: rgb(138.2, 161.8, 138.6);
  --tertiary-850: rgb(131.4, 156.6, 132.45);
  --tertiary-900: rgb(124.6, 151.4, 126.3);
  --tertiary-950: rgb(117.8, 146.2, 120.15);
  --tertiary-high: rgb(124.6, 151.4, 126.3);
  --tertiary-midium: rgb(151.8, 172.2, 150.9);
  --tertiary-low-mid: rgb(179, 193, 175.5);
  --tertiary-low: rgb(219.8, 224.2, 212.4);
  --tertiary-very-low: rgb(246.932, 244.948, 236.9385);
  --surface: #e8efe4;
  --surface-soft: #dbe7d5;
  --border-subtle: #bac8b5;
  --border-strong: #405447;
  --text-strong: #243027;
  --text-main: #36443a;
  --text-muted: #667369;
  --accent: #6f8d72;
  --accent-soft: rgba(111, 141, 114, 0.14);
  --accent-contrast: #fffdf5;
  --verdigris: #55705c;
  --paper: #f7f5ed;
  --paper-deep: #eef1e8;
  --label: #68766c;
  --logo-filter: none;
  --sidebar-glass: rgba(240, 244, 236, 0.46);
  --content-glass: rgba(247, 245, 237, 0.08);
  --panel-glass: rgba(255, 253, 247, 0.48);
  --panel-shadow: rgba(52, 67, 57, 0.16);
  --glass-border: rgba(255, 255, 255, 0.4);
  --glass-highlight: rgba(255, 255, 255, 0.32);
}
@charset "UTF-8";
:root {
  --mono-font-face: 'mononoki', 'Consolas', 'Roboto Mono', 'Lucida Console', 'Trebuchet MS', 'Courier New', 'courier',
    monospace;
  --reading-font: 'Iowan Old Style', 'Palatino Linotype', Palatino, 'Songti SC', 'Noto Serif CJK SC', Georgia, serif;
  --ui-font: 'Inter', 'Helvetica Neue', Helvetica, Arial, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  --reading-measure: 38rem;
}

.content > .post > .post-content > p {
  overflow-wrap: anywhere;
  word-break: break-word;
}

#ds-thread,
#disqus_thread,
#cloud-tie-wrapper {
  margin: 0 30px !important;
}

html {
  -webkit-font-smoothing: antialiased;
  height: 100%;
  max-height: 100%;
  padding: 0;
  margin: 0;
}

body {
  padding: 0;
  margin: 0;
  line-height: 1.7;
  color: var(--text-main);
  font-family: var(--ui-font);
  font-size: 16px;
  width: 100%;
  margin: 0 auto 30px auto;
  background: radial-gradient(circle at 70% 0%, rgba(88, 166, 255, 0.06), transparent 34%), var(--secondary);
  transition: background-color 0.8s, color 0.8s;
}

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  text-rendering: optimizeLegibility;
  line-height: 1;
  margin: 2rem 0;
}

h1 {
  font-size: 2.1rem;
  line-height: 1.2em;
}

h2 {
  font-size: 1.9rem;
  line-height: 1.2em;
}

h3 {
  font-size: 1.75rem;
}

h4 {
  font-size: 1.3rem;
}

h5 {
  font-size: 1.2rem;
}

h6 {
  font-size: 1.1rem;
}

img {
  max-width: 100%;
  height: auto;
}

p,
ul,
ol,
dl {
  margin: 1em 0;
}

ol ol,
ul ul,
ul ol,
ol ul {
  margin: 0.4em 0;
}

ol.toclist-child {
  padding-inline-start: 15px;
}

ul p,
ol p,
li p,
.content li p,
blockquote p,
.content blockquote p,
.post blockquote p,
.post li p {
  margin: 0;
  overflow: visible;
}

a img {
  border: none;
}

p {
  line-height: 1.85;
  font-weight: 400;
  font-size: 16px;
}

a {
  text-decoration: none;
}

a:link,
a:visited {
  opacity: 1;
  -webkit-transition: all 0.15s linear;
  -moz-transition: all 0.15s linear;
  -o-transition: all 0.15s linear;
  -ms-transition: all 0.15s linear;
  transition: all 0.15s linear;
  color: var(--accent);
}

a:hover,
a:active {
  color: var(--text-strong);
}

dl dt {
  float: left;
  width: 180px;
  overflow: hidden;
  clear: left;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: bold;
  margin-bottom: 1em;
}
dl dd {
  margin-left: 200px;
  margin-bottom: 1em;
}

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid var(--primary-100);
  margin: 3.2em 0;
  padding: 0;
}

blockquote {
  box-sizing: border-box;
  margin: 1.6em 0 1.6em 0em;
  padding: 0 0 0 1.6em;
  border-left: #f66 0.3em solid;
  background-color: cssrgba(var(--primary-rgb), 0.03);
}
blockquote p {
  margin: 0.8em 0;
  padding: 1em 0;
}
blockquote small {
  display: inline-block;
  margin: 0.8em 0 0.8em 1.5em;
  font-size: 0.9em;
  color: #ccc;
}
blockquote small:before {
  content: "— ";
}
blockquote cite {
  font-weight: bold;
}
blockquote cite a {
  font-weight: normal;
}

mark {
  background-color: #ffc336;
}

code,
tt {
  padding: 1px 3px;
  font-family: var(--mono-font-face);
  white-space: pre-wrap;
  background-color: var(--secondary-950);
  transition: background-color 0.8s, border 0.8s;
  color: var(--primary-700);
  border-radius: 3px;
}

pre {
  font-size: 15px;
  background-color: var(--secondary-950) !important;
  font-family: var(--mono-font-face) !important;
  color: var(--primary-700) !important;
}

kbd {
  display: inline-block;
  margin-bottom: 0.4em;
  padding: 1px 8px;
  border: var(--primary-200) 1px solid;
  color: var(--primary-700);
  font-size: 0.9em;
  font-weight: bold;
  background: var(--primary-50);
  border-radius: 4px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2), 0 1px 0 0 white inset;
}

table {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 1em 0;
  width: 100%;
  max-width: 100%;
  border-width: 1px;
  border-style: solid;
  background-color: transparent;
}

table,
table tr,
table tr td,
table tr th {
  border-color: transparent;
}

table th {
  color: var(--primary-700);
  background-color: rgba(63, 185, 237, 0.15);
}

tr th {
  border-bottom-width: 1px;
  border-bottom-style: solid;
}

tr th,
tr td {
  padding: 5px 20px;
  border-right: 1px solid;
  font-size: 1rem;
}

tr th:last-child,
tr td:last-child {
  border-right: 0px;
}

table th {
  font-weight: bold;
}

table tbody > tr:nth-child(odd) > td,
table tbody > tr:nth-child(odd) > th {
  background-color: var(--secondary-950);
}

.gist {
  font-size: 12px;
}
.gist table {
  margin: 0;
  width: auto;
}
.gist table pre {
  font-size: 12px;
}
.gist table .line-numbers {
  font-size: 12px;
}

.katex .katex-html {
  display: none;
}
@charset "UTF-8";
figure.highlight {
  position: relative !important;
  margin: 1em 0 !important;
  border-radius: 2px !important;
  line-height: 1.1em !important;
  background-color: var(--secondary-950) !important;
  overflow-x: auto !important;
  padding-left: 1em;
}
figure.highlight table,
figure.highlight tr,
figure.highlight td {
  width: 100% !important;
  border-collapse: collapse !important;
  padding: 0 !important;
  margin: 0 !important;
}
figure.highlight .gutter {
  width: fit-content !important;
  line-height: 1.5em !important;
  font-size: 15px;
  padding: 0em 1em 0em 0em !important;
  user-select: none;
}
figure.highlight .gutter pre {
  color: rgb(212, 148, 75) !important;
}
body.disable-line-number figure.highlight .gutter {
  display: none;
}
figure.highlight .code pre {
  padding: 1.2em 1em 1.2em 0 !important;
  line-height: 1.5em !important;
  margin: 0 !important;
}
figure.highlight .code:after {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  color: #ccc !important;
  text-align: right !important;
  font-size: 0.75em !important;
  padding: 5px 10px 0 !important;
  line-height: 15px !important;
  height: 15px !important;
  font-weight: 600 !important;
}
figure.highlight.sap-abap .code:after, figure.highlight.abap .code:after {
  content: "ABAP";
}
figure.highlight.abnf .code:after {
  content: "ABNF";
}
figure.highlight.accesslog .code:after {
  content: "Access logs";
}
figure.highlight.ada .code:after {
  content: "Ada";
}
figure.highlight.apex .code:after {
  content: "Apex";
}
figure.highlight.arduino .code:after, figure.highlight.ino .code:after {
  content: "Arduino( C++ w/Arduino libs)";
}
figure.highlight.armasm .code:after, figure.highlight.arm .code:after {
  content: "ARM assembler";
}
figure.highlight.avrasm .code:after {
  content: "AVR assembler";
}
figure.highlight.actionscript .code:after, figure.highlight.as .code:after {
  content: "ActionScript";
}
figure.highlight.alan .code:after, figure.highlight.i .code:after {
  content: "Alan IF";
}
figure.highlight.ln .code:after {
  content: "Alan";
}
figure.highlight.angelscript .code:after, figure.highlight.asc .code:after {
  content: "AngelScript";
}
figure.highlight.apache .code:after, figure.highlight.apacheconf .code:after {
  content: "Apache";
}
figure.highlight.applescript .code:after, figure.highlight.osascript .code:after {
  content: "AppleScript";
}
figure.highlight.arcade .code:after {
  content: "Arcade";
}
figure.highlight.asciidoc .code:after, figure.highlight.adoc .code:after {
  content: "AsciiDoc";
}
figure.highlight.aspectj .code:after {
  content: "AspectJ";
}
figure.highlight.autohotkey .code:after {
  content: "AutoHotkey";
}
figure.highlight.autoit .code:after {
  content: "AutoIt";
}
figure.highlight.awk .code:after, figure.highlight.mawk .code:after, figure.highlight.nawk .code:after, figure.highlight.gawk .code:after {
  content: "Awk";
}
figure.highlight.ballerina .code:after, figure.highlight.bal .code:after {
  content: "Ballerina";
}
figure.highlight.bash .code:after, figure.highlight.sh .code:after, figure.highlight.zsh .code:after {
  content: "Bash";
}
figure.highlight.basic .code:after {
  content: "Basic";
}
figure.highlight.bbcode .code:after {
  content: "BBCode";
}
figure.highlight.blade .code:after {
  content: "Blade( Laravel)";
}
figure.highlight.bnf .code:after {
  content: "BNF";
}
figure.highlight.bqn .code:after {
  content: "BQN";
}
figure.highlight.brainfuck .code:after, figure.highlight.bf .code:after {
  content: "Brainfuck";
}
figure.highlight.csharp .code:after, figure.highlight.cs .code:after {
  content: "C#";
}
figure.highlight.c .code:after, figure.highlight.h .code:after {
  content: "C";
}
figure.highlight.cpp .code:after, figure.highlight.hpp .code:after, figure.highlight.cc .code:after, figure.highlight.hh .code:after, figure.highlight.cxx .code:after, figure.highlight.hxx .code:after, figure.highlight.c\\\+\\\+ .code:after, figure.highlight.h\\\+\\\+ .code:after {
  content: "C++";
}
figure.highlight.cal .code:after {
  content: "C/AL";
}
figure.highlight.c3 .code:after {
  content: "C3";
}
figure.highlight.cos .code:after, figure.highlight.cls .code:after {
  content: "Cache Object Script";
}
figure.highlight.candid .code:after, figure.highlight.did .code:after {
  content: "Candid";
}
figure.highlight.cmake .code:after {
  content: "CMake";
}
figure.highlight.cobol .code:after, figure.highlight.standard-cobol .code:after {
  content: "COBOL";
}
figure.highlight.codeowners .code:after {
  content: "CODEOWNERS";
}
figure.highlight.coq .code:after {
  content: "Coq";
}
figure.highlight.csp .code:after {
  content: "CSP";
}
figure.highlight.css .code:after {
  content: "CSS";
}
figure.highlight.capnproto .code:after, figure.highlight.capnp .code:after {
  content: "Cap’n Proto";
}
figure.highlight.chaos .code:after, figure.highlight.kaos .code:after {
  content: "Chaos";
}
figure.highlight.chapel .code:after, figure.highlight.chpl .code:after {
  content: "Chapel";
}
figure.highlight.cisco .code:after {
  content: "Cisco CLI";
}
figure.highlight.clojure .code:after, figure.highlight.clj .code:after {
  content: "Clojure";
}
figure.highlight.coffeescript .code:after, figure.highlight.coffee .code:after, figure.highlight.cson .code:after, figure.highlight.iced .code:after {
  content: "CoffeeScript";
}
figure.highlight.cpc .code:after {
  content: "CpcdosC+";
}
figure.highlight.crmsh .code:after, figure.highlight.crm .code:after, figure.highlight.pcmk .code:after {
  content: "Crmsh";
}
figure.highlight.crystal .code:after, figure.highlight.cr .code:after {
  content: "Crystal";
}
figure.highlight.curl .code:after {
  content: "cURL";
}
figure.highlight.cypher .code:after {
  content: "Cypher( Neo4j)";
}
figure.highlight.d .code:after {
  content: "D";
}
figure.highlight.dafny .code:after {
  content: "Dafny";
}
figure.highlight.dart .code:after {
  content: "Dart";
}
figure.highlight.dpr .code:after, figure.highlight.dfm .code:after, figure.highlight.pas .code:after, figure.highlight.pascal .code:after {
  content: "Delphi";
}
figure.highlight.diff .code:after, figure.highlight.patch .code:after {
  content: "Diff";
}
figure.highlight.django .code:after, figure.highlight.jinja .code:after {
  content: "Django";
}
figure.highlight.dns .code:after, figure.highlight.zone .code:after, figure.highlight.bind .code:after {
  content: "DNS Zone file";
}
figure.highlight.dockerfile .code:after, figure.highlight.docker .code:after {
  content: "Dockerfile";
}
figure.highlight.dos .code:after, figure.highlight.bat .code:after, figure.highlight.cmd .code:after {
  content: "DOS";
}
figure.highlight.dsconfig .code:after {
  content: "dsconfig";
}
figure.highlight.dts .code:after {
  content: "DTS( Device Tree)";
}
figure.highlight.dust .code:after, figure.highlight.dst .code:after {
  content: "Dust";
}
figure.highlight.dylan .code:after {
  content: "Dylan";
}
figure.highlight.ebnf .code:after {
  content: "EBNF";
}
figure.highlight.elixir .code:after {
  content: "Elixir";
}
figure.highlight.elm .code:after {
  content: "Elm";
}
figure.highlight.erlang .code:after, figure.highlight.erl .code:after {
  content: "Erlang";
}
figure.highlight.excel .code:after, figure.highlight.xls .code:after, figure.highlight.xlsx .code:after {
  content: "Excel";
}
figure.highlight.extempore .code:after, figure.highlight.xtlang .code:after, figure.highlight.xtm .code:after {
  content: "Extempore";
}
figure.highlight.fsharp .code:after, figure.highlight.fs .code:after, figure.highlight.fsx .code:after, figure.highlight.fsi .code:after, figure.highlight.fsscript .code:after {
  content: "F#";
}
figure.highlight.fix .code:after {
  content: "FIX";
}
figure.highlight.flix .code:after {
  content: "Flix";
}
figure.highlight.fortran .code:after, figure.highlight.f90 .code:after, figure.highlight.f95 .code:after {
  content: "Fortran";
}
figure.highlight.func .code:after {
  content: "FunC";
}
figure.highlight.gcode .code:after, figure.highlight.nc .code:after {
  content: "G-Code";
}
figure.highlight.gams .code:after, figure.highlight.gms .code:after {
  content: "Gams";
}
figure.highlight.gauss .code:after, figure.highlight.gss .code:after {
  content: "GAUSS";
}
figure.highlight.godot .code:after, figure.highlight.gdscript .code:after {
  content: "GDScript";
}
figure.highlight.gherkin .code:after {
  content: "Gherkin";
}
figure.highlight.hbs .code:after, figure.highlight.glimmer .code:after, figure.highlight.htmlbars .code:after {
  content: "Glimmer and EmberJS";
}
figure.highlight.gn .code:after, figure.highlight.gni .code:after {
  content: "GN for Ninja";
}
figure.highlight.go .code:after, figure.highlight.golang .code:after {
  content: "Go";
}
figure.highlight.gf .code:after {
  content: "Grammatical Framework";
}
figure.highlight.golo .code:after, figure.highlight.gololang .code:after {
  content: "Golo";
}
figure.highlight.gradle .code:after {
  content: "Gradle";
}
figure.highlight.graphql .code:after, figure.highlight.gql .code:after {
  content: "GraphQL";
}
figure.highlight.groovy .code:after {
  content: "Groovy";
}
figure.highlight.gsql .code:after {
  content: "GSQL";
}
figure.highlight.xml .code:after, figure.highlight.html .code:after, figure.highlight.xhtml .code:after, figure.highlight.rss .code:after, figure.highlight.atom .code:after, figure.highlight.xjb .code:after, figure.highlight.xsd .code:after, figure.highlight.xsl .code:after, figure.highlight.plist .code:after, figure.highlight.svg .code:after {
  content: "HTML, XML";
}
figure.highlight.http .code:after, figure.highlight.https .code:after {
  content: "HTTP";
}
figure.highlight.haml .code:after {
  content: "Haml";
}
figure.highlight.handlebars .code:after, figure.highlight.hbs .code:after {
  content: "Handlebars";
}
figure.highlight.haskell .code:after, figure.highlight.hs .code:after {
  content: "Haskell";
}
figure.highlight.haxe .code:after, figure.highlight.hx .code:after {
  content: "Haxe";
}
figure.highlight.hlsl .code:after {
  content: "High-level shader language";
}
figure.highlight.hy .code:after, figure.highlight.hylang .code:after {
  content: "Hy";
}
figure.highlight.ini .code:after, figure.highlight.toml .code:after {
  content: "Ini, TOML";
}
figure.highlight.inform7 .code:after, figure.highlight.i7 .code:after {
  content: "Inform7";
}
figure.highlight.irpf90 .code:after {
  content: "IRPF90";
}
figure.highlight.iptables .code:after {
  content: "Iptables";
}
figure.highlight.json .code:after, figure.highlight.jsonc .code:after {
  content: "JSON";
}
figure.highlight.java .code:after, figure.highlight.jsp .code:after {
  content: "Java";
}
figure.highlight.javascript .code:after, figure.highlight.js .code:after, figure.highlight.jsx .code:after {
  content: "JavaScript";
}
figure.highlight.jolie .code:after, figure.highlight.iol .code:after, figure.highlight.ol .code:after {
  content: "Jolie";
}
figure.highlight.julia .code:after, figure.highlight.jl .code:after {
  content: "Julia";
}
figure.highlight.julia-repl .code:after {
  content: "Julia REPL";
}
figure.highlight.kotlin .code:after, figure.highlight.kt .code:after {
  content: "Kotlin";
}
figure.highlight.lang .code:after {
  content: "Lang";
}
figure.highlight.tex .code:after {
  content: "LaTeX";
}
figure.highlight.leaf .code:after {
  content: "Leaf";
}
figure.highlight.lean .code:after {
  content: "Lean";
}
figure.highlight.lasso .code:after, figure.highlight.ls .code:after, figure.highlight.lassoscript .code:after {
  content: "Lasso";
}
figure.highlight.less .code:after {
  content: "Less";
}
figure.highlight.ldif .code:after {
  content: "LDIF";
}
figure.highlight.lisp .code:after {
  content: "Lisp";
}
figure.highlight.livecodeserver .code:after {
  content: "LiveCode Server";
}
figure.highlight.livescript .code:after, figure.highlight.ls .code:after {
  content: "LiveScript";
}
figure.highlight.lookml .code:after {
  content: "LookML";
}
figure.highlight.lua .code:after {
  content: "Lua";
}
figure.highlight.luau .code:after {
  content: "Luau";
}
figure.highlight.macaulay2 .code:after {
  content: "Macaulay2";
}
figure.highlight.makefile .code:after, figure.highlight.mk .code:after, figure.highlight.mak .code:after, figure.highlight.make .code:after {
  content: "Makefile";
}
figure.highlight.markdown .code:after, figure.highlight.md .code:after, figure.highlight.mkdown .code:after, figure.highlight.mkd .code:after {
  content: "Markdown";
}
figure.highlight.mathematica .code:after, figure.highlight.mma .code:after, figure.highlight.wl .code:after {
  content: "Mathematica";
}
figure.highlight.matlab .code:after {
  content: "Matlab";
}
figure.highlight.maxima .code:after {
  content: "Maxima";
}
figure.highlight.mel .code:after {
  content: "Maya Embedded Language";
}
figure.highlight.mercury .code:after {
  content: "Mercury";
}
figure.highlight.mips .code:after, figure.highlight.mipsasm .code:after {
  content: "MIPS Assembler";
}
figure.highlight.mint .code:after {
  content: "Mint";
}
figure.highlight.mirth .code:after {
  content: "Mirth";
}
figure.highlight.mirc .code:after, figure.highlight.mrc .code:after {
  content: "mIRC Scripting Language";
}
figure.highlight.mizar .code:after {
  content: "Mizar";
}
figure.highlight.mkb .code:after {
  content: "MKB";
}
figure.highlight.mlir .code:after {
  content: "MLIR";
}
figure.highlight.mojolicious .code:after {
  content: "Mojolicious";
}
figure.highlight.monkey .code:after {
  content: "Monkey";
}
figure.highlight.moonscript .code:after, figure.highlight.moon .code:after {
  content: "Moonscript";
}
figure.highlight.motoko .code:after, figure.highlight.mo .code:after {
  content: "Motoko";
}
figure.highlight.n1ql .code:after {
  content: "N1QL";
}
figure.highlight.nsis .code:after {
  content: "NSIS";
}
figure.highlight.never .code:after {
  content: "Never";
}
figure.highlight.nginx .code:after, figure.highlight.nginxconf .code:after {
  content: "Nginx";
}
figure.highlight.nim .code:after, figure.highlight.nimrod .code:after {
  content: "Nim";
}
figure.highlight.nix .code:after {
  content: "Nix";
}
figure.highlight.oak .code:after {
  content: "Oak";
}
figure.highlight.ocl .code:after {
  content: "Object Constraint Language";
}
figure.highlight.ocaml .code:after, figure.highlight.ml .code:after {
  content: "OCaml";
}
figure.highlight.objectivec .code:after, figure.highlight.mm .code:after, figure.highlight.objc .code:after, figure.highlight.obj-c .code:after {
  content: "Objective C";
}
figure.highlight.glsl .code:after {
  content: "OpenGL Shading Language";
}
figure.highlight.openscad .code:after, figure.highlight.scad .code:after {
  content: "OpenSCAD";
}
figure.highlight.ruleslanguage .code:after {
  content: "Oracle Rules Language";
}
figure.highlight.oxygene .code:after {
  content: "Oxygene";
}
figure.highlight.pf .code:after {
  content: "PF";
}
figure.highlight.php .code:after {
  content: "PHP";
}
figure.highlight.papyrus .code:after, figure.highlight.psc .code:after {
  content: "Papyrus";
}
figure.highlight.parser3 .code:after {
  content: "Parser3";
}
figure.highlight.perl .code:after, figure.highlight.pl .code:after, figure.highlight.pm .code:after {
  content: "Perl";
}
figure.highlight.phix .code:after {
  content: "Phix";
}
figure.highlight.pine .code:after, figure.highlight.pinescript .code:after {
  content: "Pine Script";
}
figure.highlight.plaintext .code:after, figure.highlight.txt .code:after, figure.highlight.text .code:after {
  content: "Plaintext";
}
figure.highlight.pony .code:after {
  content: "Pony";
}
figure.highlight.pgsql .code:after, figure.highlight.postgres .code:after, figure.highlight.postgresql .code:after {
  content: "PostgreSQL & PL/pgSQL";
}
figure.highlight.powershell .code:after, figure.highlight.ps .code:after, figure.highlight.ps1 .code:after {
  content: "PowerShell";
}
figure.highlight.processing .code:after {
  content: "Processing";
}
figure.highlight.prolog .code:after {
  content: "Prolog";
}
figure.highlight.properties .code:after {
  content: "Properties";
}
figure.highlight.proto .code:after, figure.highlight.protobuf .code:after {
  content: "Protocol Buffers";
}
figure.highlight.puppet .code:after, figure.highlight.pp .code:after {
  content: "Puppet";
}
figure.highlight.python .code:after, figure.highlight.py .code:after, figure.highlight.gyp .code:after {
  content: "Python";
}
figure.highlight.profile .code:after {
  content: "Python profiler results";
}
figure.highlight.python-repl .code:after, figure.highlight.pycon .code:after {
  content: "Python REPL";
}
figure.highlight.qsharp .code:after {
  content: "Q#";
}
figure.highlight.k .code:after, figure.highlight.kdb .code:after {
  content: "Q";
}
figure.highlight.qml .code:after {
  content: "QML";
}
figure.highlight.r .code:after {
  content: "R";
}
figure.highlight.cshtml .code:after, figure.highlight.razor .code:after, figure.highlight.razor-cshtml .code:after {
  content: "Razor CSHTML";
}
figure.highlight.reasonml .code:after, figure.highlight.re .code:after {
  content: "ReasonML";
}
figure.highlight.redbol .code:after, figure.highlight.rebol .code:after, figure.highlight.red .code:after, figure.highlight.red-system .code:after {
  content: "Rebol & Red";
}
figure.highlight.rib .code:after {
  content: "RenderMan RIB";
}
figure.highlight.rsl .code:after {
  content: "RenderMan RSL";
}
figure.highlight.rescript .code:after, figure.highlight.res .code:after {
  content: "ReScript";
}
figure.highlight.risc .code:after, figure.highlight.riscript .code:after {
  content: "RiScript";
}
figure.highlight.riscv .code:after, figure.highlight.riscvasm .code:after {
  content: "RISC-V Assembly";
}
figure.highlight.graph .code:after, figure.highlight.instances .code:after {
  content: "Roboconf";
}
figure.highlight.robot .code:after, figure.highlight.rf .code:after {
  content: "Robot Framework";
}
figure.highlight.rpm-specfile .code:after, figure.highlight.rpm .code:after, figure.highlight.spec .code:after, figure.highlight.rpm-spec .code:after, figure.highlight.specfile .code:after {
  content: "RPM spec files";
}
figure.highlight.ruby .code:after, figure.highlight.rb .code:after, figure.highlight.gemspec .code:after, figure.highlight.podspec .code:after, figure.highlight.thor .code:after, figure.highlight.irb .code:after {
  content: "Ruby";
}
figure.highlight.rust .code:after, figure.highlight.rs .code:after {
  content: "Rust";
}
figure.highlight.rvt .code:after, figure.highlight.rvt-script .code:after {
  content: "RVT Script";
}
figure.highlight.sas .code:after {
  content: "SAS";
}
figure.highlight.scss .code:after {
  content: "SCSS";
}
figure.highlight.sql .code:after {
  content: "SQL";
}
figure.highlight.p21 .code:after, figure.highlight.step .code:after, figure.highlight.stp .code:after {
  content: "STEP Part 21";
}
figure.highlight.scala .code:after {
  content: "Scala";
}
figure.highlight.scheme .code:after {
  content: "Scheme";
}
figure.highlight.scilab .code:after, figure.highlight.sci .code:after {
  content: "Scilab";
}
figure.highlight.sfz .code:after {
  content: "SFZ";
}
figure.highlight.shexc .code:after {
  content: "Shape Expressions";
}
figure.highlight.shell .code:after, figure.highlight.console .code:after {
  content: "Shell";
}
figure.highlight.smali .code:after {
  content: "Smali";
}
figure.highlight.smalltalk .code:after, figure.highlight.st .code:after {
  content: "Smalltalk";
}
figure.highlight.sml .code:after, figure.highlight.ml .code:after {
  content: "SML";
}
figure.highlight.solidity .code:after, figure.highlight.sol .code:after {
  content: "Solidity";
}
figure.highlight.spl .code:after {
  content: "Splunk SPL";
}
figure.highlight.stan .code:after, figure.highlight.stanfuncs .code:after {
  content: "Stan";
}
figure.highlight.stata .code:after {
  content: "Stata";
}
figure.highlight.iecst .code:after, figure.highlight.scl .code:after, figure.highlight.stl .code:after, figure.highlight.structured-text .code:after {
  content: "Structured Text";
}
figure.highlight.stylus .code:after, figure.highlight.styl .code:after {
  content: "Stylus";
}
figure.highlight.subunit .code:after {
  content: "SubUnit";
}
figure.highlight.supercollider .code:after, figure.highlight.sc .code:after {
  content: "Supercollider";
}
figure.highlight.svelte .code:after {
  content: "Svelte";
}
figure.highlight.swift .code:after {
  content: "Swift";
}
figure.highlight.tcl .code:after, figure.highlight.tk .code:after {
  content: "Tcl";
}
figure.highlight.terraform .code:after, figure.highlight.tf .code:after, figure.highlight.hcl .code:after {
  content: "Terraform( HCL)";
}
figure.highlight.tap .code:after {
  content: "Test Anything Protocol";
}
figure.highlight.thrift .code:after {
  content: "Thrift";
}
figure.highlight.toit .code:after {
  content: "Toit";
}
figure.highlight.tp .code:after {
  content: "TP";
}
figure.highlight.tsql .code:after {
  content: "Transact-SQL";
}
figure.highlight.twig .code:after, figure.highlight.craftcms .code:after {
  content: "Twig";
}
figure.highlight.typescript .code:after, figure.highlight.ts .code:after, figure.highlight.tsx .code:after, figure.highlight.mts .code:after, figure.highlight.cts .code:after {
  content: "TypeScript";
}
figure.highlight.unicorn-rails-log .code:after {
  content: "Unicorn Rails log";
}
figure.highlight.unison .code:after, figure.highlight.u .code:after {
  content: "Unison";
}
figure.highlight.vbnet .code:after, figure.highlight.vb .code:after {
  content: "VB.Net";
}
figure.highlight.vba .code:after {
  content: "VBA";
}
figure.highlight.vbscript .code:after, figure.highlight.vbs .code:after {
  content: "VBScript";
}
figure.highlight.vhdl .code:after {
  content: "VHDL";
}
figure.highlight.vala .code:after {
  content: "Vala";
}
figure.highlight.verilog .code:after, figure.highlight.v .code:after {
  content: "Verilog";
}
figure.highlight.vim .code:after {
  content: "Vim Script";
}
figure.highlight.wgsl .code:after {
  content: "WGSL";
}
figure.highlight.xsharp .code:after, figure.highlight.xs .code:after, figure.highlight.prg .code:after {
  content: "X#";
}
figure.highlight.axapta .code:after {
  content: "X++";
}
figure.highlight.x86asm .code:after {
  content: "x86 Assembly";
}
figure.highlight.x86asmatt .code:after {
  content: "x86 Assembly (AT&T)";
}
figure.highlight.xl .code:after, figure.highlight.tao .code:after {
  content: "XL";
}
figure.highlight.xquery .code:after, figure.highlight.xpath .code:after, figure.highlight.xq .code:after, figure.highlight.xqm .code:after {
  content: "XQuery";
}
figure.highlight.yml .code:after, figure.highlight.yaml .code:after {
  content: "YAML";
}
figure.highlight.zenscript .code:after, figure.highlight.zs .code:after {
  content: "ZenScript";
}
figure.highlight.zephir .code:after, figure.highlight.zep .code:after {
  content: "Zephir";
}
figure.highlight.zig .code:after {
  content: "Zig";
}

pre .function .keyword,
pre .constant {
  color: #0092db !important;
}
pre .keyword,
pre .attribute {
  color: #e96900 !important;
}
pre .number,
pre .literal {
  color: #ae81ff !important;
}
pre .tag,
pre .tag .title,
pre .change,
pre .winutils,
pre .flow,
pre .lisp .title,
pre .clojure .built_in,
pre .nginx .title,
pre .tex .special {
  color: #2973b7 !important;
}
pre .symbol,
pre .symbol .string,
pre .value,
pre .regexp {
  color: #42b983 !important;
}
pre .title {
  color: #83b917 !important;
}
pre .tag .value,
pre .string,
pre .subst,
pre .haskell .type,
pre .preprocessor,
pre .ruby .class .parent,
pre .built_in,
pre .sql .aggregate,
pre .django .template_tag,
pre .django .variable,
pre .smalltalk .class,
pre .javadoc,
pre .django .filter .argument,
pre .smalltalk .localvars,
pre .smalltalk .array,
pre .attr_selector,
pre .pseudo,
pre .addition,
pre .stream,
pre .envvar,
pre .apache .tag,
pre .apache .cbracket,
pre .tex .command,
pre .prompt {
  color: #42b983 !important;
}
pre .comment,
pre .java .annotation,
pre .python .decorator,
pre .template_comment,
pre .pi,
pre .doctype,
pre .shebang,
pre .apache .sqbracket,
pre .tex .formula {
  color: #b3b3b3 !important;
}
pre .deletion {
  color: #ba4545 !important;
}
pre .coffeescript .javascript,
pre .javascript .xml,
pre .tex .formula,
pre .xml .javascript,
pre .xml .vbscript,
pre .xml .css,
pre .xml .cdata {
  opacity: 0.5 !important;
}
@charset "UTF-8";
.content {
  height: auto;
  float: right;
  width: calc(100% - 300px);
  margin-top: 0;
  padding: 54px 0 80px;
}

.animated {
  animation-fill-mode: both;
  animation-duration: 0.5s;
}

.animated.hinge {
  animation-duration: 0.5s;
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.fadeInDown {
  animation-name: fadeInDown;
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    transform: translateY(20px);
  }
}
.fadeOutDown {
  animation-name: fadeOutDown;
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.fadeOut {
  animation-name: fadeOut;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.fadeIn {
  animation-name: fadeIn;
}

.sidebar-navigation {
  border-top: 1px solid var(--border-subtle);
  border-bottom: 1px solid var(--border-subtle);
  margin: 0 40px;
  padding: 24px 0;
}
.sidebar-navigation .nav {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 15px;
}
.sidebar-navigation .nav li {
  position: relative;
  display: block;
  margin: 0 0 6px;
}
.sidebar-navigation .nav a {
  align-items: center;
  border-radius: 8px;
  color: var(--text-muted);
  display: flex;
  min-height: 38px;
  padding: 0 12px;
}
.sidebar-navigation .nav a:hover {
  background: var(--accent-soft);
  color: var(--accent);
}
.sidebar-navigation .nav a.current {
  background: var(--accent-soft);
  color: var(--accent);
  font-weight: 600;
}
.sidebar-navigation .nav a.current:before {
  background: var(--accent);
  border-radius: 999px;
  content: "";
  height: 18px;
  left: -40px;
  position: absolute;
  width: 3px;
}
.sidebar-navigation .sidebar-tools {
  margin-top: 30px;
}
.sidebar-navigation .sidebar-tools .nav_right_btn {
  display: flex;
  gap: 16px;
  margin: 0;
  padding: 0 2px;
}
.sidebar-navigation .sidebar-tools .nav_right_btn li {
  display: block;
  list-style: none;
}
.sidebar-navigation .sidebar-tools .nav_right_btn a {
  align-items: center;
  border: 1px solid var(--border-subtle);
  border-radius: 8px;
  color: var(--text-muted);
  display: flex;
  height: 36px;
  justify-content: center;
  width: 36px;
}
.sidebar-navigation .sidebar-tools .nav_right_btn a:hover {
  background: var(--accent-soft);
  color: var(--accent);
}
@media screen and (max-width: 900px) {
  .sidebar-navigation {
    margin: 0 24px;
    padding: 16px 0;
  }
  .sidebar-navigation .nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .sidebar-navigation .nav li {
    margin: 0;
  }
}

.sidebar {
  width: 300px;
  -webkit-background-size: cover;
  background-size: cover;
  background: radial-gradient(circle at 40% 0%, rgba(88, 166, 255, 0.08), transparent 32%), var(--secondary);
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  transition: all 0.25s ease;
  top: 0;
  left: 0;
  position: fixed;
  z-index: 4;
  border-right: 1px solid var(--border-subtle);
}
.sidebar .logo-title {
  text-align: center;
  margin-top: 0;
  padding: 64px 38px 22px;
}
.sidebar .logo-title .description {
  font-size: 13px;
  line-height: 1.55;
  color: var(--text-muted);
  margin-top: 12px;
  margin-left: auto;
  margin-right: auto;
  max-width: 220px;
}
.sidebar .logo-title .description p {
  margin: 0;
  overflow-wrap: anywhere;
}
.sidebar .logo-title .logo {
  margin: 0 auto;
}
.sidebar .logo-title .title {
  text-align: center;
}
.sidebar .logo-title .title .logo-link {
  display: inline-block;
  line-height: 0;
}
.sidebar .logo-title .title .logo-link img {
  display: block;
  transition: transform 0.2s ease;
}
.sidebar .logo-title .title .logo-link:hover img {
  transform: scale(1.04);
}
.sidebar .logo-title .title h3 {
  text-transform: none;
  font-size: 1.45rem;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 1.2;
  margin: 18px 0 0;
}
.sidebar .logo-title .title a {
  text-decoration: none;
  color: var(--text-strong);
  font-size: 1.45rem;
  font-weight: bold;
}
.sidebar .social-links {
  list-style: none;
  padding: 0;
  margin: 0 0 28px;
  font-size: 17px;
  text-align: center;
}
.sidebar .social-links i {
  margin-right: 3px;
}
.sidebar .social-links li {
  display: inline;
  padding: 0 8px;
  line-height: 0;
}
.sidebar .social-links a {
  color: var(--text-muted);
}
.sidebar .social-links a:hover {
  color: var(--accent);
}
@media screen and (max-width: 900px) {
  .sidebar {
    width: 100%;
    height: auto;
    position: relative;
    border-right: none;
    z-index: 1;
    top: auto;
  }
  .sidebar .logo-title {
    padding: 30px 26px 16px;
    margin-top: 0;
  }
  .sidebar .logo-title .title img {
    width: 120px;
    height: 120px;
  }
  .sidebar .logo-title .title h3 {
    font-size: 20px;
    overflow-wrap: anywhere;
  }
}

.sidebar-top {
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  flex: 0 0 auto;
}
.sidebar-top .ltr {
  text-align: center;
}

.card {
  margin-left: 5px;
  overflow-wrap: anywhere;
}

.post {
  transition: background-color 0.25s ease;
  background-color: transparent;
  box-sizing: border-box;
  margin: 0 auto 42px;
  max-width: 860px;
  padding: 0 56px;
}
.post .post-title h1 {
  text-transform: none;
  font-size: 30px;
  letter-spacing: 0;
  line-height: 1.2;
}
.post .post-title h2 {
  text-transform: none;
  letter-spacing: 0;
  font-size: 28px;
  line-height: 1.2;
  font-weight: 600;
  color: var(--text-strong);
}
.post .post-title h3 {
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.25;
  font-weight: 700;
  color: var(--text-strong);
  font-size: 30px;
  margin: 0 0 16px;
}
.post .post-title a {
  text-decoration: none;
  color: var(--text-strong);
}
.post .post-title a:hover {
  color: var(--accent);
  text-decoration: none;
}
.post .post-content {
  color: var(--text-main);
  overflow-wrap: anywhere;
}
.post .post-content a {
  text-decoration: none;
  color: var(--accent);
}
.post .post-content a:hover {
  color: var(--text-strong);
}
.post .post-content h1 {
  color: var(--text-strong);
  font-size: 26px;
  font-weight: 600;
}
.post .post-content h2 {
  color: var(--text-strong);
  font-size: 23px;
}
.post .post-content h3 {
  color: var(--text-strong);
  font-size: 20px;
  font-weight: 600;
}
.post .post-content h4 {
  color: var(--text-strong);
  font-size: 17px;
}
.post .post-content h5 {
  color: var(--text-strong);
  font-size: 16px;
  font-weight: 600;
}
.post .post-content h6 {
  color: var(--text-strong);
  font-size: 15px;
}
.post .post-footer {
  padding: 8px 0 34px 0;
  border-bottom: 1px solid var(--border-subtle);
  transition: border 0.25s ease;
}
.post .post-footer .meta {
  max-width: 100%;
  height: 25px;
  color: var(--text-muted);
}
.post .post-footer .meta .info {
  float: left;
  font-size: 13px;
}
.post .post-footer .meta .info .date {
  margin-right: 10px;
}
.post .post-footer .meta a {
  text-decoration: none;
  color: var(--text-muted);
  padding-right: 10px;
}
.post .post-footer .meta a:hover {
  color: var(--accent);
}
.post .post-footer .meta i {
  margin-right: 6px;
}
.post .post-footer .tags {
  padding-bottom: 15px;
  font-size: 13px;
}
.post .post-footer .tags ul {
  list-style-type: none;
  display: inline;
  margin: 0;
  padding: 0;
}
.post .post-footer .tags ul li {
  list-style-type: none;
  margin: 0;
  padding-right: 5px;
  display: inline;
}
.post .post-footer .tags a {
  text-decoration: none;
  color: var(--primary-450);
  font-weight: 400;
}
.post .post-footer .tags a:hover {
  text-decoration: none;
}

.pagination {
  margin: 30px;
  padding: 0px 0 56px 0;
  border-bottom: 1px solid var(--border-subtle);
  transition: border 0.8s;
}
.pagination ul {
  list-style: none;
  margin: 0;
  padding: 0;
  height: 13px;
}
.pagination ul li {
  margin: 0 2px 0 2px;
  display: inline;
  line-height: 1;
}
.pagination ul li a {
  text-decoration: none;
}
.pagination .pre {
  float: left;
}
.pagination .next {
  float: right;
}

.like-reblog-buttons {
  float: right;
}

.like-button {
  float: right;
  padding: 0 0 0 10px;
}

.reblog-button {
  float: right;
  padding: 0;
}

#install-btn {
  position: fixed;
  bottom: 0px;
  right: 6px;
}

#disqus_thread {
  margin: 30px;
  border-bottom: 1px solid var(--border-subtle);
}

.footer {
  clear: both;
  text-align: center;
  font-size: 10px;
  margin: 0 auto;
  bottom: 0;
  position: absolute;
  width: 100%;
  padding-bottom: 5px;
  background-color: transparent;
  transition: background-color 0.25s ease;
}
.footer a {
  color: var(--text-muted);
}
.footer a:hover {
  color: var(--accent);
}

.archive {
  width: 100%;
}

@media screen and (max-width: 900px) {
  .content {
    float: none;
    width: 100%;
    padding: 34px 0 70px;
  }
  .post {
    margin-bottom: 34px;
    padding: 0 24px;
  }
  .post .post-title h3 {
    font-size: 25px;
  }
}
.list-with-title {
  font-size: 15px;
  margin: 30px;
  padding: 0;
  line-height: 25px;
}
.list-with-title li {
  list-style-type: none;
  padding: 0;
}
.list-with-title .listing-title {
  font-size: 24px;
  color: var(--secondary-400);
  font-weight: 600;
  line-height: 2.2em;
}
.list-with-title .listing {
  padding: 0;
}
.list-with-title .listing .listing-post {
  padding-bottom: 5px;
  display: flex;
}
.list-with-title .listing .listing-post .post-time {
  flex: 0 0 50px;
  float: right;
  color: var(--secondary-800);
  transition: color 0.8s;
}
.list-with-title .listing .listing-post a {
  flex: 1 1 100%;
  color: var(--secondary-550);
}
.list-with-title .listing .listing-post a:hover {
  color: #4786d6;
}

/* share */
.share {
  margin: 0px 30px;
  display: inline-flex;
}
.share > .share-btn {
  width: 32px;
  height: 32px;
  border-radius: 300px;
  margin-right: 5px;
  background-color: var(--secondary-250);
  transition: all 0.3s;
}
.share > .share-btn a {
  color: var(--secondary);
  padding: 9px;
}
.share > .share-btn:hover {
  background-color: var(--primary);
}
.share .linkonly a {
  padding: 9px 7px;
}
.share .weibo {
  background-color: #ed6243;
}
.share .weibo a {
  color: #fff;
}
.share .weibo:hover {
  background-color: #9c2409;
}
.share .twitter {
  background-color: #59c0fd;
}
.share .twitter a {
  color: #fff;
}
.share .twitter:hover {
  background-color: #2b81b3;
}
.share .mastodon {
  background-color: #6d2fdf;
}
.share .mastodon a {
  color: #fff;
}
.share .mastodon:hover {
  background-color: #4003b1;
}

/* about */
.about {
  margin: 30px;
}
.about h3 {
  font-size: 22px;
}

/* links */
.links {
  margin: 30px;
}
.links h3 {
  font-size: 22px;
}
.links a {
  cursor: pointer;
}

/* Comment style */
.comment-count {
  color: var(--secondary-400);
}

.tab-community {
  color: var(--secondary-400);
}

.read_more {
  font-size: 14px;
}

.back-button {
  padding-top: 30px;
  max-width: 100px;
  padding-left: 40px;
  float: left;
}

/* 默认评论样式 */
#fb_comments_container {
  margin: 30px;
}

/* button style */
a.btn {
  color: var(--secondary-550);
  font-weight: 400;
}

.btn {
  display: inline-block;
  position: relative;
  outline: 0;
  color: var(--primary-450);
  background: transparent;
  font-size: 14px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid var(--primary-150);
  white-space: nowrap;
  font-weight: 400;
  font-style: normal;
  border-radius: 999em;
  transition: color 0.8s, border 0.8s;
}

.btn:hover {
  display: inline-block;
  position: relative;
  outline: 0px;
  color: var(--primary-650);
  background: transparent;
  font-size: 14px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid var(--secondary-250);
  white-space: nowrap;
  font-weight: 400;
  font-style: normal;
  border-radius: 999em;
}

[role=back] {
  padding: 0.5em 1.25em;
  line-height: 1.666em;
}

[role=home] {
  padding: 0.5em 1.25em;
  line-height: 1.666em;
}

[role=navigation] {
  padding: 0.5em 1.25em;
  line-height: 1.666em;
}

[role=tags] {
  padding: 6px 12px;
}

/* Menu样式 */
.menu {
  float: right;
  padding-top: 30px;
}
.menu .btn-down {
  margin: 0px;
}
.menu .btn-down li {
  list-style: none;
  width: 100px;
}
.menu .btn-down li a {
  display: inline-block;
  position: relative;
  padding: 0.5em 1.25em;
  outline: 0;
  color: var(--primary-450);
  background: transparent;
  font-size: 14px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid var(--primary-150);
  white-space: nowrap;
  font-weight: 400;
  font-style: normal;
  border-radius: 999em;
  margin-top: 5px;
}
.menu .btn-down li a:hover {
  position: relative;
  padding: 0.5em 1.25em;
  outline: 0;
  color: var(--secondary);
  background: #3cbd10;
  font-size: 14px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: 1px solid var(--primary-150);
  white-space: nowrap;
  font-weight: 400;
  font-style: normal;
  border-radius: 999em;
  margin-top: 5px;
}
.menu .btn-down div {
  position: absolute;
  visibility: hidden;
  width: 100px;
  float: right;
}

.page_404 {
  text-align: center;
  padding-top: 50px;
}

/* Tag style */
.tag_btn {
  align-items: center;
  border-radius: 100px;
  color: var(--secondary-250);
  display: inline-flex;
  justify-content: center;
  padding-left: 0.75em;
  padding-right: 0em;
  white-space: nowrap;
  margin: 10px;
}
.tag_btn i {
  margin: 8px;
}
.tag_btn .tag_count {
  align-items: center;
  border-radius: 100px;
  color: var(--secondary-250);
  display: inline-flex;
  font-size: 0.5rem;
  width: 15px;
  height: 15px;
  justify-content: center;
  line-height: 1.5;
  padding: 5px;
  margin: 5px;
  white-space: nowrap;
  background-color: var(--secondary-900);
  transition: background-color 0.8s;
}

/* TOC style */
.tocmenu {
  align-items: center;
  border-top: 1px solid var(--primary-100);
  text-align: center;
  font-size: 13px;
  margin: 0 auto;
  width: 100%;
  list-style: none;
  position: relative;
}

.toclist-container {
  overflow-y: auto;
  max-height: calc(100vh - 600px);
}
.toclist-container::-webkit-scrollbar-thumb {
  color: #4786d6;
  background-color: #4786d6;
}
.toclist-container::-webkit-scrollbar {
  width: 2px;
  color: #4786d6;
  height: auto;
}

.toclist {
  /* width: max-content; */
  border-top: none;
  padding: 0px 30px;
  display: inline-block;
  text-align: left;
}

.in-page.toc-container {
  display: none;
}

@media screen and (max-width: 900px) {
  .post-title h3 {
    line-height: 1.6;
  }
  .content {
    margin-top: 0px;
    top: auto;
    width: 100%;
    z-index: 2;
    /* position: absolute; */
  }
  .footer {
    display: block;
  }
  .tocmenu {
    border-bottom: 1px solid var(--primary-100);
    position: relative;
    text-align: left;
  }
  .toc-mobile .toc-button {
    position: fixed;
    z-index: 900;
    background: #4786d6;
    color: var(--secondary);
    padding: 8px 15px;
    bottom: 0;
    right: 0;
  }
  .toc-mobile:hover .in-page.toc-container {
    right: 0;
  }
  .toclist-container {
    height: auto;
    max-height: calc(100vh - 110px);
  }
  .in-sidebar.toc-container {
    display: none;
  }
  .in-page.toc-container {
    display: block;
    border-left: 1px solid var(--primary-100);
    position: fixed;
    bottom: 0px;
    right: -300px;
    width: 300px;
    transition: all 0.4s;
    background-color: var(--secondary);
    z-index: 999;
  }
  .in-page.toc-container .toc-toggle summary {
    background: #4786d6;
    transition: color 0.8s;
    color: var(--secondary);
    padding: 5px 10px;
  }
  .in-page.toc-container .toc-toggle[open] summary {
    color: #4786d6;
    transition: background-color 0.8s;
    background: var(--secondary);
    padding: 4px;
    text-align: center;
  }
}
.friend-link-container {
  display: inline-block;
}

.friend-link-box {
  width: 350px;
  margin: 10px;
  padding: 10px;
  border: 1px solid var(--primary-100);
  border-radius: 10px;
  display: grid;
  grid-template: auto/84px auto;
}

.friend-link-meta {
  padding: 10px;
}

.friend-link-title {
  font-weight: 700;
}

.friend-link-avatar {
  width: 64px;
  margin-right: 10px;
}

.friend-link-avatar img {
  width: 64px;
}

.float-button {
  position: fixed;
  width: 50px;
  height: 50px;
  background-color: var(--secondary);
  border: 1px solid var(--primary-300);
  right: 10px;
  border-radius: 100%;
  transition: all 0.3s;
}
.float-button:hover {
  background-color: var(--secondary-950);
}
.float-button:active {
  background-color: var(--secondary-900);
}
.float-button.hide {
  transform: translateX(100px);
}
.float-button i {
  font-size: 200%;
  color: var(--primary-500);
}
.float-button#scroll-to-top {
  bottom: 50px;
}

.modal-cover {
  display: none;
  perspective: 50em;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
  background: rgba(0, 0, 0, 0.7);
  transform-origin: 0%;
  perspective-origin: top center;
}

.modal-cover.show {
  display: block;
}

.modal-cover,
.modal-cover .modal-container {
  position: fixed;
  overflow: hidden;
}

.modal-cover .modal-container {
  left: 50%;
  z-index: 101;
}

.indicator {
  top: 50vh;
  transform: translate(-35px, -35px);
  width: 70px;
  height: 70px;
  border-radius: 10px;
  background: var(--secondary);
  display: flex;
  align-items: center;
  justify-content: center;
}
.indicator i {
  font-size: 300%;
  color: var(--primary-800);
}

.tip {
  position: relative;
  margin: 2em 0;
  padding: 12px 24px 12px 30px;
  border-left: 4px solid #f66;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  background-color: var(--secondary-950);
}
.tip:before {
  position: absolute;
  top: 14px;
  left: -12px;
  content: "!";
  width: 20px;
  height: 20px;
  border-radius: 100%;
  transition: color 0.8s;
  color: var(--secondary);
  font-size: 14px;
  line-height: 20px;
  font-weight: bold;
  text-align: center;
  background-color: #f66;
  font-family: "Dosis", "Source Sans Pro", "Helvetica Neue", Arial, sans-serif;
}

.toc {
  border: 1px solid #f0f0f0;
  margin-bottom: 20px;
  padding: 10px 30px;
}

.tag_box {
  position: relative;
  width: 80%;
  margin-top: 1%;
  margin-left: 7.2%;
}
.searchbox .searchbox-selectable {
  cursor: pointer;
}

.searchbox .searchbox-input-wrapper {
  position: relative;
}

.searchbox .searchbox-input-wrapper .searchbox-input {
  color: var(--primary);
  width: 100%;
  border: none;
  outline: none;
  font-size: 16px;
  box-shadow: none;
  font-weight: 200;
  border-radius: 0;
  background: var(--secondary);
  line-height: 20px;
  box-sizing: border-box;
  padding: 12px 28px 12px 20px;
  border-bottom: 1px solid var(--primary-100);
}

.searchbox .searchbox-input-wrapper .searchbox-close {
  top: 50%;
  right: 6px;
  width: 20px;
  height: 20px;
  font-size: 16px;
  margin-top: -11px;
  position: absolute;
  text-align: center;
  display: inline-block;
}

.searchbox .searchbox-input-wrapper .searchbox-close:hover {
  color: #3273dc;
}

.searchbox .searchbox-result-wrapper {
  left: 0;
  right: 0;
  top: 45px;
  bottom: 0;
  overflow-y: auto;
  position: absolute;
}

.searchbox .searchbox-container {
  top: 100px;
  width: 540px;
  bottom: 100px;
  margin-left: -270px;
  box-sizing: border-box;
}

@media screen and (max-width: 559px), screen and (max-height: 479px) {
  .searchbox .searchbox-container {
    top: 0;
    left: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    background: var(--primary-50);
  }
}
.ins-section-container {
  position: relative;
  background: var(--primary-50);
}

.ins-section {
  font-size: 14px;
  line-height: 16px;
}
.ins-section .ins-section-header,
.ins-section .ins-search-item {
  padding: 8px 15px;
}
.ins-section .ins-section-header {
  color: var(--primary-400);
  border-bottom: 1px solid var(--primary-100);
}
.ins-section .ins-slug {
  margin-left: 5px;
  color: var(--primary-400);
}
.ins-section .ins-slug:before {
  content: "(";
}
.ins-section .ins-slug:after {
  content: ")";
}
.ins-section .ins-search-item:hover, .ins-section .ins-search-item.active {
  color: var(--secondary);
  background: #3273dc;
}
.ins-section .ins-search-item:hover .ins-slug,
.ins-section .ins-search-item:hover .ins-search-preview, .ins-section .ins-search-item.active .ins-slug,
.ins-section .ins-search-item.active .ins-search-preview {
  color: var(--secondary);
}
.ins-section .ins-search-item header,
.ins-section .ins-search-item .ins-search-preview {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.ins-section .ins-search-item .ins-search-preview {
  height: 15px;
  font-size: 9px;
  color: var(--primary-400);
  margin: 5px 0 0 20px;
}
.ins-section header .ins-title {
  margin-left: 8px;
}
:root {
  --editorial-serif: var(--reading-font);
  --editorial-sans: var(--ui-font);
  --editorial-mono: var(--mono-font-face);
  --radius-xs: 8px;
  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-lg: 20px;
}

::selection {
  color: var(--accent-contrast);
  background: var(--accent);
}

body {
  color: var(--text-main);
  background: transparent;
  font-family: var(--editorial-sans);
  counter-reset: archive-entry;
}

.ambient-background {
  position: fixed;
  z-index: 0;
  top: -12vh;
  left: -12vw;
  width: 124vw;
  height: 124vh;
  pointer-events: none;
  filter: blur(10px) saturate(118%) contrast(108%);
  image-rendering: auto;
  opacity: 1;
  transform: scale(1.08);
  transform-origin: center;
}

body,
.sidebar,
.post,
.footer,
.searchbox .searchbox-input-wrapper .searchbox-input,
.ins-section-container {
  transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

a:link,
a:visited {
  color: var(--accent);
}

a:hover,
a:active {
  color: var(--text-strong);
}

.sidebar {
  background: var(--sidebar-glass);
  border-right: 1px solid var(--glass-border, var(--border-strong));
  -webkit-backdrop-filter: blur(36px) saturate(160%) brightness(1.03);
  backdrop-filter: blur(36px) saturate(160%) brightness(1.03);
  box-shadow: inset 0 1px 0 var(--glass-highlight, transparent);
}
.sidebar .logo-title {
  padding: 48px 32px 24px;
  text-align: left;
}
.sidebar .logo-title::before {
  content: "01 / PERSONAL ARCHIVE";
  display: block;
  margin-bottom: 22px;
  color: var(--label);
  font-family: var(--editorial-mono);
  font-size: 9px;
  letter-spacing: 0.2em;
}
.sidebar .logo-title .logo {
  margin: 0;
}
.sidebar .logo-title .title img {
  display: block;
  width: 134px;
  height: 134px;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 0;
  border: 0;
  background: transparent;
  filter: var(--logo-filter);
  object-fit: contain;
}
.sidebar .logo-title .title h3 {
  margin-top: 22px;
  font-family: var(--editorial-serif);
  font-size: 27px;
  font-weight: 500;
  line-height: 1.05;
}
.sidebar .logo-title .title a {
  color: var(--text-strong);
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}
.sidebar .logo-title .description {
  max-width: 210px;
  margin: 15px auto 0;
  color: var(--text-muted);
  font-size: 13px;
  line-height: 1.7;
  text-align: center;
}
.sidebar .social-links {
  margin: 0 auto 28px;
  text-align: center;
}
.sidebar .social-links li {
  display: inline-block;
  padding: 0 10px;
}
.sidebar .social-links a:hover {
  color: var(--accent);
}
.sidebar .footer {
  box-sizing: border-box;
  padding: 0 32px 16px;
  position: static;
  margin-top: auto;
  color: var(--label);
  font-family: var(--editorial-mono);
  letter-spacing: 0.08em;
  text-align: left;
}

.sidebar-top .ltr {
  text-align: left;
}

.sidebar-navigation {
  margin: 0 32px;
  padding: 20px 0;
  border-top: 0;
  border-color: var(--border-subtle);
}
.sidebar-navigation::before {
  content: "REGISTER / INDEX";
  display: block;
  margin-bottom: 14px;
  padding-left: 8px;
  color: var(--label);
  font-family: var(--editorial-mono);
  font-size: 9px;
  letter-spacing: 0.18em;
  box-sizing: border-box;
}
.sidebar-navigation .nav {
  font-size: 14px;
}
.sidebar-navigation .nav li {
  margin: 0;
  border-top: 1px solid var(--border-subtle);
}
.sidebar-navigation .nav li:last-child {
  border-bottom: 1px solid var(--border-subtle);
}
.sidebar-navigation .nav a {
  min-height: 42px;
  padding: 0 8px;
  border-radius: var(--radius-sm);
  color: var(--text-main);
  font-family: var(--editorial-sans);
}
.sidebar-navigation .nav a:hover {
  color: var(--accent);
  background: transparent;
}
.sidebar-navigation .nav a.current {
  color: var(--accent-contrast);
  background: var(--accent);
  font-weight: 500;
}
.sidebar-navigation .nav a.current::before {
  display: none;
}
.sidebar-navigation .sidebar-tools {
  margin-top: 22px;
}
.sidebar-navigation .sidebar-tools::before {
  content: "TOOLS";
  display: block;
  margin-bottom: 10px;
  color: var(--label);
  font-family: var(--editorial-mono);
  font-size: 9px;
  letter-spacing: 0.18em;
}
.sidebar-navigation .sidebar-tools .nav_right_btn {
  gap: 10px;
  padding: 0;
}
.sidebar-navigation .sidebar-tools .nav_right_btn a {
  width: 38px;
  height: 38px;
  color: var(--text-main);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
}
.sidebar-navigation .sidebar-tools .nav_right_btn a:hover {
  color: var(--accent-contrast);
  background: var(--accent);
  border-color: var(--accent);
}

.content {
  position: relative;
  z-index: 1;
  padding-top: 48px;
  background: var(--content-glass);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.content-back {
  position: fixed;
  top: 24px;
  left: calc(300px + 32px);
  z-index: 5;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  font-size: 13px;
  font-family: var(--editorial-mono);
  letter-spacing: 0.12em;
  color: var(--text-muted);
  background: var(--panel-glass);
  border: 1px solid var(--glass-border, var(--border-subtle));
  border-radius: var(--radius-md);
  text-decoration: none;
  -webkit-backdrop-filter: blur(24px) saturate(150%);
  backdrop-filter: blur(24px) saturate(150%);
  box-shadow: inset 0 1px 0 var(--glass-highlight, transparent);
  transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}
.content-back i {
  font-size: 14px;
}
.content-back:hover {
  color: var(--accent);
  border-color: var(--border-strong);
  background: var(--surface-soft);
}

.post {
  position: relative;
  margin-bottom: 30px;
  padding: 30px 42px 0;
  color: var(--text-main);
  counter-increment: archive-entry;
  background: var(--panel-glass);
  border: 1px solid var(--glass-border, rgba(var(--primary-rgb), 0.18));
  border-radius: var(--radius-lg);
  box-shadow: 0 18px 48px var(--panel-shadow), inset 0 1px 0 var(--glass-highlight, transparent);
  -webkit-backdrop-filter: blur(32px) saturate(155%) brightness(1.04);
  backdrop-filter: blur(32px) saturate(155%) brightness(1.04);
  overflow: hidden;
}
.post::before {
  content: "ENTRY " counter(archive-entry, decimal-leading-zero) " / FIELD NOTE";
  display: block;
  margin-bottom: 17px;
  color: var(--label);
  font-family: var(--editorial-mono);
  font-size: 9px;
  letter-spacing: 0.2em;
}
.post .post-title h1,
.post .post-title h2,
.post .post-title h3 {
  color: var(--text-strong);
  font-family: var(--editorial-serif);
  font-weight: 500;
  letter-spacing: 0;
}
.post .post-title h3 {
  margin: 0 0 14px;
  font-size: 38px;
  line-height: 1.08;
}
.post .post-title a {
  color: var(--text-strong);
}
.post .post-title a:hover {
  color: var(--accent);
}
.post .post-content {
  color: var(--text-main);
}
.post .post-content > p:first-child {
  margin-top: 0;
}
.post .post-content h1,
.post .post-content h2,
.post .post-content h3,
.post .post-content h4,
.post .post-content h5,
.post .post-content h6 {
  color: var(--text-strong);
  font-family: var(--editorial-serif);
  font-weight: 500;
}
.post .post-content a {
  color: var(--accent);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}
.post .post-footer {
  padding: 15px 0 24px;
  border-top: 1px solid var(--border-subtle);
  border-bottom: 1px solid var(--border-subtle);
}
.post .post-footer .meta {
  min-height: 24px;
  height: auto;
  color: var(--label);
}
.post .post-footer .meta .info {
  display: flex;
  float: none;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  font-family: var(--editorial-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  line-height: 1.7;
}
.post .post-footer .meta a {
  padding-right: 0;
  color: var(--label);
}
.post .post-footer .meta a:hover {
  color: var(--accent);
}
.post .post-footer .meta i {
  margin-right: 0;
  color: var(--verdigris);
}

p {
  color: var(--text-main);
  font-size: 15px;
  line-height: 1.9;
}

blockquote {
  margin: 2em 0;
  padding: 24px 28px;
  color: var(--accent-contrast);
  border: 0;
  background: var(--accent);
}
blockquote p,
blockquote a {
  color: inherit;
}

hr {
  border-top-color: var(--border-subtle);
}

code,
tt,
pre {
  color: #e9e0d1 !important;
  background: #211f1b !important;
  border-radius: var(--radius-xs);
}

code,
tt {
  border: 1px solid #494238;
}

table {
  background: #fffdf7;
  border: 1px solid var(--border-subtle);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: var(--radius-sm);
  overflow: hidden;
}

table,
table tr,
table tr td,
table tr th {
  border-color: var(--border-subtle);
}

tr th,
tr td {
  padding: 10px 14px;
  font-size: 16px;
  font-family: var(--editorial-sans);
  line-height: 1.7;
  color: var(--text-main);
  vertical-align: top;
}

table th {
  color: var(--text-strong);
  background: #f7f5ed;
  font-family: var(--editorial-sans);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
}

table tbody > tr:nth-child(odd) > td,
table tbody > tr:nth-child(odd) > th {
  background: #fffdf7;
}

table tbody > tr:nth-child(even) > td,
table tbody > tr:nth-child(even) > th {
  background: #faf8f2;
}

table code,
table tt {
  font-size: 0.92em;
}

.list-with-title .listing-title {
  color: var(--text-strong);
  font-family: var(--editorial-serif);
  font-size: 34px;
  font-weight: 500;
}
.list-with-title .listing .listing-post {
  align-items: baseline;
  padding: 10px 0;
  border-top: 1px solid var(--border-subtle);
}
.list-with-title .listing .listing-post a {
  color: var(--text-main);
  font-family: var(--editorial-serif);
  font-size: 19px;
}
.list-with-title .listing .listing-post a:hover {
  color: var(--accent);
}
.list-with-title .listing .listing-post .post-time {
  color: var(--label);
  font-family: var(--editorial-mono);
  font-size: 10px;
}

.tag_btn,
.btn,
.friend-link-box,
.float-button,
.indicator,
.tip {
  border-radius: var(--radius-sm);
}

.tag_btn {
  color: var(--text-main);
}
.tag_btn .tag_count {
  color: var(--accent-contrast);
  background: var(--accent);
}

.share > .share-btn,
.share .weibo,
.share .twitter,
.share .mastodon {
  color: var(--text-main);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  background: transparent;
}
.share > .share-btn a,
.share .weibo a,
.share .twitter a,
.share .mastodon a {
  color: var(--text-main);
}
.share > .share-btn:hover,
.share .weibo:hover,
.share .twitter:hover,
.share .mastodon:hover {
  border-color: var(--accent);
  background: var(--accent);
}
.share > .share-btn:hover a,
.share .weibo:hover a,
.share .twitter:hover a,
.share .mastodon:hover a {
  color: var(--accent-contrast);
}

.float-button {
  color: var(--text-main);
  background: var(--surface);
  border-color: var(--border-subtle);
}
.float-button:hover, .float-button:active {
  background: var(--accent);
  border-color: var(--accent);
}
.float-button:hover i, .float-button:active i {
  color: var(--accent-contrast);
}

.modal-cover {
  background: rgba(27, 24, 20, 0.78);
}

.searchbox .searchbox-container {
  border: 1px solid var(--glass-border, var(--border-strong));
  border-radius: var(--radius-md);
  background: var(--panel-glass);
  box-shadow: 0 16px 48px var(--panel-shadow), inset 0 1px 0 var(--glass-highlight, transparent);
  -webkit-backdrop-filter: blur(28px) saturate(150%);
  backdrop-filter: blur(28px) saturate(150%);
  overflow: hidden;
}

.searchbox .searchbox-input-wrapper .searchbox-input {
  color: var(--text-strong);
  background: var(--surface);
  border-bottom-color: var(--border-subtle);
  font-family: var(--editorial-mono);
  font-size: 13px;
  letter-spacing: 0.04em;
}

.ins-section-container {
  background: var(--surface);
}

.ins-section .ins-section-header {
  color: var(--label);
  border-bottom-color: var(--border-subtle);
  font-family: var(--editorial-mono);
  font-size: 9px;
  letter-spacing: 0.16em;
}
.ins-section .ins-slug,
.ins-section .ins-search-item .ins-search-preview {
  color: var(--label);
}
.ins-section .ins-search-item:hover,
.ins-section .ins-search-item.active {
  color: var(--accent-contrast);
  background: var(--accent);
}
.ins-section .ins-search-item:hover .ins-slug,
.ins-section .ins-search-item:hover .ins-search-preview,
.ins-section .ins-search-item.active .ins-slug,
.ins-section .ins-search-item.active .ins-search-preview {
  color: var(--accent-contrast);
}

@media screen and (max-width: 900px) {
  .sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--border-strong);
  }
  .sidebar .logo-title {
    padding: 28px 24px 18px;
  }
  .sidebar .logo-title .title h3 {
    font-size: 27px;
  }
  .sidebar .logo-title .title img {
    width: 120px;
    height: 120px;
  }
  .sidebar .logo-title .description {
    max-width: 320px;
  }
  .sidebar .social-links {
    margin: 0 auto 22px;
  }
  .sidebar-navigation {
    margin: 0 24px;
  }
  .sidebar-navigation .nav {
    gap: 0 18px;
  }
  .sidebar-navigation .nav li:nth-child(2) {
    border-top: 1px solid var(--border-subtle);
  }
  .content {
    padding-top: 32px;
  }
  .content-back {
    top: 12px;
    left: 16px;
    padding: 6px 12px;
    font-size: 14px;
  }
  .post {
    margin-right: 14px;
    margin-left: 14px;
    padding: 24px 24px 0;
  }
  .post .post-title h3 {
    font-size: 31px;
    line-height: 1.15;
  }
  .post .post-footer .meta .info {
    display: block;
  }
  .post .post-footer .meta .info > * {
    margin-right: 7px;
  }
  .ambient-background {
    filter: blur(8px) saturate(110%) contrast(103%);
  }
  .searchbox .searchbox-container {
    border: 0;
    box-shadow: none;
  }
}