/* Reset defaults */
blockquote, body, dd, dl, dt, fieldset, figure, h1, h2, h3, h4, h5, h6, hr, html, iframe, legend, ol, p, pre, textarea {
    margin: 0;
    padding:0
}

h1, h2, h3, h4, h5, h6 {
    font-size: 100%;
    font-weight:400;
}

button, input, select, textarea {
    margin:0
}

html {
    box-sizing:border-box
}

*, :after, :before {
    box-sizing:inherit
}

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

iframe {
    border:0
}

table {
    border-collapse: collapse;
    border-spacing:0
}

td, th {
    padding:0
}

td:not([align]), th:not([align]) {
    text-align:inherit
}

/* Specialisations */

/* @link https://utopia.fyi/type/calculator?c=320,18,1.2,1240,20,1.25,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */

:root {
  /* Step -2: 12.5px → 12.8px */
  --step--2: clamp(0.7813rem, 0.7747rem + 0.0326vw, 0.8rem);
  /* Step -1: 15px → 16px */
  --step--1: clamp(0.9375rem, 0.9158rem + 0.1087vw, 1rem);
  /* Step 0: 18px → 20px */
  --step-0: clamp(1.125rem, 1.0815rem + 0.2174vw, 1.25rem);
  /* Step 1: 21.6px → 25px */
  --step-1: clamp(1.35rem, 1.2761rem + 0.3696vw, 1.5625rem);
  /* Step 2: 25.92px → 31.25px */
  --step-2: clamp(1.62rem, 1.5041rem + 0.5793vw, 1.9531rem);
  /* Step 3: 31.104px → 39.0625px */
  --step-3: clamp(1.944rem, 1.771rem + 0.8651vw, 2.4414rem);
  /* Step 4: 37.3248px → 48.8281px */
  --step-4: clamp(2.3328rem, 2.0827rem + 1.2504vw, 3.0518rem);
  /* Step 5: 44.7898px → 61.0352px */
  --step-5: clamp(2.7994rem, 2.4462rem + 1.7658vw, 3.8147rem);

  --contents-p: clamp(1rem, 0.9489rem + 0.2273vw, 1.125rem);

  /* Colors */
  --dgc-bg-color: #fffbfb;
  --dgc-neutral-100: #404654;

  /* Spaces */
  --dgc-space-unit: 4px;
  --dgc-space-0: calc(var(--dgc-space-unit) * 0);
  --dgc-space-1: calc(var(--dgc-space-unit) * 1);
  --dgc-space-2: calc(var(--dgc-space-unit) * 2);
  --dgc-space-3: calc(var(--dgc-space-unit) * 3);
  --dgc-space-4: calc(var(--dgc-space-unit) * 4);
  --dgc-space-5: calc(var(--dgc-space-unit) * 5);
  --dgc-space-6: calc(var(--dgc-space-unit) * 6);
  --dgc-space-7: calc(var(--dgc-space-unit) * 7);
  --dgc-space-8: calc(var(--dgc-space-unit) * 8);
}

:root {
	-moz-osx-font-smoothing: grayscale; 
	-webkit-font-smoothing: antialiased; 
	text-rendering: optimizelegibility; 
}
/* Disables default decorations and color of links elements */
a {
	color: inherit;
	text-decoration: inherit;
	cursor: pointer;
}

a:hover {
	text-decoration: underline;
	text-underline-offset: 4px;
}

hr {
	border: none;
	display: block;
	height: 2px;
	background-color: lightgray;
}

.contents p {
	margin-top: 18px;
	margin-bottom: 32px;
	font-size: var(--contents-p);
}

pre code {
	display: block;
	overflow-x: auto;
	padding: 1em;
	background: #f3f3f3;
	color: #444;
}
