:root{--versions-gap:12px}.versions-view{& .page-content{max-width:1200px;margin:0 auto;padding:16px 16px 32px}}.versions-header{align-items:center;gap:var(--versions-gap);margin-bottom:16px;display:flex;& .header-left{align-items:center;gap:12px;min-width:0;display:flex}& .back-btn{flex:none}& .versions-title{& h1{margin:0;font-size:1.35rem}& .title-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}& .title-divider{color:var(--text-tertiary)}& .snippet-link{color:var(--text-secondary);text-overflow:ellipsis;white-space:nowrap;max-width:420px;font-size:.95rem;text-decoration:none;overflow:hidden}}& .versions-subtitle{color:var(--text-secondary);margin:4px 0 0;font-size:.8rem;& a{color:inherit;text-decoration:none}}& .versions-controls{margin-left:auto}}.versions-content{gap:var(--versions-gap);grid-template-columns:minmax(220px,280px) 1fr;display:grid}.versions-list{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-secondary);min-height:240px;overflow:hidden;& .list-header{text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--border);padding:8px 12px;font-size:.8rem;font-weight:600}& .list-body{flex-direction:column;gap:6px;padding:6px;display:flex}}.version-item{cursor:pointer;border:1px solid #0000;flex-direction:column;gap:2px;padding:8px 10px;display:flex;&:hover,&.active{border-color:var(--border);background:var(--accent-light)}& .version-title{font-weight:600}& .version-meta{color:var(--text-secondary);font-size:.8rem}}.version-meta .meta-link,.detail-meta .meta-link{color:inherit;text-underline-offset:2px;text-decoration:underline}.versions-detail{border:1px solid var(--border);border-radius:var(--radius-sm);min-height:240px;padding:12px 14px;& .detail-header{justify-content:space-between;align-items:center;gap:12px;display:flex}& .detail-title h2{margin:0 0 6px;font-size:1.05rem}& .detail-meta{color:var(--text-secondary);font-size:.8rem}& .detail-summary{flex-wrap:wrap;gap:8px;margin:12px 0;display:flex}}.summary-chip{background:var(--bg-secondary);border:1px solid var(--border);border-radius:999px;padding:3px 8px;font-size:.75rem}.diff-section{margin-bottom:12px;& .diff-section-title{margin-bottom:6px;font-weight:600}}.diff-unified,.diff-split{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-primary);overflow:hidden;& pre{font-family:var(--font-mono);margin:0;padding:8px 10px;font-size:.8rem;line-height:1.45;overflow:auto}}.diff-line{&.add{color:var(--success)}&.remove{color:var(--error)}}.diff-split{grid-template-columns:1fr 1fr;display:grid;& .diff-column{border-right:1px solid var(--border);&:last-child{border-right:none}}& .diff-column-header{color:var(--text-secondary);border-bottom:1px solid var(--border);background:var(--bg-secondary);padding:6px 10px;font-size:.75rem}}.empty-state,.error-state{padding:16px}.empty-state{color:var(--text-secondary)}.error-state{color:var(--error)}@media (width<=900px){.versions-header{flex-wrap:wrap}.header-left{flex:100%}.versions-controls{width:100%;margin-left:0}.versions-content{grid-template-columns:1fr}}