/* Resume pages (site/resume/ and site/resume/review/). Colors come from the
   active theme in site.css. */
.wrap-resume { max-width: 46rem; }
.r-actions { margin: -1.5rem 0 2rem; }
.r-head h1 { margin-bottom: 0.25rem; }
.r-headline { font-family: var(--font-head); font-size: 1.1rem; color: var(--accent); margin: 0 0 0.5rem; }
.r-contact { font-family: var(--font-ui); font-size: 0.85rem; color: var(--muted); margin: 0; line-height: 1.7; }
.r-contact a { color: inherit; }
.r-section h2 { border-bottom: 1px solid var(--rule); padding-bottom: 0.3rem; margin-top: 2rem; }
.r-section p { margin: 0.35rem 0; }
.r-section ul { margin: 0.35rem 0 0; padding-left: 1.2rem; }
.r-section li { margin: 0.2rem 0; }
.r-section li::marker { color: var(--accent); }
.r-job { margin: 1.1rem 0 1.4rem; }
.r-job-head, .r-job-sub { display: flex; justify-content: space-between; align-items: baseline; gap: 0.25rem 1rem; flex-wrap: wrap; }
.r-job-head h3 { font-size: 1.02rem; margin: 0; }
.r-job-head h3 a { color: var(--fg); text-decoration: none; }
.r-job-head h3 a:hover { color: var(--accent); }
.r-dates, .r-job-sub span:last-child { font-family: var(--font-ui); font-size: 0.82rem; color: var(--muted); }
.r-job-sub span:first-child { font-style: italic; }
.r-detail { font-family: var(--font-ui); font-size: 0.85rem; color: var(--muted); }
.r-skills { display: grid; grid-template-columns: max-content 1fr; gap: 0.3rem 1rem; margin: 0.4rem 0 0; }
.r-skills dt { font-weight: 600; font-family: var(--font-head); font-size: 0.95rem; }
.r-skills dd { margin: 0; }

/* Web resume (site/resume/): two columns after the 2024 export. Colors follow
   the active theme; the PDF keeps the plain one-column layout. */
.wrap-resume:has(.rw) { max-width: 62rem; }
.rw-head { display: flex; align-items: center; gap: 1.75rem; padding: 1.5rem; margin-bottom: 1.75rem;
  background: var(--card); border: 1px solid var(--rule); border-radius: 10px; }
.rw-photo { display: block; width: 8.5rem; height: 8.5rem; border-radius: 14px; object-fit: cover; border: 3px solid var(--rule); background: var(--rule); }
.rw-head h1 { margin: 0; }
.rw-headline { font-family: var(--font-head); font-size: 1.1rem; color: var(--accent); margin: 0.2rem 0 0.7rem; }
.rw-contact, .rw-links, .rw-tags { list-style: none; padding: 0; margin: 0; }
.rw-contact { display: flex; flex-wrap: wrap; gap: 0.25rem 1.1rem; font-family: var(--font-ui); font-size: 0.85rem; color: var(--muted); }
.rw-contact a { color: inherit; }
.rw-grid { display: grid; grid-template-columns: 15.5rem 1fr; gap: 2.25rem; align-items: start; }
.rw h2 { font-size: 1rem; margin: 0 0 0.6rem; }
.rw section + section { margin-top: 1.6rem; }
.rw-side { font-size: 0.93rem; }
.rw-side p { margin: 0; }
.rw-side h3 { font-size: 0.95rem; margin: 0 0 0.2rem; }
.rw-side .r-detail { margin: 0 0 0.3rem; }
.rw-edu h3 { line-height: 1.3; }
.rw-side .rw-edu-detail { font-family: var(--font-ui); font-size: 0.85rem; color: var(--tk-attr); margin: 0.15rem 0 0.4rem; }
.rw-edu-note { font-size: 0.88rem; line-height: 1.45; color: var(--muted); }
.rw-side ul:not([class]) { padding-left: 1.1rem; margin: 0.3rem 0 0; }
.rw-links { display: flex; gap: 1rem; font-family: var(--font-ui); }
.rw-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.rw-tags li { font-family: var(--font-ui); font-size: 0.8rem; line-height: 1.3; padding: 0.22rem 0.55rem;
  border: 1px solid var(--rule); border-radius: 999px; background: var(--card); color: var(--tk-fn); }
