:root {
  color-scheme: light;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.125rem;
  line-height: 1.6;
  color: #171717;
  background: #fff;
}

body { margin: 0; }
.container { width: min(90%, 50rem); margin-inline: auto; }
.site-header { border-bottom: 0.25rem solid #174ea6; padding-block: 1rem; }
.site-header .container { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.site-header nav { display: flex; flex-wrap: wrap; gap: 1rem; }
.site-name { color: #123f88; font-size: 1.5rem; font-weight: 700; }
main { padding-block: 2.5rem; }
h1, h2 { line-height: 1.2; }
h3 { line-height: 1.3; }
h1 { font-size: clamp(2rem, 6vw, 3rem); }
.introduction { font-size: 1.25rem; }
.home-hero { margin-bottom: 2.5rem; }
.product-cards, .content-list { list-style: none; padding: 0; display: grid; gap: 1.25rem; }
.product-card, .content-list > li { padding: 1rem 1.25rem; border: 0.1rem solid #a3a3a3; border-radius: 0.25rem; }
.product-card h3, .content-list h3 { margin-top: 0; }
.notice { margin-block: 2rem; padding: 1rem 1.25rem; border-left: 0.4rem solid #174ea6; background: #edf4ff; }
.listings { list-style: none; padding: 0; display: grid; gap: 1.25rem; }
.listing { padding: 1rem 1.25rem; border: 0.1rem solid #a3a3a3; border-radius: 0.25rem; }
.listing-placeholder { display: block; box-sizing: border-box; width: 100%; max-width: 16rem; height: auto; aspect-ratio: 4 / 3; margin-bottom: 1rem; border-radius: 0.25rem; background: #edf4ff; object-fit: cover; }
.listing-placeholder-detail { max-width: 24rem; }
.listing h3 { margin-top: 0; }
.summary, .details { margin-block: 1rem; }
.summary div, .details div { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-block: 0.35rem; }
.summary dt, .details dt { font-weight: 700; }
.summary dt::after, .details dt::after { content: " :"; }
.summary dd, .details dd { margin: 0; }
.description { white-space: pre-line; }
.original-link { margin-top: 2rem; font-weight: 700; }
.filters { margin-block: 2rem; padding: 1.25rem; border: 0.1rem solid #767676; }
.field { margin-bottom: 1rem; }
.field label { display: block; font-weight: 700; }
.field input, .field select, .field textarea { box-sizing: border-box; width: min(100%, 40rem); padding: 0.5rem; font: inherit; }
.filter-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
button { padding: 0.55rem 0.9rem; border: 0.12rem solid #123f88; color: #fff; background: #123f88; font: inherit; font-weight: 700; cursor: pointer; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 0.2rem solid #b45309; outline-offset: 0.2rem; }
.admin-nav { margin-bottom: 1.5rem; }
.admin-nav, .choice-links { display: flex; flex-wrap: wrap; gap: 1rem; }
.choice-links { margin-block: 2rem; }
fieldset { margin-block: 1rem; padding: 1rem; border: 0.1rem solid #767676; }
.radio-label, .checkbox-label { display: block; margin-block: 0.5rem; }
.radio-label input, .checkbox-label input { margin-right: 0.6rem; }
.admin-form { margin-block: 2rem; }
.error-summary { margin-block: 1.5rem; padding: 1rem 1.25rem; border: 0.2rem solid #b91c1c; }
.error-summary h2 { margin-top: 0; }
.field-error { margin-block: 0.25rem; color: #991b1b; font-weight: 700; }
.success-message { padding: 1rem; border-left: 0.4rem solid #15803d; background: #f0fdf4; }
.form-actions, .actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.danger { border-color: #991b1b; background: #991b1b; }
.button-link { display: inline-block; padding: 0.45rem 0.8rem; color: #fff; background: #123f88; font-weight: 700; }
.table-wrapper { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
caption { text-align: left; font-weight: 700; }
th, td { padding: 0.6rem; border: 0.1rem solid #767676; text-align: left; vertical-align: top; }
.site-footer { margin-top: 2rem; padding-block: 1.25rem; border-top: 0.1rem solid #767676; }
a { color: #123f88; text-decoration-thickness: 0.12em; text-underline-offset: 0.15em; }
a:hover { text-decoration-thickness: 0.2em; }
a:focus-visible { outline: 0.2rem solid #b45309; outline-offset: 0.2rem; }
.skip-link { position: absolute; top: 0.5rem; left: 0.5rem; padding: 0.5rem 0.75rem; background: #fff; transform: translateY(-200%); z-index: 1; }
.skip-link:focus { transform: translateY(0); }