.vault-page { display: flex; min-height: 100vh; flex-direction: column; }
.vault-main { padding-bottom: 80px; }
.vault-masthead { display: grid; padding: 42px 0 30px; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 28px; border-bottom: 2px solid var(--tad-ink); }
.vault-masthead h1 { margin: 9px 0; font: clamp(38px, 4.6vw, 60px)/1.08 CangErYuMo, sans-serif; }
.vault-masthead h1 em { color: var(--tad-red); font-style: normal; }
.vault-masthead p { max-width: 760px; margin: 0; color: var(--tad-muted); }
.vault-index-mark { display: flex; height: 120px; align-items: end; gap: 5px; border-bottom: 5px solid var(--tad-red); }
.vault-index-mark span { display: grid; width: 58px; place-items: center; color: #fff; background: var(--tad-blue); font: 32px CangErYuMo, sans-serif; }
.vault-index-mark span:nth-child(1) { height: 72px; }
.vault-index-mark span:nth-child(2) { height: 92px; color: var(--tad-ink); background: var(--tad-yellow); }
.vault-index-mark span:nth-child(3) { height: 112px; background: var(--tad-red); }
.vault-toolbar { display: flex; padding: 18px 0; align-items: center; justify-content: space-between; gap: 16px; }
.vault-toolbar h2 { margin: 0; font: 31px CangErYuMo, sans-serif; }
.vault-toolbar-actions { display: flex; gap: 8px; }
.filter-toggle { display: none; }
.archive-layout { display: grid; grid-template-columns: 270px minmax(0,1fr); gap: 32px; }
.vault-filters { align-self: start; padding: 20px; border: 1px solid var(--tad-line); background: #fff; }
.vault-filters header { display: flex; align-items: center; justify-content: space-between; }
.vault-filters fieldset { margin: 18px 0 0; padding: 14px 0 0; border: 0; border-top: 1px solid var(--tad-gray); }
.vault-filters legend { font-weight: 700; }
.vault-filters details { margin: 18px 0; padding-top: 13px; border-top: 1px solid var(--tad-gray); }
.vault-filters summary { cursor: pointer; }
.filter-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.filter-chips button { min-height: 32px; padding: 4px 10px; border: 1px solid var(--tad-line); background: #fff; }
.filter-chips button.active { border-color: var(--tad-red); color: #fff; background: var(--tad-red); }
.filter-checks { display: grid; margin: 8px 0; gap: 6px; }
.filter-checks label { display: flex; align-items: center; gap: 7px; }
.vault-results-status { min-height: 24px; color: var(--tad-muted); }
.submission-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.submission-card { display: grid; min-height: 226px; grid-template-columns: 56px 1fr; border: 1px solid var(--tad-line); background: #fff; text-decoration: none; overflow: hidden; }
.submission-card:hover { border-color: var(--tad-blue); box-shadow: 0 10px 30px rgb(44 23 70 / 10%); }
.submission-code { display: grid; place-items: center; color: #fff; background: var(--tad-blue); font: 19px CangErYuMo, sans-serif; writing-mode: vertical-rl; }
.submission-card[data-category="module"] .submission-code, .submission-card[data-category="function"] .submission-code { background: var(--tad-red); }
.submission-card[data-category="reality"] .submission-code { color: var(--tad-ink); background: var(--tad-yellow); }
.submission-body { padding: 18px; }
.submission-body small { color: var(--tad-muted); }
.submission-body h3 { margin: 8px 0; font: 25px/1.25 CangErYuMo, sans-serif; }
.submission-body p { color: var(--tad-muted); }
.submission-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.submission-tags span { padding: 2px 6px; color: var(--tad-blue); background: #eef2fb; font-size: 11px; }
.submission-stats { margin-top: 16px; color: var(--tad-muted); font-size: 12px; }

.vault-content-header { padding: 44px 0 24px; border-bottom: 2px solid var(--tad-ink); }
.vault-content-header h1 { margin: 9px 0; font: 46px/1.15 CangErYuMo, sans-serif; }
.vault-detail-layout { display: grid; padding: 30px 0; grid-template-columns: minmax(0,1fr) 250px; gap: 34px; }
.vault-detail-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.vault-detail-body { margin-top: 24px; line-height: 1.9; }
.vault-detail-body h1,.vault-detail-body h2,.vault-detail-body h3 { font-family: CangErYuMo, sans-serif; }
.vault-detail-body iframe { width: 100%; height: 620px; border: 1px solid var(--tad-line); }
.vault-meta { margin: 0; padding: 20px; background: #f1edf3; }
.vault-meta dt { color: var(--tad-muted); font-size: 11px; }
.vault-meta dd { margin: 0 0 14px; }
.comment-section { margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--tad-line); }
.comment-list { display: grid; gap: 8px; }
.comment { padding: 13px 15px; border-left: 4px solid var(--tad-blue); background: #fff; }
.comment.reply { margin-left: 28px; }
.comment small { color: var(--tad-muted); }
.comment-form { display: grid; margin-top: 14px; grid-template-columns: 1fr auto; align-items: end; gap: 8px; }

.vault-form-shell { padding: 36px 0 70px; }
.stepper { display: grid; margin: 24px 0 30px; grid-template-columns: repeat(3,1fr); }
.stepper button { min-height: 52px; border: 0; border-bottom: 3px solid var(--tad-line); color: var(--tad-muted); background: transparent; text-align: left; }
.stepper button.active { border-color: var(--tad-red); color: var(--tad-ink); }
.stepper button span { display: block; color: var(--tad-red); font: 10px Consolas,monospace; }
.submission-form { padding: 28px; border: 1px solid var(--tad-line); background: #fff; }
.submission-step { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.submission-step .full { grid-column: 1/-1; }
.form-navigation { display: flex; margin-top: 26px; justify-content: space-between; gap: 8px; }
.markdown-preview { min-height: 180px; max-height: 420px; padding: 18px; border: 1px solid var(--tad-line); background: var(--tad-surface); overflow: auto; }
.review-summary { display: grid; grid-template-columns: 180px 1fr; border-top: 1px solid var(--tad-line); }
.review-summary dt,.review-summary dd { margin: 0; padding: 10px; border-bottom: 1px solid var(--tad-line); }
.review-summary dt { color: var(--tad-muted); }

.account-layout { display: grid; padding: 30px 0; grid-template-columns: 240px minmax(0,1fr); gap: 30px; }
.account-summary { align-self: start; padding: 20px; border-left: 5px solid var(--tad-red); background: #fff; }
.account-summary h2 { margin: 0; font: 27px CangErYuMo,sans-serif; }
.account-list { display: grid; gap: 10px; }
.account-item { padding: 18px; border: 1px solid var(--tad-line); background: #fff; }
.account-item header { display: flex; align-items: start; justify-content: space-between; gap: 12px; }
.account-item h3 { margin: 0; font: 23px CangErYuMo,sans-serif; }
.account-item small { color: var(--tad-muted); }
.account-item-actions { display: flex; margin-top: 14px; flex-wrap: wrap; gap: 7px; }

@media (max-width: 900px) { .archive-layout { grid-template-columns: 1fr; } .filter-toggle { display: inline-flex; } .vault-filters { display: none; } .vault-filters.open { display: block; } .vault-detail-layout,.account-layout { grid-template-columns: 1fr; } }
@media (max-width: 650px) { .vault-masthead { grid-template-columns: 1fr; } .vault-index-mark { display: none; } .submission-grid { grid-template-columns: 1fr; } .vault-toolbar { align-items: flex-start; flex-direction: column; } .submission-step { grid-template-columns: 1fr; } .submission-step > * { grid-column: 1 !important; } .stepper button { font-size: 12px; } .comment-form { grid-template-columns: 1fr; } }