style.css

/*!
 * Theme Name:        First Draft
 * Theme URI:         https://github.com/justintadlock/first-draft
 * Description:       The first draft of your next WordPress theme.
 * Version:           1.0.0
 * Author:            Your Name
 * Author URI:        https://yourwebsite.tld
 * Tags:              block-patterns, block-styles, editor-style, full-site-editing, wide-blocks
 * Text Domain:       first-draft
 * Domain Path:       /assets/lang
 * Tested up to:      6.3
 * Requires at least: 6.2
 * Requires PHP:      7.4
 * License:           GNU General Public License v2.0 or later
 * License URI:       https://www.gnu.org/licenses/gpl-2.0.html
 */

/* Defaults. */
* {
	/* Enables features from the registered fonts. */
	font-feature-settings: "tnum", "ss01" 1;
	font-variant-numeric: slashed-zero;

}

a:where( :not( :focus ) ),
input:focus,
textarea:focus,
.wp-element-button {
	transition: all 0.5s ease-in-out;
}

:where( a:not( .wp-element-button ):focus ) {
	outline: 1px solid currentColor;
	outline-offset: 0.0625em;
}

a,
.wp-element-button {
	text-underline-offset: 0.0625em;
}

:where( :not( pre ) > code ) {
	padding: 0.125em 0.25em;
	font-size: 0.8125em;
	font-weight: 600;
	background: var( --wp--preset--color--neutral-100 );
}

kbd {
	padding: 0.125em 0.25em;
	font-size: 0.8125em;
	background: var( --wp--preset--color--neutral-100 );
	border: 1px solid var( --wp--preset--color--neutral-300 );
	border-radius: 0.25rem;
}

mark {
	padding: 0.25em;
}

s {
	color: var( --wp--preset--color--neutral-400 );
	text-decoration-color: var( --wp--preset--color--primary-700 );
}

sup,
sub {
	font-size: 0.8125em;
}

audio,
video {
	display: block;
}

/**
 * Combine each line-height set via `settings.custom.lineHeight` in `theme.json`
 * with the corresponding font-size set via `setting.typography.fontSizes`.
 */
.has-5-xl-font-size { line-height: var( --wp--custom--line-height--5-xl ); }
.has-4-xl-font-size { line-height: var( --wp--custom--line-height--4-xl ); }
.has-3-xl-font-size { line-height: var( --wp--custom--line-height--3-xl ); }
.has-2-xl-font-size { line-height: var( --wp--custom--line-height--2-xl ); }
.has-xl-font-size   { line-height: var( --wp--custom--line-height--xl ); }
.has-lg-font-size   { line-height: var( --wp--custom--line-height--lg ); }
.has-md-font-size   { line-height: var( --wp--custom--line-height--md ); }
.has-sm-font-size   { line-height: var( --wp--custom--line-height--sm ); }
.has-xs-font-size   { line-height: var( --wp--custom--line-height--xs ); }

/* Loosens the spacing above headings tightens the spacing below. */
.wp-block-post-content :is( h1, h2, h3, h4, h5, h6 ) {
	margin-block-end: 0;
}

.wp-block-post-content * + :is( h1, h2, h3, h4, h5, h6 )  {
	margin-block-start: var( --wp--preset--spacing--120 );
}

.wp-block-post-content :is( h1, h2, h3, h4, h5, h6 ) + * {
	margin-block-start: var( --wp--preset--spacing--40 );
}

.wp-block-post-content :where( hr, .wp-block-spacer ) + :is( h1, h2, h3, h4, h5, h6 ),
.wp-block-post-content :is( h1, h2, h3, h4, h5, h6 ) + :where( hr, .wp-block-spacer ) {
	margin-block-start: var( --wp--style--block-gap );
}

/* Center captions (WP doesn't support text-align in `theme.json`). */
.wp-element-caption {
	text-align: center;
}

/* Prefix `cite` elements (WP doesn't support element CSS in `theme.json`). */
cite::before {
	content: "\2013\00a0"
}

/* Adds form element styles, which aren't yet supported in `theme.json`. */
input,
select,
textarea,
:where( .wp-block-search__button-inside .wp-block-search__inside-wrapper ),
.wp-block-search__input,
.wp-block-post-comments-form :is( input:not( .wp-element-button ), textarea ) {
	font-family: inherit;
	font-size: inherit;
	font-style: normal;
	font-weight: 400;
	line-height: inherit;
	color: inherit;
	background: transparent;
	border: 1px solid var( --wp--preset--color--neutral-300 );
}

input[type="checkbox"],
input[type="radio"],
.wp-block-search__button-inside .wp-block-search__input {
	border: none;
}