/* 简历生成器 · 工作台样式（页面外壳在 src/pages/resume/index.astro） */
.rs-card { padding: 1.1rem 1.25rem 1.25rem; }
.rs-topline { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: stretch; justify-content: space-between; }
.rs-current-tpl { display: flex; align-items: center; gap: 0.8rem; padding: 0.5rem 0.9rem 0.5rem 0.5rem; border-radius: 0.9rem; border: 1.5px dashed color-mix(in srgb, var(--primary) 55%, transparent); background: color-mix(in srgb, var(--primary) 6%, transparent); cursor: pointer; text-align: left; transition: all 0.15s; min-width: min(340px, 100%); }
.rs-current-tpl:hover { border-style: solid; background: color-mix(in srgb, var(--primary) 12%, transparent); }
.rs-current-thumb { width: 46px; height: 60px; border-radius: 6px; overflow: hidden; background: #e8eaec; flex: none; position: relative; box-shadow: 0 1px 4px rgb(0 0 0 / 0.18); }
.rs-current-thumb .rs-thumb-scale { transform: scale(0.058); transform-origin: top left; pointer-events: none; }
.rs-current-meta { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.rs-current-name { font-weight: 800; font-size: 0.95rem; }
.rs-current-sub { font-size: 0.75rem; opacity: 0.65; }
.rs-current-cta { font-weight: 700; font-size: 0.85rem; color: var(--primary); white-space: nowrap; }
.rs-topline-actions { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.rs-btn { padding: 0.45rem 0.85rem; border-radius: 0.65rem; font-size: 0.85rem; font-weight: 600; background: rgb(0 0 0 / 0.05); cursor: pointer; border: none; transition: all 0.15s; color: inherit; }
:root.dark .rs-btn { background: rgb(255 255 255 / 0.08); }
.rs-btn:hover { background: color-mix(in srgb, var(--primary) 16%, transparent); }
.rs-btn-ghost { background: transparent; border: 1px solid rgb(0 0 0 / 0.12); }
:root.dark .rs-btn-ghost { border-color: rgb(255 255 255 / 0.16); }
.rs-btn-primary { background: var(--primary); color: #fff; }
.rs-btn-primary:hover { opacity: 0.88; background: var(--primary); }
.rs-btn-small { padding: 0.3rem 0.6rem; font-size: 0.78rem; }
.rs-stylebar { display: flex; flex-wrap: wrap; gap: 0.6rem 1.4rem; align-items: center; margin-top: 0.9rem; padding: 0.6rem 0.8rem; border-radius: 0.8rem; background: rgb(0 0 0 / 0.035); }
:root.dark .rs-stylebar { background: rgb(255 255 255 / 0.05); }
.rs-style-group { display: flex; align-items: center; gap: 0.5rem; font-size: 0.83rem; font-weight: 600; }
.rs-style-label { font-size: 0.83rem; font-weight: 600; }
.rs-style-group select { padding: 0.3rem 0.5rem; border-radius: 0.5rem; border: 1px solid rgb(0 0 0 / 0.14); background: var(--card-bg, #fff); color: inherit; font-size: 0.83rem; }
.rs-colors { display: flex; gap: 0.35rem; }
.rs-color-dot { width: 20px; height: 20px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; padding: 0; }
.rs-color-dot.is-active { border-color: #fff; box-shadow: 0 0 0 2px var(--primary); transform: scale(1.12); }
.rs-saved { margin-left: auto; font-size: 0.78rem; opacity: 0.6; font-weight: 500; }
.rs-mobiletabs { display: none; gap: 0.5rem; margin-top: 0.9rem; }
.rs-mtab { flex: 1; padding: 0.55rem; border-radius: 0.7rem; border: none; font-weight: 700; font-size: 0.9rem; background: rgb(0 0 0 / 0.05); cursor: pointer; color: inherit; }
.rs-mtab.is-active { background: var(--primary); color: #fff; }
.rs-main { display: grid; grid-template-columns: 400px minmax(0, 1fr); gap: 1.1rem; margin-top: 1rem; align-items: start; }
/* 表单 */
.rs-form { display: flex; flex-direction: column; gap: 0.8rem; max-height: calc(100vh - 130px); overflow-y: auto; padding-right: 4px; position: sticky; top: 84px; }
.rs-sec-card { border: 1px solid rgb(0 0 0 / 0.08); border-radius: 0.9rem; padding: 0.8rem 0.9rem 0.9rem; background: rgb(0 0 0 / 0.015); }
:root.dark .rs-sec-card { border-color: rgb(255 255 255 / 0.1); background: rgb(255 255 255 / 0.03); }
.rs-sec-head { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.6rem; }
.rs-sec-title-input { font-weight: 800; font-size: 0.92rem; border: none; background: transparent; color: inherit; flex: 1; min-width: 0; padding: 0.15rem 0.3rem; border-radius: 0.4rem; }
.rs-sec-title-input:focus { outline: 2px solid var(--primary); }
.rs-sec-toggle { font-size: 0.75rem; padding: 0.22rem 0.55rem; border-radius: 999px; border: 1px solid rgb(0 0 0 / 0.14); background: transparent; cursor: pointer; color: inherit; flex: none; }
.rs-sec-toggle.is-off { opacity: 0.5; }
.rs-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0.55rem 0.7rem; }
.rs-field { display: flex; flex-direction: column; gap: 0.22rem; }
.rs-field.full { grid-column: 1 / -1; }
.rs-field label { font-size: 0.72rem; font-weight: 700; opacity: 0.65; }
.rs-field input, .rs-field textarea, .rs-field select { padding: 0.45rem 0.6rem; border-radius: 0.55rem; border: 1px solid rgb(0 0 0 / 0.13); background: var(--card-bg, #fff); color: inherit; font-size: 0.85rem; font-family: inherit; width: 100%; }
:root.dark .rs-field input, :root.dark .rs-field textarea { border-color: rgb(255 255 255 / 0.15); }
.rs-field textarea { resize: vertical; min-height: 64px; line-height: 1.5; }
.rs-field input:focus, .rs-field textarea:focus { outline: 2px solid var(--primary); outline-offset: -1px; }
.rs-entry-card { border: 1px dashed rgb(0 0 0 / 0.16); border-radius: 0.75rem; padding: 0.65rem 0.7rem 0.7rem; margin-bottom: 0.6rem; background: var(--card-bg, #fff); }
:root.dark .rs-entry-card { border-color: rgb(255 255 255 / 0.18); }
.rs-entry-tools { display: flex; gap: 0.3rem; justify-content: flex-end; margin-bottom: 0.45rem; }
.rs-tool { width: 26px; height: 26px; border-radius: 0.45rem; border: none; background: rgb(0 0 0 / 0.05); cursor: pointer; font-size: 0.78rem; line-height: 1; color: inherit; }
:root.dark .rs-tool { background: rgb(255 255 255 / 0.09); }
.rs-tool:hover { background: color-mix(in srgb, var(--primary) 20%, transparent); }
.rs-tool.danger:hover { background: rgb(220 60 60 / 0.18); }
.rs-add-btn { width: 100%; padding: 0.5rem; border-radius: 0.65rem; border: 1.5px dashed rgb(0 0 0 / 0.2); background: transparent; cursor: pointer; font-weight: 700; font-size: 0.83rem; color: var(--primary); }
.rs-add-btn:hover { background: color-mix(in srgb, var(--primary) 8%, transparent); }
.rs-photo-row { display: flex; gap: 0.7rem; align-items: center; }
.rs-photo-preview { width: 52px; height: 66px; object-fit: cover; border-radius: 6px; background: rgb(0 0 0 / 0.06); }
/* 预览 */
.rs-preview-col { position: sticky; top: 84px; }
.rs-preview-bar { display: flex; flex-wrap: wrap; gap: 0.6rem; justify-content: space-between; align-items: center; margin-bottom: 0.7rem; }
.rs-zoom, .rs-exports { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.rs-preview-wrap { background: repeating-conic-gradient(rgb(0 0 0 / 0.045) 0% 25%, transparent 0% 50%) 0 0 / 22px 22px, rgb(0 0 0 / 0.03); border-radius: 0.9rem; padding: 18px; overflow: auto; max-height: calc(100vh - 190px); }
:root.dark .rs-preview-wrap { background-color: rgb(255 255 255 / 0.04); }
.rs-page-scaler { margin: 0 auto; position: relative; }
.rs-page { width: 794px; transform-origin: top left; box-shadow: 0 6px 30px rgb(0 0 0 / 0.25); border-radius: 2px; overflow: hidden; background: #fff; }
/* 说明卡片 */
.rs-notes { margin-top: 1rem; padding: 1.1rem 1.25rem; }
.rs-notes-title { display: flex; align-items: center; gap: 0.5rem; font-size: 1.02rem; font-weight: 800; margin-bottom: 0.6rem; }
.rs-notes-title svg { width: 1.25rem; height: 1.25rem; color: var(--primary); }
.rs-notes-list { list-style: none; display: flex; flex-direction: column; gap: 0.45rem; font-size: 0.88rem; line-height: 1.65; opacity: 0.92; }
.rs-notes-list li { position: relative; padding-left: 1.05rem; }
.rs-notes-list li::before { content: "✓"; position: absolute; left: 0; color: var(--primary); font-weight: 800; }
.rs-foot { margin-top: 0.7rem; font-size: 0.8rem; opacity: 0.6; }
/* 模板弹窗 */
.rs-modal-overlay { position: fixed; inset: 0; z-index: 120; background: rgb(10 14 16 / 0.55); backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center; padding: 18px; }
.rs-modal { width: min(1180px, 100%); max-height: calc(100vh - 36px); display: flex; flex-direction: column; border-radius: 1.2rem; background: var(--card-bg, #fff); box-shadow: 0 24px 70px rgb(0 0 0 / 0.4); overflow: hidden; }
:root.dark .rs-modal { background: #1d2026; }
.rs-modal-head { display: flex; align-items: center; gap: 0.8rem; padding: 0.95rem 1.2rem; border-bottom: 1px solid rgb(0 0 0 / 0.08); flex-wrap: wrap; }
:root.dark .rs-modal-head { border-color: rgb(255 255 255 / 0.1); }
.rs-modal-title { font-weight: 800; font-size: 1.05rem; }
.rs-modal-search { flex: 1; min-width: 160px; padding: 0.5rem 0.8rem; border-radius: 0.6rem; border: 1px solid rgb(0 0 0 / 0.14); background: transparent; color: inherit; font-size: 0.88rem; }
.rs-modal-close { width: 34px; height: 34px; border-radius: 50%; border: none; background: rgb(0 0 0 / 0.06); cursor: pointer; font-size: 1rem; color: inherit; flex: none; }
.rs-modal-chips { display: flex; gap: 0.45rem; padding: 0.7rem 1.2rem 0.2rem; flex-wrap: wrap; }
.rs-chip { padding: 0.38rem 0.85rem; border-radius: 999px; border: 1.5px solid rgb(0 0 0 / 0.12); background: transparent; cursor: pointer; font-size: 0.83rem; font-weight: 700; color: inherit; }
.rs-chip small { opacity: 0.55; font-weight: 600; margin-left: 2px; }
.rs-chip.is-active { background: var(--primary); border-color: var(--primary); color: #fff; }
.rs-modal-body { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 0; min-height: 0; flex: 1; }
.rs-modal-grid { overflow-y: auto; padding: 0.9rem 1.2rem 1.2rem; display: grid; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); grid-auto-rows: max-content; gap: 0.9rem; align-content: start; }
.rs-tpl-card { display: block; border: 2px solid rgb(0 0 0 / 0.08); border-radius: 0.85rem; overflow: hidden; cursor: pointer; background: var(--card-bg, #fff); text-align: left; padding: 0; transition: all 0.15s; color: inherit; }
:root.dark .rs-tpl-card { border-color: rgb(255 255 255 / 0.1); }
.rs-tpl-card:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgb(0 0 0 / 0.16); }
.rs-tpl-card.is-selected { border-color: var(--primary); box-shadow: 0 0 0 2.5px color-mix(in srgb, var(--primary) 45%, transparent); }
.rs-tpl-thumb { height: 168px; overflow: hidden; position: relative; background: #dfe3e6; }
.rs-tpl-thumb .rs-thumb-scale { transform: scale(0.196); transform-origin: top left; pointer-events: none; }
.rs-thumb-scale { width: 794px; }
.rs-tpl-meta { padding: 0.55rem 0.65rem 0.65rem; }
.rs-tpl-name { font-weight: 800; font-size: 0.83rem; line-height: 1.3; }
.rs-tpl-tags { display: flex; gap: 0.3rem; margin-top: 0.35rem; flex-wrap: wrap; }
.rs-tpl-tag { font-size: 0.66rem; padding: 0.1rem 0.42rem; border-radius: 999px; background: color-mix(in srgb, var(--primary) 13%, transparent); color: var(--primary); font-weight: 700; }
.rs-modal-side { border-left: 1px solid rgb(0 0 0 / 0.08); padding: 0.9rem 1rem 1.1rem; overflow-y: auto; display: flex; flex-direction: column; gap: 0.7rem; }
:root.dark .rs-modal-side { border-color: rgb(255 255 255 / 0.1); }
.rs-modal-preview { height: 480px; overflow: hidden; border-radius: 0.7rem; background: #dfe3e6; position: relative; box-shadow: inset 0 0 0 1px rgb(0 0 0 / 0.08); }
.rs-modal-preview .rs-thumb-scale { transform: scale(0.464); transform-origin: top left; pointer-events: none; }
.rs-modal-side-name { font-weight: 800; font-size: 1rem; }
.rs-modal-side-desc { font-size: 0.83rem; opacity: 0.75; line-height: 1.55; }
.rs-modal-side-src { font-size: 0.75rem; opacity: 0.55; }
.rs-modal-apply { margin-top: auto; padding: 0.75rem; border-radius: 0.75rem; border: none; background: var(--primary); color: #fff; font-weight: 800; font-size: 0.95rem; cursor: pointer; }
.rs-modal-apply:hover { opacity: 0.9; }
.rs-modal-apply:disabled { opacity: 0.45; cursor: default; }
.rs-empty { grid-column: 1 / -1; text-align: center; padding: 2.2rem 0; opacity: 0.6; font-size: 0.9rem; }
@media (max-width: 1100px) {
	.rs-main { grid-template-columns: 1fr; }
	.rs-form { max-height: none; overflow: visible; position: static; }
	.rs-preview-col { position: static; }
	.rs-mobiletabs { display: flex; }
	.rs-main.show-preview .rs-form { display: none; }
	.rs-main:not(.show-preview) .rs-preview-col { display: none; }
	.rs-modal-body { grid-template-columns: 1fr; overflow-y: auto; }
	.rs-modal-grid { overflow: visible; }
	.rs-modal-side { border-left: none; border-top: 1px solid rgb(0 0 0 / 0.08); overflow: visible; }
	.rs-modal-preview { height: 420px; }
}
@media print {
	body * { visibility: hidden; }
}