.rw-job { border-left: 3px solid var(--rule); padding: 0.1rem 0 0.1rem 1rem; margin: 0 0 1.4rem; }
.rw-job:hover { border-left-color: var(--accent); }
.rw-job-head, .rw-job-sub { display: flex; justify-content: space-between; align-items: baseline; gap: 0.15rem 1rem; flex-wrap: wrap; }
.rw-job-head h3 { font-size: 1.02rem; margin: 0; }
.rw-job-head h3 a { color: var(--accent); text-decoration: none; }
.rw-job-head h3 a:hover { text-decoration: underline; }
.rw-dates { font-family: var(--font-ui); font-size: 0.82rem; font-weight: 600; color: var(--tk-attr); }
.rw-role { color: var(--tk-num); }
.rw-loc { font-family: var(--font-ui); font-size: 0.82rem; color: var(--muted); }
.rw-job p, .rw-main ul { margin: 0.4rem 0 0; }
.rw-main ul { list-style: none; padding-left: 0; }
.rw-main li { position: relative; padding-left: 1rem; margin: 0.3rem 0; line-height: 1.5; }
.rw-main li::before { content: ""; position: absolute; left: 0.1rem; top: 0.68em; width: 0.32rem; height: 0.32rem;
  border-radius: 1px; background: var(--muted); opacity: 0.7; }
@media (max-width: 48rem) {
  .rw-grid { grid-template-columns: 1fr; gap: 1.6rem; }
  .rw-main { order: -1; }
}
@media (max-width: 30rem) {
  .rw-head { flex-direction: column; align-items: flex-start; gap: 1rem; padding: 1.1rem; }
  .rw-photo { width: 6.5rem; height: 6.5rem; }
}

/* Review page */
.rv-layout { display: grid; grid-template-columns: 17rem 1fr; gap: 2rem; align-items: start; }
.wrap-resume:has(.rv-layout) { max-width: 66rem; }
.rv-panel { position: sticky; top: 1rem; max-height: calc(100vh - 2rem); overflow-y: auto; background: var(--card); border: 1px solid var(--rule); border-radius: 8px; padding: 1rem; font-family: var(--font-ui); font-size: 0.85rem; }
.rv-panel h2 { margin: 0 0 0.5rem; font-size: 1rem; }
.rv-panel h2::before { content: none !important; }
.rv-control { margin: 0.9rem 0; }
.rv-control label { display: block; font-weight: 600; margin-bottom: 0.25rem; }
.rv-control select, .rv-selection button { width: 100%; font: inherit; color: var(--fg); background: var(--bg); border: 1px solid var(--rule); border-radius: 4px; padding: 0.3rem 0.4rem; }
.rv-note { margin: 0.35rem 0 0; color: var(--muted); line-height: 1.45; }
.rv-selection { margin-top: 1rem; display: grid; gap: 0.35rem; }
.rv-selection code { display: block; white-space: normal; word-break: break-all; font-size: 0.75rem; padding: 0.4rem; }
.rv-selection button { width: auto; justify-self: start; cursor: pointer; }
.rv-advice { margin-top: 1rem; }
.rv-advice summary { cursor: pointer; font-weight: 600; }
.rv-advice ul { padding-left: 1.1rem; }
.rv-advice li { margin: 0.4rem 0; line-height: 1.45; }
.r-slot { border-radius: 4px; transition: background-color 0.2s; }
@media (max-width: 52rem) {
  .rv-layout { grid-template-columns: 1fr; }
  .rv-panel { position: static; max-height: none; }
}
@media (max-width: 30rem) { .r-skills { grid-template-columns: 1fr; gap: 0 0; } .r-skills dd { margin-bottom: 0.4rem; } }
@media print {
  header.site, footer.site, .r-actions, .rv-panel { display: none; }
  .rw-grid { grid-template-columns: 13rem 1fr; } .rw-main { order: 0; }
  body { background: #fff; color: #000; font-size: 10pt; }
  .wrap { padding: 0; max-width: none; }
  a { color: inherit; text-decoration: none; }
}
