:root { --wrap: 960px; --gutter: 1.5rem; }
body { margin:0; font: 16px/1.65 "Georgia", "Times New Roman", serif; color:#111; background:#fff; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
.site-header, .site-footer { border-block: 1px solid #e5e5e5; }
.site-header .brand { font-weight: 600; text-decoration: none; color: inherit; }
main.wrap { display: grid; grid-template-columns: 280px 1fr; gap: 2rem; margin-top: 1.5rem; }
.full-width { grid-column: 1 / -1; }
@media (max-width: 900px) { main.wrap { grid-template-columns: 1fr; } .meta { position: static; } }
.meta { position: sticky; top: 1rem; align-self: start; }
.doc-meta { font-size: 0.92rem; border: 1px solid #eee; padding: .75rem; background:#fafafa; }
.toc { margin-top: 1rem; border: 1px solid #eee; padding: .75rem; }
.toc ol { padding-left: 1.25rem; }
.rfc-title { margin-bottom: .25rem; text-transform: uppercase; letter-spacing: 0.05em; }
.rfc-subtitle { margin-top: 0; color:#555; }
.doc-body { max-width: 78ch; }
.doc-body h2, .doc-body h3, .doc-body h4 { scroll-margin-top: 4rem; }
.doc-body pre, code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace; }
.doc-body img { max-width: 100%; height: auto; }
.boilerplate { border: 1px solid #e8e8e8; padding: .75rem 1rem; background: #fcfcfc; }
.boilerplate + .boilerplate { margin-top: .75rem; }
.rfc-index { list-style: decimal; padding-left: 1.25rem; }
.post-item .summary { margin: .25rem 0 0; color:#444; }
.tags { display:flex; gap:.5rem; padding:0; margin:.5rem 0 0; list-style:none; }
.tags li a { text-decoration:none; border:1px solid #e6e6e6; padding:.125rem .5rem; border-radius:.25rem; color:#0645ad; }
a { color: #0645ad; }
.site-footer { margin-top: 2rem; padding: 1rem 0; }
.crumbs { font-size: 0.9rem; }
.note { border-left: 4px solid #555; padding-left: .75rem; }

.hero { margin-bottom: 2rem; }
.hero .eyebrow { text-transform: uppercase; letter-spacing: 0.2em; font-size: 0.85rem; color: #666; margin-bottom: 0.5rem; }
.hero h1 { font-size: 2.6rem; margin: 0; }
.hero .tagline { margin-top: 0.5rem; color: #333; }
.hero-wide .hero-content { max-width: 700px; margin: 0 auto; text-align: center; }

.dial { margin-bottom: 2rem; padding: 1.5rem; background: #faf7f0; border: 1px solid #d7d2c5; }
.dial-label { text-transform: uppercase; font-size: 0.85rem; letter-spacing: 0.2em; margin-bottom: 1rem; color: #6c665a; text-align: center; }
.dial-face { position: relative; width: 320px; height: 320px; margin: 0 auto; border-radius: 50%; border: 2px solid #c7c1b0; background: radial-gradient(circle, #fff 0%, #f3f0e7 70%, #efe9dc 100%); }
.dial-center { position: absolute; width: 20px; height: 20px; border-radius: 50%; background: #333; top: 50%; left: 50%; transform: translate(-50%, -50%); box-shadow: inset 0 0 0 4px #faf7f0; }
.dial-option { --dial-pos: translate(-50%, -50%); position: absolute; width: 130px; text-align: center; text-decoration: none; color: inherit; border: 1px solid #c7c1b0; background: #fff; padding: 0.4rem 0.6rem; border-radius: 999px; box-shadow: 0 4px 10px rgba(0,0,0,0.08); transition: transform 0.15s ease; transform: var(--dial-pos); }
.dial-option:hover { transform: var(--dial-pos) scale(1.05); }
.dial-band { display: block; font-weight: 600; font-size: 1rem; letter-spacing: 0.15em; }
.dial-desc { display: block; font-size: 0.85rem; color: #4a4a4a; }
.dial-option.dial-am { top: -20px; left: 50%; --dial-pos: translate(-50%, 0); }
.dial-option.dial-fm { top: 50%; right: -20px; --dial-pos: translate(0, -50%); }
.dial-option.dial-xm { bottom: -20px; left: 50%; --dial-pos: translate(-50%, 0); }
.dial-option.dial-vault { top: 50%; left: -20px; --dial-pos: translate(0, -50%); }

@media (max-width: 500px) {
  .dial-face { width: 260px; height: 260px; }
  .dial-option { width: 110px; font-size: 0.85rem; }
}

.about, .contact, .section-previews { margin-bottom: 2rem; }
.contact .soon { font-size: 0.9rem; color: #666; }

.section-previews h2 { margin-bottom: 1rem; }
.preview-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.preview-card { border: 1px solid #e5e5e5; padding: 1rem; background: #fff; }
.preview-card h3 { margin: 0 0 0.25rem; text-transform: uppercase; letter-spacing: 0.1em; font-size: 1rem; }
.preview-card ol { padding-left: 1.1rem; margin: 0; font-size: 0.95rem; }
.preview-card li { margin-bottom: 0.4rem; }
.preview-card .preview-desc { margin: 0 0 0.5rem; color: #444; font-size: 0.95rem; }
.preview-card .empty { margin: 0; font-size: 0.9rem; color: #777; }

.frequency-head { margin-bottom: 1.5rem; }
.frequency-label { text-transform: uppercase; letter-spacing: 0.2em; font-size: 0.85rem; color: #6c665a; }

.contact a { font-weight: 600; }